javascript - 如何将转发器 onclick 按钮的项目中的数据传递给 javascript 文件以在 ajax 中使用

Question

我有一个中继器:

 <div class="container" id="TourDetail">
    <asp:Repeater ID="RptTourDetail" runat="server" DataSourceID="ODSTTitle" ItemType="Tour" 
EnableViewState="false" OnItemDataBound="RptTourDetail_ItemDataBound">
        <HeaderTemplate>
    <ul>
         </HeaderTemplate>
         <ItemTemplate>
         <li>
             <span class="ForGenHandle">
                <%# Item.TourId %>
             </span>
             <div  id="tright">
                <input runat="server" type="button" name="name" value="INQUIRE" class="Inq" id="InqBtn" />
            </div>
        </li>
        </ItemTemplate>
        <FooterTemplate>
    </ul>
        </FooterTemplate>
    </asp:Repeater>
</div>

它使用我的存储库来显示数据。 我在这个 Repeater 中有一个按钮:

<input runat="server" type="button" name="name" value="INQUIRE" class="Inq" id="InqBtn" />

单击此按钮会打开一个框，其中包含转发器中每个项目的一些数据。

我用ajax来做的。这是我的通用处理程序:

public void ProcessRequest (HttpContext context) {
    int x = Convert.ToInt32(context.Request.QueryString["TourID"]);
    context.Response.ContentType = "application/json";
    context.Response.Write(JsonConvert.SerializeObject(new ATourDateRep().GetById(x)) );
}

这是我的 javascript 代码:

$('.Inq').click(function () {

$.ajax({

url: '../Services/TourDates.ashx?TourID=<%%>',

success: function (e) {
   for (var i = 0; i < e.length; i++) {
        $('<li />').html("<div>" +
        e[i].TourStartDate + "</div>" + "<div>300$</div>" + " <div>500$</div>").appendTo('#list');
                }
            }
        });
    }
);

有谁知道如何将转发器的每个项目的 TourId 作为查询字符串传递给通用处理程序？在这一行中，我的意思是:

url: '../Services/TourDates.ashx?TourID=<%%>'

如果需要，这里是我的存储库:

public class ATourDateRep
{
    private DatabaseEntities model = new DatabaseEntities();
    public List<TourDate> GetById(int Id)
    {
        return model.TourDates.Where(e => e.TourId == Id).ToList();
    }
}

Answer 1

能否请您尝试以下方法:

1) 修改<input>关于放 data-TourID 的行其中:

<input runat="server" type="button" data-TourID="<%# Item.TourId %>" name="name" value="INQUIRE" class="Inq" id="InqBtn" />

2)然后修改JS代码如下:

$('.Inq').click(function () {
    var TourID = $(this).data("TourID"); //read the tour ID
    $.ajax({

        url: '../Services/TourDates.ashx?TourID='+TourID,
        success: function (e) {

           for (var i = 0; i < e.length; i++) {
                $('<li />').html("<div>" +
                e[i].TourStartDate + "</div>" + "<div>300$</div>" + " <div>500$</div>").appendTo('#list');

            }
        }
    });
});