web-dev-qa-db-ja.com

jQuery-テーブルの行をインラインで編集する

任意の列と行を持つテーブルがあります。この事実は関係ありませんが、実際には、行（または複数の行）をテーブル内のデータを含む一連のテキスト入力に変換する（またはセルにデータがない場合は空にする）関数を開発するだけです。

明示的にこれを行っている人の例を見つけることができないので、ここの人が解決策を見つけるための最良の方法は何だと思うのか疑問に思いました。

javascriptjqueryhtml-tablerowsinline-editing
14
adam

行のテーブルセルを繰り返し処理し、内容をテキスト入力に置き換えます。

function editRow(row) {
    $('td',row).each(function() {
         $(this).html('<input type="text" value="' + $(this).html() + '" />');
    });
}

明らかに、関連する行を関数に渡す必要があります。

30
Eran Galperin

http://code.google.com/p/jquery-inline-editor/ を使用すると、必要なことを正確に実行できます

1
Matt Kim

エランが言うように。

ただし、contenteditableやdesignModeなどのプロパティを確認することもできますが、これらがどの程度サポートされているかはわかりません。

コンテンツをテキスト入力に置き換えたら、jqueryプラグイン toggleEdit を使用して、プレビューモードと編集モードの切り替えを管理できます。

0
alzclarke