Question

我有以下代码，它根据属性id绑定属性：

<form>
<!-- Main div -->
<div class="row">
<asp:Repeater ID="rptProperties" runat="server">
 <HeaderTemplate>
 </HeaderTemplate>

<ItemTemplate>
    <div class="item col-md-4">
    <div class="price">
        <%# CustomFormat(Int32.Parse(Eval("budget").ToString())) %>
    </div>
    <div class="info">
    <h3>
        <%# DLResale.getBedNameByID( Int32.Parse(Eval("beds").ToString())) %> <%# DLResale.getConfigNameByID( Int32.Parse(Eval("propertyConfig").ToString())) %>
    </h3>
    <h3>
        <small><i class="fa fa-map-marker"></i> <%# Eval("locationStr") %>, <%# Eval("cityStr") %></small>
    </h3>

    <ul class="amenities">
        <li style="margin-bottom: 10px;">
            <a id="ViewDetails" class="btn btn-default-color btn-sm view-price"><i class="fa fa-home"></i>View Details</a>
        </li>
    </ul>

    </div>
    </div>
</ItemTemplate>

<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</div>

<!-- Modal Popup-->
<div id="m-request-details" >
<div>
    <asp:TextBox ID="txtMobile" runat="server" ></asp:TextBox>
</div>

<div class="modal-footer text-center">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        <asp:Button ID="btnDetail" runat="server" Class="btn btn-default-color btn-sm" Text="Submit" OnClick="btnDetail_Click" CausesValidation="true" ValidationGroup="DetailsGroup" />
</div>
</div>

<form>

打开模态弹出窗口的javascript代码如下：

$("#ViewDetails").click(function () {
                console.log("modal");
                $('#m-request-details').modal({ backdrop: 'static', keyboard: false });
            })

然而，页面上有10个属性，但是当我点击查看详细信息时，弹出窗口仅打开第一个属性＆amp;不适用于其他财产。

C＃转发器绑定10个属性，因为每个属性的数据列相同，即预算，床位，位置。

任何人都可以找出为什么仅为第一个属性打开模态弹出窗口而不是为其余属性打开?????????

Answer 1

<a id="ViewDetails" class="btn btn-default-color btn-sm view-price"><i class="fa fa-home"></i>View Details</a>

您的问题在于标记的ID。您可以生成多个链接，并且它们没有相同的ID，因为$("#ViewDetails").click(function ()不起作用。

有几种方法可以获得列表项单击功能，请参阅下面的示例：

 <ul class="amenities">
        <li style="margin-bottom: 10px;">
            <a class="btn btn-default-color btn-sm view-price"><i class="fa fa-home"></i>View Details</a>
        </li>
    </ul>

$("ul.amenities li").click(function () {
                console.log("modal");
                $('#m-request-details').modal({ backdrop: 'static', keyboard: false });
            })

如何在asp转发器控件中显示模态弹出窗口

1 个答案: