?
Solved

ajax ModalPopupExtender and CommandName clash

Posted on 2011-02-28
13
Medium Priority
?
814 Views
Last Modified: 2012-05-11
I am trying to get an image button inside a itemTemplate in a gridview to select the current row on click and show a popup window as well. the problem is when the popup extender is present it doesn't allow the command name to run and wont select the current row. if i take the popup extender off it lets me use the button to select the row. here is the code i have for the item template:

                <asp:TemplateField>
                <ItemTemplate>
                    <asp:ImageButton ID="ImageButton1" CommandName="Select" runat="server" />

                    <asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" CancelControlID="btnCancel1"
                        TargetControlID="ImageButton1" PopupControlID="Panel5" BackgroundCssClass="ModalPopupBG">
                    </asp:ModalPopupExtender>

                </ItemTemplate>
                </asp:TemplateField>

Open in new window

0
Comment
Question by:houlahan
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 7
  • 6
13 Comments
 
LVL 41

Expert Comment

by:guru_sami
ID: 35000376
I don't know the exact way to make it work but may be see if you can do a manual postback depending on the user click inside your popup panel.

If it is just a simple alert message you can try javascript confirm box like shown here:
http://msdn.microsoft.com/en-us/library/bb428868.aspx

You can also try using jquery confirm dialog to popup in the same way as confirm box in above link.
http://jqueryui.com/demos/dialog/#modal-confirmation
0
 

Author Comment

by:houlahan
ID: 35000427
the popup panel contains alot of other controls which susing the selected value populates the text fields and such forth so i kinda needed both to work together
0
 
LVL 41

Expert Comment

by:guru_sami
ID: 35000557
Hmmm ...so you mean you are populating your selected record details in modal popup?

If so check this: http://mattberseth.com/blog/2008/04/masterdetail_with_the_gridview.html

Let me know if I am still misunderstanding.
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 

Author Comment

by:houlahan
ID: 35006321
hmm not really i have some label fields which display the data that has been selected then the user can then type some data in to some textfields and then it submits it in to another table.
0
 
LVL 41

Expert Comment

by:guru_sami
ID: 35008171
I haven't exactly tried that but from my understanding the idea should remain the same. Upon Select click you populate your labels etc and then call Show() method of the Modal and upon save click you save the data and hide the modal.
0
 

Author Comment

by:houlahan
ID: 35019730
yes is very much the same the only problem i have is accessing the model because it only exists inside the <ItemTemplate> im unsure how to access it cos i cant just call ModalPopupExtender1.show as ModalPopupExtender1 doesn't exist only if i would to call it inside of the itemTemplate is they anyway to define it so i can access it within the vbcode?
0
 
LVL 41

Expert Comment

by:guru_sami
ID: 35019993
I think only one modal would suffice and don't see a need to include inside of ItemTemplate.

But what you can try is finding the ModalPopupExtender1 inside of the item which you determine inside the ImageButton's Command event.
0
 

Author Comment

by:houlahan
ID: 35020052
if the model isn't inside the itemTemplate then it cant find ImageButton1 as it only exists inside of the itemTemplate
0
 
LVL 41

Expert Comment

by:guru_sami
ID: 35020133
When you put modal outside of ItemTemplate, you don't have to use TargetControlID="ImageButton1", instead you use a dummy button on the page. Set that button invisible because Showing the modal will be handled from code-behind and not upon button click directly.
0
 

Author Comment

by:houlahan
ID: 35031532
Ive tried that but the problem i still face is that i cant then access the ModalPopupExtender from the code because it only exists inside the itemTemplate so the code that i tried to use:

    Protected Sub GridView2_RowCommand(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewCommandEventArgs) Handles GridView2.RowCommand
        Select Case e.CommandName
            Case "Select"
                ModalPopupExtender1.show() 'cant access
        End Select
    End Sub

Open in new window


wont work because its not defined
0
 
LVL 41

Accepted Solution

by:
guru_sami earned 2000 total points
ID: 35032948
I am not sure why you need modal inside of gv and not outside like the sample link.
And yes the way you are trying to find won't work but try finding like this:


Protected Sub GridView2_RowCommand(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewCommandEventArgs) Handles GridView2.RowCommand
        Select Case e.CommandName
            Case "Select"
                Dim index As Integer = Convert.ToInt32(e.CommandArgument)

               ' Retrieve the row that contains the button clicked 
              ' by the user from the Rows collection.
              Dim row As GridViewRow = ContactsGridView.Rows(index)
             //Here find your  modal in the row
            ModalPopupExtender mp = DirectCast(row.FindControl("ModalPopupExtender 1"),ModalPopupExtender )
           mp.Show()
        End Select
    End Sub

Open in new window

0
 

Author Comment

by:houlahan
ID: 35035155
Thank you ever so much for you help! finally it works!! here is the code i ended up with for anyone else who has this problem:

</HeaderTemplate>
                <ItemTemplate>
                    <asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" CancelControlID="btnCancel"
                        TargetControlID="MpeFakeTarget" PopupControlID="Panel1" BackgroundCssClass="ModalPopupBG">
                    </asp:ModalPopupExtender>
                    <asp:ImageButton ID="Image1" runat="server" CommandName="Select" CommandArgument='<%# Container.DataItemIndex %>'
                        ImageUrl="~/images/Upload-icon.png" />
                    <asp:Button ID="MpeFakeTarget" runat="server" CausesValidation="False" Style="display: none" />
                </ItemTemplate>
            </asp:TemplateField>

Open in new window


    Protected Sub GridView2_RowCommand(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewCommandEventArgs) Handles GridView2.RowCommand
        Select Case e.CommandName
            Case "Select"
                Dim index As Integer = Convert.ToInt32(e.CommandArgument)

                ' Retrieve the row that contains the button clicked 
                ' by the user from the Rows collection.
                Dim row As GridViewRow = GridView2.Rows(index)
                'Here find your  modal in the row
                Dim mp As ModalPopupExtender
                mp = DirectCast(row.FindControl("ModalPopupExtender1"), ModalPopupExtender)
                mp.Show()

        End Select
    End Sub

Open in new window


also the reason the modal has to be inside the gv is because the MpeFakeTarget, and the ImageButton only exist inside the itemTemplate.

Thank you again for your help.
0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

jQuery is a JavaScript library that greatly simplifies JavaScript programming. AJAX is an acronym formed from "Asynchronous JavaScript and XML."  AJAX refers to any communication between client and server, when the human client does not observe a…
The most up-to-date version of this article is on my Blog https://iconoun.com/blog/
In this brief tutorial Pawel from AdRem Software explains how you can quickly find out which services are running on your network, or what are the IP addresses of servers responsible for each service. Software used is freeware NetCrunch Tools (https…
In this video, Percona Solution Engineer Dimitri Vanoverbeke discusses why you want to use at least three nodes in a database cluster. To discuss how Percona Consulting can help with your design and architecture needs for your database and infras…
Suggested Courses

741 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question