1

私のWebアプリには、ユーザーが最大5つのアイテムのリストを作成できる機能があります。リストが作成されると、最初のアイテムにちなんで自動的に名前が付けられますが、ユーザーはカスタム名を入力することもできます。したがって、次のようなものになります。

Name: [ Item 1 ] (this is a text box)

- Item 1
- Item 2
- Item 3
- Item 4
- Item 5

sortableまた、ユーザーがクリックしてドラッグしてリスト内のアイテムを再配置できるように、jQueryUIのインタラクションを設定しました。さて、私がやりたいのは、ユーザーがドラッグを完​​了した後、最初のアイテムが何であれ、リストの名前を自動変更することです。ただし、カスタム名を入力していない場合に限ります（名前を元の名前と比較することで決定できます）。アイテムとそれらが一致するかどうかを確認します）。

これは、カスタム関数（やなど）sortableを実行するために使用できる多くのイベントを提供することを知っています。問題は、比較を行うためにドラッグが発生する前と後の両方で関数を実行する必要があることですが、（私が知る限り）それらの間でデータを渡すことはできません-で定義された変数はで使用できません。では、これをどのように書くのでしょうか？startstopstartstop

4

2 に答える 2

0

最も学術的な答えではないかもしれませんが、ここにアイデアがあります：

なぜスタートイベントが必要なのですか？私が正しく理解していれば、あなたが気にかけているのは、名前が手書きでない場合に限り、リストの最初の項目をフィールドに入力することだけです。これをドロップ可能にすると、リストの名前をドロップした最初のアイテムを追加するために開始イベントが必要になる場合がありますが、すでにそれを持っていると思いますか？

var nameIsCustom=false;
$("#ul").sortable(
{
    stop: function(event,ui)
    {
        nameIsCustom = true;
        $("ul > li").each(function()
        {
            if($("#name").val() == $(this).text())
            {nameIsCustom = false;}
        });
        if(!nameIsCustom)
        {
            $("#name").val($("#ul > li:first").text());
        }
    }
});
于 2012-08-10T15:32:59.710 に答える
0

のグローバル変数の最初の項目を保存しstart、それを使用しての現在のタイトルと比較することで、これを解決しましたstop。おそらくそれを行うための最良の方法ではありませんが、それは機能します：

var saveFirstItem = function(first_item) {
    startFirstItem = first_item;
};

$(document).ready(function(){
    $("#list").sortable({
        start: function(event, ui){
            var first_item = $("#list li:first-child").text();
            saveFirstItem(first_item);
        },
        stop: function(event, ui){      
            var first_item = $("#list li:first-child").text();      
            var current_title = $("#title").val();

            if (current_title == startFirstItem){
                $("#title").val(first_item);
            }
        }
    });
});
于 2012-08-10T15:55:28.277 に答える