更新面板和中继器切换功能答案

【问题标题】：Update panel and Repeater toggle function更新面板和中继器切换功能
【发布时间】：2013-11-06 08:14:22
【问题描述】：

在将更新面板放置到我的转发器详细信息划分后，转发器在每次单击编辑按钮或其他按钮时都会崩溃。（转发器具有带有切换功能的标题和详细信息划分）我有一个隐藏的文件，可以帮助编辑更新...而不会折叠详细信息部门。在添加更新面板之前，当我单击转发器详细信息部分的“编辑”按钮时，文本框将变为启用状态，并将显示“取消”和“保存”按钮out collapsing.After 添加更新面板 EDIT,UPDATE,SAVE,CANCEL 一切工作正常，但每次点击详细信息部分正在折叠，我必须展开以进行更新。添加更新面板后，项目命令中的所有代码都可以正常工作，除了上面提到的点击编辑时折叠问题。

代码如下

 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>      
     <asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1">
<ItemTemplate>

 <div id='h<%# DataBinder.Eval(Container, "ItemIndex") %>' class="heder"
      onclick='ToggleDisplay(<%# DataBinder.Eval(Container, "ItemIndex") %>);' style="border-style: none; font-weight: normal;">

     <asp:Panel ID="Panel3" runat="server" Height="30px" BorderStyle="None" BackColor="#DCE4FA">
      <asp:HiddenField ID="hdnItemIndex" runat ="server" Value='<%# DataBinder.Eval (Container, "ItemIndex") %>' />
          <%# DataBinder.Eval(Container.DataItem, "LicenseID")%> 

   </asp:Panel> 
   </div>

  <div id='d<%# DataBinder.Eval(Container, "ItemIndex") %>' class="details">


     <asp:Panel ID="Panel2" runat="server" Height="195px" BackColor="Gray" Font-Bold="False"  ForeColor="Maroon">
    <br />
        <asp:TextBox ID="TextBox2" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"LicenseName")%>' Enabled="false" BackColor="Gray"  BorderStyle="None"></asp:TextBox>
       <asp:LinkButton ID="lnkEdit" runat="server" CommandName="edit"  CommandArgument='<%# DataBinder.Eval(Container.DataItem, "LicenseID") %>' Font-Bold="True" ForeColor="Black" >Edit</asp:LinkButton>

                              </asp:Panel>
       </div>
  </ItemTemplate>
     </asp:Repeater>

 </ContentTemplate>
 </asp:UpdatePanel>

代码背后

     Protected Sub Repeater1_ItemCommand(source As Object, e As  System.Web.UI.WebControls.RepeaterCommandEventArgs) Handles Repeater1.ItemCommand

    If e.CommandName.ToLower() = "edit" Then
        Dim hdnItemIndex As HiddenField = DirectCast(DirectCast(e.CommandSource, LinkButton).NamingContainer.FindControl("hdnItemIndex"), HiddenField)
        Dim myScript As String = "ToggleDisplay(" + hdnItemIndex.Value & ");"

        Page.ClientScript.RegisterStartupScript(Me.[GetType](), "RegisterStartupScript", myScript, True)

    End If

  For Each rptItem As RepeaterItem In Repeater1.Items
        Dim Textbox1 As TextBox = DirectCast(rptItem.FindControl("Textbox1 "), TextBox)
        If Textbox1 IsNot Nothing Then
            Response.Write(Textbox1.Text)
        End If
    Next
  If e.CommandName = "edit" Then

 DirectCast(e.Item.FindControl("TextBox2"), TextBox).Enabled = True
        DirectCast(e.Item.FindControl("Textbox2"), TextBox).BorderStyle = BorderStyle.NotSet
        DirectCast(e.Item.FindControl("Textbox2"), TextBox).BackColor = Drawing.Color.White

 End if

提前致谢

【问题讨论】：

标签： asp.net vb.net updatepanel

【解决方案1】：

有几种方法可以实现这一点，

第一

</ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="Yourcontrol" EventName="YourEvent" />
    </Triggers>
</asp:UpdatePanel>

第二：

您也可以使用 AJAX（不是 .NET 简易版）

而不是使用 .NET AJAX 库（这是完全退出的。您可以添加一些脚本将字符串发布到特定 URL。然后该 URL 将执行您喜欢的任何操作

function btnAddMeter() {
        $.ajax({
            type: 'POST',
            url: "MeterIntake.aspx/AddMeter?"
                + "discipline=" + $('#ddlDisciplines').val()
                + "&meterType=" + $('#ddlMeteringType').val()
                + "&description=" + $('#ddlDescription').val()
                + "&meternumber=" + $('#txtMeterNumber').val(),
            contentType: 'application/json; charset=utf-8',
            datatype: 'json',
            success: function (data) {
                try {
                    if (data.d == "Invalid") {
                        document.getElementById('lblValidation').innerHTML = "Ongeldige invoer!";
                    }
                    if (data.d == "Exists") {
                        document.getElementById('lblValidation').innerHTML = "Meter is reeds eerder binnengeboekt";
                        document.getElementById('txtMeterNumber').value = "";
                        document.getElementById('txtMeterNumber').focus();
                    }
                    else {
                        $('#ScanTable > tbody:last')
                            .append("<tr>" +
                            "<td>" + data.d.discipline + "</td>" +
                            "<td>" + data.d.meterType + "</td>" +
                            "<td>" + data.d.description + "</td>" +
                            "<td>" + data.d.meternumber + "</td>" +
                            "</tr>");
                        document.getElementById('txtMeterNumber').value = "";
                        document.getElementById('txtMeterNumber').focus();
                        document.getElementById('lblValidation').innerHTML = "";
                    }
                }
                catch (e) {
                    alert("Error in service! Please try again");
                }
            }
        });
    }

您应该将其替换为您自己的代码/控件。

希望对你有帮助。

【讨论】：