0

データベースにエントリを追加するためのフォームがあります。同じフォームを使用して、データベース内の既存のレコードを更新/編集しようとしています。

マイページは、データを追加するためのフォームと、既存のデータを表示するテーブルで構成されています。既存のデータ テーブルには各エントリに対する列編集があり、テーブルは php を使用して動的に入力されます。

これは、ユーザーが任意の行に対して編集ボタンをクリックすると、その行のデータがフォームに自動的に入力されるようにすることです。

ここでjsfiddleを作成しました

私が試したJSスクリプト:

$("#tableID").on("click", ".edit_button", function() {
    var data = $(this).closest("td").siblings().map(function() {
        return $(this).text();
    }).toArray();

    console.log(data);
}); // the event is not recognized. no action on clicking.

ここでスタックオーバーフローで見つけたかなりの数のテクニックがありますが、それらのほとんどはクリックイベントに応答しないか、null/空の値を返します。フォームが動的に入力されるためですか?

私はWeb開発にかなり慣れていません。どんな助けもいただければ幸いです。ありがとう!

注: データベースには (動的に追加された) 20 以上のレコードが含まれています。Jsfiddle では、コードをきれいに保つために 1 つだけ示しました。css スタイルがなくてすみません :P

4

1 に答える 1

0
$("#tableID").on("click", ".edit_button", function() {
    var data = $(this).closest("td").siblings().map(function() {
        return $(this).text();
    }).toArray();

    console.log(data);
});

こんな使い方も参考になるかも

$("#tableID").click( function() {
    var data = $(this).closest("td").siblings().map(function() {
        return $(this).text();
    }).toArray();

    console.log(data);
});
于 2013-10-29T06:58:19.697 に答える