0

ボタンの行を生成する以下の関数があります。

各行 (val.Id) の選択された ID を使用するイベント ハンドラーを作成する方法はありますか?

ありがとう

            $("#test").on("click", "input.select", function () {
            alert($(this).closest("tr").data("resultId"));
        });

        $("#btnSearch").click(function () {
            var searchTerm = $("#tbSearchField").val();
            $.getJSON('http://localhost:50151/api/principals/' + searchTerm, function (data) {
                var html = ""
                var sel = ""

                $.each(data, function (key, val) {
                    sel = val.Id
                    html += '<tr data-result-id="' + sel + '">'
                    html += '<td><input class="select" type="button" text="Select" value="Select"></td>'
                    html += '</tr>'
                });
                $(html).appendTo('#test');
            });
        });

生成された HTML は次のようになります。

<table id="test" border="0" style="border: none; width: 100%; padding: 2px;">
<tbody>
    <tr data-result-id="1999860918">
        <td>
            <input class="select" type="button" value="Select" text="Select">
        </td>
    </tr>
    <tr data-result-id="1169565143">
        <td>
            <input class="select" type="button" value="Select" text="Select">
        </td>
    </tr>
    <tr data-result-id="1404344114">
        <td>
            <input class="select" type="button" value="Select" text="Select">
        </td>
    </tr>
</tbody>
</table>
4

2 に答える 2

1

id を行に追加し、そこから取得します。

html += '<tr data-result-id="' + sel + '">'

次に、現在のコードの上に、

$("#test").on("click","td input[type=button]", function(){
    alert( $(this).closest("tr").data("resultId") );
});

onlick 属性を削除します。

最終結果：

$("#test").on("click","input.select", function(){
    alert( $(this).closest("tr").data("resultId") );
});
$("#btnSearch").click(function () {
    var searchTerm = $("#tbSearchField").val();
    $.getJSON('http://localhost:50151/api/principals/' + searchTerm, function (data) {
        var html = ""

        $.each(data, function (key, val) {
            var sel = val.Id;
            html += '<tr data-result-id="' + sel + '">';
            html += '<td><input type="button" class="select" text="Select" value="Select"></td>';
            html += '</tr>';
        });
        $(html).appendTo('#test');
    });
});
于 2013-03-07T20:41:56.543 に答える