中继器中的链接第一次仅在更新面板控件内工作

Posted 2023-05-09

【中文标题】中继器中的链接第一次仅在更新面板控件内工作

【英文标题】：link in the repeater first time only working inside the update panel control

【发布时间】：2018-11-02 04:22:38

【问题描述】：

我有用于显示网格视图和列表视图的链接按钮，并且我有使用 datalist 控件的分页，所有这些都在更新面板中。

分页和 listview 链接按钮和 gridview 链接按钮在第一次加载时工作正常，但问题是当我在更新面板中执行任何操作时，例如移动到下一页或将 gridview 更改为 listview 然后 <a> 标签链接中继器控件不起作用。

我在中继器控件内有订单按钮，这将弹出模式以选择数量并添加到购物车选项，但<a> 标签不起作用它不显示模式。

这个<a> 标签不起作用：

<a class="cur-pointer order button"
  data-uid="<%#Container.DataItem("unit")%>"
  data-uname="<%#Container.DataItem("UnitName")%>"
  data-price="<%#Container.DataItem("price")%>"
  data-pro-name="<%#Container.DataItem(productName)%>"
  data-iid="<%#Container.DataItem("ItemId")%>">
  <strong>
    <asp:Literal runat="server" Text="<%$Resources:Resource,Order %>"></asp:Literal>
  </strong>
</a>

完整代码在这里：

<div class="row" style="padding: 0px 0px 41px 0px;">
  <asp:UpdatePanel ID="UpdatePanel1" runat="server">
      <ContentTemplate>
          <div class="sort-grid">
              <div class="col-md-4 ">
                  <div class="sorting hiddenview">
                      <asp:LinkButton ID="gridlink" runat="server" CssClass="icongridlist"><i class="gridicon"></i></asp:LinkButton>
                      <asp:LinkButton ID="listlink" runat="server" CssClass="icongridlist"><i class="fa fa-list" style="color:#fff;"></i></asp:LinkButton>
                  </div>
              </div>
              <div class="col-md-4 col-md-offset-4">
                  <div class="sorting pagingdropdownmob">
                      <%-- style="width: 91px;"--%>
                      <h6>Show</h6>
                      <asp:DropDownList runat="server" ID="dropdownlist" Style="width: 42px;" AutoPostBack="True" OnSelectedIndexChanged="lbtnFirst_Click">
                          <%--AppendDataBoundItems = "true"--%>
                          <asp:ListItem Selected="True" Text="10" Value="10"></asp:ListItem>
                          <asp:ListItem Text="15" Value="15"></asp:ListItem>
                          <asp:ListItem Text="30" Value="30"></asp:ListItem>
                          <asp:ListItem Text="45" Value="45"></asp:ListItem>
                      </asp:DropDownList>
                      <div class="clearfix"></div>
                  </div>
                  <div class="sorting paginglistmob">
                      <h6>Page:&nbsp;</h6>
                      <%--  <asp:LinkButton ID="lbtnFirst" runat="server" CausesValidation="false" OnClick="lbtnFirst_Click" ></asp:LinkButton> &nbsp;--%>
                      <asp:LinkButton ID="lbtnPrevious" runat="server" CausesValidation="false" OnClick="lbtnPrevious_Click"><i class="fa fa-caret-left hoverclr"></i></asp:LinkButton>&nbsp;
   <span>
       <asp:DataList ID="dlPaging" runat="server" RepeatDirection="Horizontal" OnItemCommand="dlPaging_ItemCommand"
           OnItemDataBound="dlPaging_ItemDataBound" Style="display: inline-block;">
           <ItemTemplate>
               <asp:LinkButton ID="lnkbtnPaging" runat="server" Style="color: #000;" CommandArgument='<%# Eval("PageIndex") %>'
                   CommandName="Paging" Text='<%# Eval("PageText") %>'></asp:LinkButton>&nbsp;
           </ItemTemplate>
       </asp:DataList>
       <asp:LinkButton ID="lbtnNext" runat="server" CausesValidation="false"
           OnClick="lbtnNext_Click"><i class="fa fa-caret-right hoverclr"></i></asp:LinkButton></span>
                      <%-- <asp:LinkButton ID="lbtnLast" runat="server" CausesValidation="false" OnClick="lbtnLast_Click">Last</asp:LinkButton></span>--%>
                  </div>
              </div>
              <div class="clearfix"></div>
          </div>
      </ContentTemplate>
  </asp:UpdatePanel>
</div>
<div class="row">
<asp:UpdatePanel ID="UpdatePanel3" runat="server" ChildrenAsTriggers="true">
<ContentTemplate>
<div class="single-pro">
    <asp:PlaceHolder ID="phItem" runat="server" Visible="false">
        <asp:Repeater ID="rptItem" runat="server">
            <ItemTemplate>
                <div class="col-md-3 col-sm-6 product-men">
                    <%--    col-md-4 col-sm-6--%>
                    <div class="men-pro-item simpleCart_shelfItem">
                        <div class="men-thumb-item">
                            <a href="javascript:void(0);">
                                <img  class="pro-image-front" src="<%#Container.DataItem("ImageSrc")%>">
                                <img  class="pro-image-back" src="<%#Container.DataItem("ImageSrc")%>">
                            </a>
                            <div class="men-cart-pro" style="padding-bottom: 8px;">
                                <div class="inner-men-cart-pro">
                                    <asp:LinkButton runat="server"><a href="<%#Container.DataItem("ImageSrc")%>" class="link-product-add-cart image-link"><i class="glyphicon glyphicon-zoom-in"></i> &nbsp;View</a></asp:LinkButton>
                                </div>
                            </div>
                        </div>
                        <%--men thumb item--%>
                        <div class="item-info-product ">
                            <h5 style="font-size: 16px; font-weight: 900; padding-left: 0px; padding-right: 0px; height: 42px; line-height: 17px;" class="m-none h-initial"><strong><%#Container.DataItem(productName)%></strong></h5>
                            <%--height:33px;--%>
                            <div class="info-product-price">
                                <strong><span class="item_price"><%#Container.DataItem("price")%> </span><%=GetGlobalResourceObject("Resource", "Currency")%><span> /<%#Container.DataItem("UnitName")%></span>
                            </div>
                            <div class="snipcart-details top_brand_home_details item_add single-item link-product-add-cart ">
                                <a class="cur-pointer order button" data-uid="<%#Container.DataItem("unit")%>" data-uname="<%#Container.DataItem("UnitName")%>" data-price="<%#Container.DataItem("price")%>" data-pro-name="<%#Container.DataItem(productName)%>" data-iid="<%#Container.DataItem("ItemId")%>"><strong>
                                    <asp:Literal runat="server" Text="<%$Resources:Resource,Order %>"></asp:Literal></strong>  </a>
                            </div>
                        </div>
                        <%-- item info product--%>
                    </div>
                    <%-- menproitem--%>
                </div>
                <%--colmd3--%>
            </ItemTemplate>
        </asp:Repeater>
    </asp:PlaceHolder>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
  <div class="row">

【参考方案1】：

因为Repeater在UpdatePanel中，所以需要在Async PostBack之后重新绑定数据属性。因为 PostBack 更新了 UI 并且之前的绑定丢失了。

<script type="text/javascript">
    $(document).ready(function () 
        bindDataAttributes();
    );

    var prm = Sys.WebForms.PageRequestManager.getInstance();

    prm.add_endRequest(function () 
        bindDataAttributes();
    );

    function bindDataAttributes() 
        //call the jquery function that binds data-uid etc here
    
</script>

【参考方案2】：

您需要在每次回发时填充转发器。最好的地方是OnInit 事件。