jquery - jQuery を使用してリストをリセットする

Question

データベースに保存されているスタッフの名前を表示するリスト (id '#staff') があります。

ユーザーはエディターを開いて、コンテンツの並べ替え、追加、削除を行い、変更を保存するかキャンセルすることができます。

セーブ機能が働きます。

私の問題は、変更を加えてキャンセル ボタンをクリックし、エディターを再度開くと、変更がリセットされずに表示されたままになることです。

私はもう試した：

$('#staff').reset();

しかし、これはうまくいきませんでした。

ページ更新の使用を避けたい。

この問題を解決するにはどうすればよいですか?

Answer 1

ページが初めて読み込まれるときに、将来のためにリストのクローンを作成し、後でリストをコピーに置き換えます。

$(function() {
    var my_copy = $('#list').clone(true);
    $('#reset_button').click(function(){
        $('#list').replaceWith(my_copy);
    });
});

ドキュメンテーション：

• クローン
• と置換する

これをより柔軟にするために、クローンをリスト自体に保存します。

$(function() {
    $('#editor_open_button').click(function() {
        $('#list').data('my_clone',$('#list').clone(true));
    });
    $('#reset_button').click(function(){
        $('#list').replaceWith($('#list').data('my_clone'));
    });
});

Answer 2

コントロール/データの状態を保存する必要があります。次に、キャンセル ボタンをクリックすると、コントロールのすべての値が保存されたデータで上書きされます。

Answer 3

元のコンテンツを変数に格納する必要があります。