Impostare un Selezionare Menu jQuery UI ad una specifica opzione javascript

Question

Ho un Selezionare Menu come il seguente

<select name="scale" id="scale"> 
    <option selected>linear</option> 
    <option>root</option> 
    <option>square</option> 
</select> 

Per rendere più bello io uso jQuery UI v1.11.2.

$('#scale').selectmenu(); 

ora posso leggere il valore della discesa dal

alert($('#scale').val()); 

che si traduce in 'lineare' come la risposta. Posso anche impostare il valore su "square" utilizzando

$('#scale').val('square'); 
alert($('#scale').val()); 

che fornisce correttamente la risposta "quadrata". Ma (!!!) il menu a discesa non viene visualizzato sullo schermo. Quindi in realtà posso impostare e leggere il valore, ma la rappresentazione visiva non cambia - il widget non si aggiorna. Ho letto da qualche parte per gettare un .change() ma senza alcun effetto. Ho anche provato risposte come in jQuery UI Selectmenu value set dynamically does not change visible selected value ma non ci sono riuscito. Qualsiasi $('#scale').selectmenu('value', 'square'); resuts nel messaggio di errore Error: no such method 'value' for selectmenu widget instance.

Qualcuno può aiutare come aggiornare il widget dopo averlo impostato su un nuovo valore?

Answer 1

Dovrebbe funzionare come ci si aspetta che se basta chiamare refresh dopo l'uso .val():

$('#scale').val('square'); 
$("#scale").selectmenu("refresh"); 

La ragione di ciò è che la funzione .val() è fornito da jQuery, mentre il widget fa parte del jQueryUI. [presumibilmente gli autori $ .ui non volevano alterare la funzionalità $, anche se si tratta solo di speculazioni da parte mia]