Showing posts with label visible. Show all posts
Showing posts with label visible. Show all posts

Wednesday, March 28, 2012

Modal Popup Extender and set focus

I want to set focus on a textbox inside the modal popup extender when it is made visible and I cant for the life of me find an appropriate way to do this!

The popupcontrol is not good because when I add the attribute onclick it gets run before the textbox is made visible!

Any clues?

Cheers

Ross

Sorry, I hate to bump this but could really do with knowing how this can be done.

Ross


You can try registering a clientside startup script that sets focus to the text box. Or you can use the clientside script to open the modal popup and then set the focus.

#1:

page.ClientScript.RegisterStartupScript(me.getType(), "setfocus", "<script language=""javascript"">$get('textbox1').focus();</script>")

#2:

<script language="javascript">

function openModal(){

$find('modalpopupextender1').show();

$get('textbox1').focus();

}

</script>

The ids of the mpe and the textbox will need to be the client rendered id, so if you are using a masterpage or if this is in a user control, you will need to get the clientid from the server or from the output of the page prior to implimenting the code.

Let me know if need anyhting else.

-Alan


the solution in this article worked for me (although i would like to see something much better)

http://www.aspdotnetcodes.com/ModalPopup_Postback.aspx

then you add something similar to the following in the Page_Load event:

btn.Attributes.Add("onclick","fnSetFocus('" + control.ClientID +"');");


hi

go to the following link

http://forums.asp.net/t/1103365.aspx

Monday, March 26, 2012

Modal popup isnt visible

I have a panel and a modalpopupextender on my page. Everything is very simple and exactly like the examples I've seen. The problem is that if I set the display attribute of the panel to "none" - as all the examples show - the panel isn't visible when it's popped up. The main page greys out and is inactive but I can't see the popup panel. If I remove the "display: none" from the panel stylesheet then everything works perfectly except that the panel is briefly visible when the page first renders. It instantly disappears but causes the page to flicker.

I'm not using a master page and I have ajax toolkit 1.0.10301.1

Any ideas?

Could you post a small, self-sufficient repro that demonstrates your problem? It seems like it should just work from what you are describing.
Here is the stylesheet 
.ReImportPanel{/*visibility:<span class='val'> hidden</span>;*/ font-size:small; border-width:medium; border-color:#3C6B34; border-style:solid; border-width:medium; width:500px; background-color: #ebebdf;}.modalBackground{ background-color:Silver; filter:alpha(opacity=70); opacity:0.7;}
 
Here is the page
 
<%@. Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title> <link href="StyleSheet.css" rel="stylesheet" type="text/css" /></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <div> <cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" Y=100 DropShadow="true" PopupControlID="pnlReimport" OkControlID="btnClosePopup" CancelControlID="btnClosePopup" BackgroundCssClass="modalBackground" TargetControlID="Button1"> </cc1:ModalPopupExtender> <asp:Panel ID="pnlReimport" runat="server" CssClass="ReImportPanel" Width="500px" HorizontalAlign="Center"> <h3> Popup Dialog</h3> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <br /> <br /> <asp:Button ID="btnClosePopup" runat="server" Text="Close" /> </asp:Panel> <asp:Button ID="Button1" runat="server" CausesValidation="False" Text="Show Popup" /> </div> </form> </body></html>

Here is the stylesheet 
.ReImportPanel{/*visibility:hidden*/ font-size:small; border-width:medium; border-color:#3C6B34; border-style:solid; border-width:medium; width:500px; background-color: #ebebdf;}.modalBackground{ background-color:Silver; filter:alpha(opacity=70); opacity:0.7;}
 
Here is the page
 
<%@. Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title> <link href="StyleSheet.css" rel="stylesheet" type="text/css" /></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <div> <cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" Y=100 DropShadow="true" PopupControlID="pnlReimport" OkControlID="btnClosePopup" CancelControlID="btnClosePopup" BackgroundCssClass="modalBackground" TargetControlID="Button1"> </cc1:ModalPopupExtender> <asp:Panel ID="pnlReimport" runat="server" CssClass="ReImportPanel" Width="500px" HorizontalAlign="Center"> <h3> Popup Dialog</h3> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <br /> <br /> <asp:Button ID="btnClosePopup" runat="server" Text="Close" /> </asp:Panel> <asp:Button ID="Button1" runat="server" CausesValidation="False" Text="Show Popup" /> </div> </form> </body></html>

Modal Popup Scrollable

I have a grid view inside a modal popup, here is my question: how can i make modal popup scrollable (keep visible) when gridview contains too many rows? Right now all the rows beyond page are remain invisible even I scrolled the scrollbar on the side? Thanks i advance.Try to put that grid inside div with css

overflow: auto


You will need to fix the size of the div too!

Saturday, March 24, 2012

Modal popup visibility and background...

My ModalPopup panel is being visible before its disappears..

It flicks on the screen int the HTML load...
How can I fix this?

And...What is the style of modalPopoupExtender demo in atlas control toolkit site?

How can I make one similiar?

thanx!Please see FAQ #1 (http://forums.asp.net/thread/1293293.aspx#1) and StyleSheet.css in the root of the SampleWebSite.
Hi...Thanx...
BUT...I got three problems...

First...modalBackground stylesheet doesn't work in Firefox..because opacity and filter properties...
and..
Second...modalBackground stylesheet doesn't work with Dropdownlist control..it remains with default style...

finally...my last problem is that style="visibility:false;" doesn't work...

I just want to make something similiar to Insert Code modal of this page...with all components behind disabled and with low opacity...and it is hide on pageload =D..
this can't be so difficult...I also would like to load my usercontrol inside the modalpopup panel...BUT...is very difficult work with updatepanel and modalpopup together...

here is my code:

"DivRegisterUnit" style="visibility:false;"> "LabelUnitID" runat="server" Text="ID:"> "TextBoxUnitID" runat="server"> "LabelUnitDescription" runat="server" Text="Descri??o:"> "TextBoxUnitDescription" runat="server"> "ButtonRegisterUnit" runat="server" Text="Salvar" />

"MpeRegisterUnit" runat="server"> "modalBackground" OkControlID="ButtonRegisterUnit" PopupControlID="DivRegisterUnit" TargetControlID="LinkButtonRegisterUnit" />

<div id="DivRegisterUnit"> <asp:Label ID="LabelUnitID" runat="server" Text="ID:"></asp:Label> <asp:TextBox ID="TextBoxUnitID" runat="server"></asp:TextBox> <asp:Label ID="LabelUnitDescription" runat="server" Text="Descri??o:"></asp:Label> <asp:TextBox ID="TextBoxUnitDescription" runat="server"></asp:TextBox> <asp:Button ID="ButtonRegisterUnit" runat="server" Text="Salvar" /> </div> <cc1:modalpopupextender id="MpeRegisterUnit" runat="server"> <cc1:ModalPopupProperties BackgroundCssClass="modalBackground" OkControlID="ButtonRegisterUnit" PopupControlID="DivRegisterUnit" TargetControlID="LinkButtonRegisterUnit" /> </cc1:modalpopupextender>

Hi...
I resolved two of my three problems :P

First...I was wrong...
Third...I used "visible:none;"

the only one that I can't fix was the dropdownlist problem...

thanx..
If the issue is that the dropdown remains visible when the ModalPopup is displayed, the reason can be found in the FAQ. Our next release will have a workaround for this; you can get the code from CodePlex now if you want to try it out early.