Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Update Panel and triggers from a repeater control

Hi I found code similiar to the following online. It's seems really great for getting a button buried in a repeater control to trigger a full cycle back to the server.

<asp:ScriptManager ID="ScriptManager1" runat="server"> 
        </asp:ScriptManager> 

        <asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
            <ContentTemplate> 
                <%=DateTime.Now.ToString() %> 
            </ContentTemplate> 
            <Triggers> 
                <asp:PostBackTrigger ControlID="HiddenButton" /> 
            </Triggers> 
        </asp:UpdatePanel> 

        <!--Make a hidden button to treat as the postback trigger--> 
        <asp:Button ID="HiddenButton" runat="server" Style="display: none" Text="HiddenButton" /> 


        <asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1"> 
            <ItemTemplate> 
                 <!--when cick the button1, it will fire the hiddenButton--> 
                <asp:Button ID="Button1" Text="Trigger" CommandArgument='<%# Eval("Id") %>' OnClientClick="$get('HiddenButton').click();return false;" 
                    runat="server" /> 
            </ItemTemplate> 
        </asp:Repeater>

It uses a hiddenButton to achieve this by hooking the click event of the original button to this one. However my addition to this was the setting of the CommandArgument for the button. I would also need it to be set for the HiddenButton.

Does anyone know a way of going about this?

like image 652
Coder 2 Avatar asked Apr 18 '11 23:04

Coder 2


1 Answers

First I will like to explain the Disadvantage of using the Update Panel using the very same example posted by you.

Below is the Original Code

enter image description here


Output

enter image description here


To display the 22 character string you can check how much data is being received and sent to server. Just imagine following

  1. If you would consider send each request to Database using Update Panel and your GridView is in Update Panel!!!!!!
  2. Suppose you would use ViewState data for each request and with GridView Inside the Update Panel.

Both the above techniques are worst as per my understanding.


Now I will describe you Page Methods

Page Method over Update panel

Page Methods allow ASP.NET AJAX pages to directly execute a Page’s Static Methods, using JSON (JavaScript Object Notation). Instead of posting back and then receiving HTML markup to completely replace our UpdatePanel’s contents, we can use a Web Method to request only the information that we’re interested.

Sample Code

enter image description hereenter image description here


Output

enter image description here

Hope this clearly explains the difference of usage.


Answer to the original Query

You have to register the ItemDataBound event of the below Repeater and use below code for it.

Code Behind

protected void Repeater1_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
    if (e.Item.ItemType == ListItemType.Item || 
                           e.Item.ItemType == ListItemType.AlternatingItem)
    {
        Button btn = (Button)e.Item.FindControl("Button1");
        btn.OnClientClick = string.Format("SubmitButton('{0}');return false;"
                                                        , HiddenButton.ClientID);

    }
}

JavaScript

<script type="text/javascript">
     function SubmitButton(btn)
     {
         $("#" + btn).click(); 
     }
</script>

//Alternative

<script type="text/javascript">
     function SubmitButton(btn)
     {
         document.getElementById(btn).click(); 
     }
</script>

Reference & Here

like image 185
Pankaj Avatar answered Sep 28 '22 07:09

Pankaj