2015-06-08 16 views
6

Ho un multiselect personalizzato mobile jQuery, ma quando seleziono un elemento abbiamo l'elenco di elementi nel tag HTML select, ma non è aggiornato con l'attributo selected.jQuery mobile Multiselect non aggiorna l'attributo selezionato

Using the Multiple selects example of the page:

<div data-role="fieldcontain" class="ui-field-contain ui-body ui-br"> 
 
    <label for="select-choice-9" class="select ui-select"> 
 
    Choose shipping method(s): 
 
    </label> 
 
    <div class="ui-select"> 
 
    <a href="#" role="button" aria-haspopup="true" data-theme="c" class="ui-btn ui-btn-icon-right ui-btn-corner-all ui-shadow ui-btn-up-c"> 
 
     <span class="ui-btn-inner ui-btn-corner-all"> 
 
     <span class="ui-btn-text"> 
 
      Rush: 3 days, Express: next day 
 
     </span> 
 
     <span class="ui-icon ui-icon-arrow-d ui-icon-shadow"></span> 
 
     </span> 
 
     <span class="ui-li-count ui-btn-up-c ui-btn-corner-all" style=""> 
 
     2 
 
     </span> 
 
    </a> 
 

 
    <select name="select-choice-9" id="select-choice-9" multiple="multiple" data-native-menu="false" tabindex="-1"> 
 
     <option>Choose options</option> 
 
     <option value="standard">Standard: 7 day</option> 
 
     <option value="rush">Rush: 3 days</option> 
 
     <option value="express">Express: next day</option> 
 
     <option value="overnight">Overnight</option> 
 
    </select> 
 
    </div> 
 
</div>

Esiste un modo per renderlo aggiungere l'attributo selected di default?

+0

È possibile ottenere i valori selezionati utilizzando $ ('# select-choice-9'). Val(); . Perché hai bisogno dell'attributo selezionato? –

+0

Quale codice stai usando per recuperare i valori di opzione 'selected' da' select'? –

+0

Sto usando ASP.Net MVC e mi piacerebbe avere il formato DefaultModelBinder, di solito accetta il modello seguente: Diciamo: quello del nome dell'opzione dovrebbe avere il nome A [0] .B [1] .C [2] .D [3], dove A, B, C e D sono oggetti array, è anche qualcosa che sto cercando di ottenere con questo controllo, e se potessi selezionare i valori che hanno l'attributo selezionato sarebbe un buona idea. Ma se non dovrei ottenere il valore di span, dividerlo e cercare ogni attributo di opzione e aggiornarlo allegando un evento dopo che il pop-up è stato chiuso. – Tito

risposta

1

JQuery Mobile per impostazione predefinita non aggiorna l'attributo selected in risposta all'input dell'utente. È possibile mantenere i valori selezionati in sincronia con gli attributi con il seguente codice.

$(function() { 
    $('select').on('change', function (evt) { 
     var options = $(evt.target).children('option'), 
      current; 
     for (var i = 0; i < options.length; i++) { 
      current = options[i]; 
      if (current.selected === true && !current.hasAttribute('selected')) { 
       options[i].setAttribute('selected', ''); 
      } 
      if (current.selected === false && current.hasAttribute('selected')) { 
       options[i].removeAttribute('selected'); 
      } 
     } 
    }); 
}); 

Ricordare che questo funzionerà per tutti i widget di menu selezionati già presenti nel DOM. Se ne aggiungi uno a livello di programmazione, devi anche aggiungere il gestore di eventi a quel widget.