2016-03-21 4 views
1

select2.jsを使用してアイテムを追加および削除できるテキストボックスが1つあります。今私は、テキストボックスから項目を削除するとき、それはいくつかの確認メッセージを要求する必要がある1つの要件があります。select2.js以前にクリックされたアイテムを維持して、確認ポップアップで複数のアイテムを削除します

私はunselect()メソッドの変更をselect2.jsにする必要があります。以下は、私が変更を加えたコードです。

unselect: function (b) { 
    var $curelm = this; 
    var d = "", e= "", c = ""; 
    confirmpopup("Confirm", "Are you sure you want to remove this Tag?", function (confirm) { // <-- Here i have added confirmpopup code 
     if (confirm) { 
      c = $curelm.getVal(); 
      if (b = b.closest(".select2-search-choice"), 0 === b.length) throw "Invalid argument: " + b + ". Must be .select2-search-choice"; 
      if (d = b.data("select2-data")) { 
       var f = a.Event("select2-removing"); 
       if (f.val = $curelm.id(d), f.choice = d, $curelm.opts.element.trigger(f), f.isDefaultPrevented()) return !1; 
       for (; 
        (e = p($curelm.id(d), c)) >= 0;) c.splice(e, 1), $curelm.setVal(c), $curelm.select && $curelm.postprocessResults(); 
       return b.remove(), $curelm.opts.element.trigger({ 
        type: "select2-removed", 
        val: $curelm.id(d), 
        choice: d 
       }), $curelm.triggerChange({ 
        removed: d 
       }), !0 
      } 
     } 
    }); 
}, 

私はあなたに私の問題を示すために1 JS Fiddleを準備しています。私は"No"をクリックしたとき、私はボックスに(記号を削除)"x"をクリック

、それは1つの確認のポップアップを開くだろうし、そのポップアップで、私はそれが完全に箱からアイテムを削除します"Yes"ボタンをクリックした場合と、ボタンを押すと、アイテムは削除されません。今まではすべてが問題ありません。今問題が発生しました。二度目に"x"をクリックして"Yes"ボタンをクリックすると、選択したアイテムだけを削除するのではなく、2つのアイテムをボックスから削除します。理由はわかりませんが、以前のクリックしたアイテムの履歴(と思いますが、と思われます)を維持します。

私は上記のコードで間違っていることを指摘できますか?

手順以下JSフィドルフォローして問題を生成するには、次の二つ以上の項目を選択し

  • 選択した項目の"x"ボタンをクリックし、確認のポップアップでボタンをクリックします。
  • 他の項目の"x"ボタンをもう一度クリックして、確認の際に"Yes"ボタンをクリックしてください。
  • 選択したアイテムだけでなく、2つのアイテムを削除します。

    NOTE

私は私がその unselect方法に変更を行ったため、外部リンクでそれを追加するのではなく、JSフィドル全体 select2.jsコードを追加しています。

+0

このためにコアコードを変更するのではなく、実際には 'select2:unselecting'イベントをキャッチする必要があります。その出来事を防ぐことができます、あなたが探しているように見えます。 –

+0

私はSelect 2 Version:3.5.0を使用していますが、ここではこのバージョンではこの「選択解除」機能やイベントはありません。しかし今、私の問題は解決されました。コメントありがとう –

答えて

1

わかりました。私のコードで深い掘り下げをして解決策を得ました。 confirmpopup()の問題は機能します。そのときselect2ボックスから削除するアイテムをクリックすると、"Yes"ボタンのクリックイベントが登録されています。次に、別の項目をクリックしてselect2ボックスから削除し、"Yes""No"ボタンイベントを登録してDOMに登録します。だから、これが理由で2回呼び出された"Yes"ボタンクリックイベントです。

この問題を克服するには、まずアンバインドイベントをクリックして.Off()メソッドを使用すると、以下のようなコードになります。

function confirmpopup(title, message, callbackfunc) { 
    $('#errorlabel').text(title); 
    $('#popupmessage').text(message); 
    $('#modelconfirm').show(); 

    $('#btnyes').off('click'); // <-- Solution is here 

    $('#btnyes').on('click', function() { 
     $('#modelconfirm').hide(); 
     callbackfunc(); 
    }); 

    $('#btnno, .close').on('click', function() { 
     $('#modelconfirm').hide(); 
    }); 

} 
関連する問題