invoke ModalPopUp from GridView button

I've got a ModelPopUp that works just fine from a LinkButton.

Now I need to launch the popup from a button in a GridView column/cell. Is there a way to specify that button in TargetControlID property - or is there another way I can programmatically invoke the modalpopup?

I Have a similar problem. I need to launch the popup from a treeview node, with the added hassle that I also need the modal popup to know the Id of the tree node that poped it up!

If I find a solution, I will post here for you.

Well, I can't say this is real elegant, but the way I do it is to put a button on the form, outside of the GridView and set its class so it's not visible (Make sure you use a style and not God forbid, the control's visible property!) Use this button's ID as your TargetControlID.

Attach a client side script to the button in your GridView that is supposed to launch the popup. In the script, call the fake button's click event.

So the code will be something like this:

<asp:ButtonID="ProxyButton"runat="server"CssClass="hidden"/>

<atlasToolkit:ModalPopupPropertiesTargetControlID="ProxyButton" .../>

In the GridView:

<asp:ImageButtonID="..."runat="server"OnClientClick="fakeClick()" .../>

The script:

function fakeClick() {

$('ProxyButton').click();

}

Hope it helps.

Kathy

Thanks Kathy - this does invoke the modal dialog just fine, but it generates two problems I'm hoping you can help with. The first is that the ProxyButton postback clears the modal just as soon as it's shown. Second, I don't know how to access the commandargument from the script - this contains the ID of which grid row the button was clicked on.

Any help?

As for the first problem, I don't think that the proxy button's postback is causing the refresh. It's a fake click after all. It's most probably the button in the GridView (or imagebutton or linkbutton or whatever it is). I don't know your exact scenario, but you may want to consider one of the following options:

1- Use an html control in your grid to invoke the click event of the fake button. Something like a simple div or img with its onclick event set to fakeClick(). As you know these won't cause a postback.

2- Enclose your GridView in an atlas:UpdatePanel. This will keep the button from posting back, too.

As for the second one, if you populate your GridView in the code (as opposed to automatically), you can bind the click event there and pass whatever argument you want, in there, too. Like say you want to launch the popup upon clicking an imagebutton control called Modify, in the grid, and you want to pass the ID of the record as the argument (assuming you got the value in sID and assuming you write VB code):

Dim ibModifyAs ImageButton

ibModify =CType(e.Row.FindControl("Modify"), ImageButton)

ib.Attributes.Add("onClick","fakeClick('" & sID &"')")

If you populate the grid automatically, there is a syntax for doing this in the aspx code itself, but I'm not sure of it. So the good news is that tt can be done and the bad news is that you have to do a little more searching on it. (I will post it if I remember it!)

Now you have to alter the fakeClick script to accept an input argument. You can pass it from there and do anything you want to do. Just to give you a heads up, if you are trying to populate your popup control dynamically, I hope you just have a little html code that needs to go in there. If you want to populate it dynamically, with server controls and all, you're in for a ride :)

Hope this helps.

Kathy

Hi everyone,

You might be interested in checking outhttp://forums.asp.net/thread/1404770.aspx which provides an example of invokingModalPopup from the server in response to aCommand event.

Thanks,
Ted

Are you sure that your javascript will work!?

function fakeClick() {

$('ProxyButton').click();

}

I think NO, becauseProxyButton is asp:Button

and $('ProxyButton') will be NULL, /$('ProxyButton')=document.getElementById('ProxyButton'), butProxyButton should be HTML element

What you think?

Hi StoyanPetrov,

The JavaScript should be fine - the asp:Button will render an HTML DOM element with the same name which then gets picked up by $.

Thanks,
Ted

Hi,

I've been trying to do the same thing and as mentioned above. The page does do an AJAX postback which will cause all the controls to be reset and hence the popup to disappear( you can test this by putting a breakpoint on the Page_Load function).

I found a fairly clumsy way around this. you basically have to do the following.

i) add an event handler for OnRowCreated for the gridview and bind an event handler to the button. In this case called ButtonX

protected void RowAdding(object o,GridViewRowEventArgs e)
{
ImageButton ib=(ImageButton)e.Row.FindControl("ButtonX");
if (ib != null)
{

ib.Click += new ImageClickEventHandler(ib_Click);

}

}

ii) in that event handler store the popup state in the session and refresh the updatepanel

void ib_Click(object sender, ImageClickEventArgs e)
{
Session["ShowPane"] = "1";
UpdatePanel1.Update();

}

iii) override the render and show the panel based on the session

protected override void Render(HtmlTextWriter writer)
{

if (Session["ShowPane"] != null)
{
if (Session["ShowPane"].ToString() == "1")
{
ModalPopupExtender1.Show();
}
}

base.Render(writer);
}

I think the smart thing to do would be to stop the postback in the firstplace, does anyone know how to do this?