Magicsuggest change Platzhaltertext

Question

Ich arbeite seit ein paar Tagen mit Magicsuggest und versuche den Platzhaltertext so zu ändern, dass der Magicsuggest wie eine Einzelauswahl wirkt.

ich habe die erste:

HTML

<div style="padding:5px 10px;" data-bind="visible: availableOptions().length > 1"> 
    <div id="magicsuggest"></div> 
</div> 

JavaScript

magicOChange = $('#magicsuggest').magicSuggest({ 
    data: availableOptions, 
    placeholder: function() { 
       $('.ms-sel-ctn input').attr("placeholder", SelectedN); 
    } 
}); 

$(magicOChange).on('selectionchange', function (e, m, sel) { 
    if (sel.length == 0) return; 
    for (i = 0; i < availableOptions.length; i++) { 
      if (typeof sel[0] != 'undefined') 
       if (availableOptions[i].name == sel[0].name) { 
         SelectedN(sel[0].name); 
         SelectedN2(sel[0].name); 
         break; 
       } 
    } 
    if (typeof sel[0] != 'undefined') { 
     magicOChange.collapse(); 
     this.clear(); 
    } 
}); 

Und ich versuche, die zweite in einem Pop-up hinzuzufügen:

HTML

<div class="modal-body"> 
    <div class="row"> 
     <div data-bind="visible: availableOptions().length > 1"> 
       <div id="magicsuggestM"></div> 
     </div> 
    </div> 
</div> 

JavaScript

magicMChange = $('#magicsuggestM').magicSuggest({ 
    data: availableOptions, 
    placeholder: function() { 
       $('.ms-sel-ctn input').attr("placeholder", SelectedN2); 
    } 
}); 

$(magicMChange).on('selectionchange', function (e, m, sel) { 
    if (sel.length == 0) return; 
    for (i = 0; i < availableOptions.length; i++) { 
      if (typeof sel[0] != 'undefined') 
       if (availableOptions[i].name == sel[0].name) { 
         SelectedN2(sel[0].name); 
         break; 
       } 
    } 
    if (typeof sel[0] != 'undefined') { 
     magicMChange.collapse(); 
     this.clear(); 
    } 
}); 

Aber es scheint, dass, wenn ich versuche, den Wert für die zweite Magicsuggest (der einen aus dem Popup) den Platzhalter ändert sich ändern der andere und der gewünschte bleiben gleich. Gibt es eine Möglichkeit, den Wert für einen Platzhalter zu ändern, ohne den anderen zu beeinflussen?

Answer 1

Er zieht den Platzhalter aus dem ersten verfügbaren dom-Element. Fügen Sie bei den Platzhaltern die ID jedes Elements hinzu, bevor Sie den Selektor abfragen. Anstatt also:

$('.ms-sel-ctn input').attr("placeholder", SelectedN); 

Änderung es zu:

$('#magicsuggestv .ms-sel-ctn input').attr("placeholder", SelectedN); 

und statt:

$('.ms-sel-ctn input').attr("placeholder", SelectedN2); 

Änderung es zu:

$('#magicsuggestM .ms-sel-ctn input').attr("placeholder", SelectedN2);