Salve a tutti,
ho un problema con il prepolamento delle select con Bootstrap-Italia.
In particolare le option sono popolate dinamicamente da backend usando la ‘setOptionsToSelect’ come indicato nella documentazione Bootstrap-Italia. In seguito al popolamento il valore delle select viene prepopolato con JQuery con $(’#select_id’).val(“val2”); quest’ultimo però non funziona e il valore prepopolato appare per pochi istanti e poi sparisce. Ho fatto anche vari tentativi sfruttando l’attribute ‘selected’ delle option ma nulla. Analizzando la struttura della pagina il div con classe 'bootstrap-select-wrapper ’ che veste la select non ha un comportamento corretto in fase di prepopolamento dati in quanto l’etichetta testuale della option che andrebbe selezionata non viene scritta nell’elemento con classe ‘filter-option-inner-inner’. Qualcuno ha avuto lo stesso problema e sa come risolvere questa issue? Grazie mille !
Per maggiore comprensione riporto di seguito html della select la selezione del val che non funziona a valle del popolamento dinamico:
Buonasera @Alice_Castellano.
Non credo di essere in grado di fornirti una risposta “adeguata”, e onestamente non so neanche se esista perché è un problema in cui sono incappato anch’io in passato e alla fine ho semplicemente cercato di evitare! Certo, si potrebbe tentare di modificare il codice JS che regola il funzionamento del Select Wrapper (e temo sia un suicidio!) oppure “aggirare” il problema con qualche riga di codice, meno elegante ma sicuramente più funzionale!
Facendo un po’ di prove, con la funzione $('#select_id').val("val2") dovremmo essere a posto per quando riguarda l’aspetto “tecnico” del form (il dato viene trasmesso correttamente); ciò che manca è solo l’aspetto “visivo”, non avendo riscontro grafico dell’opzione selezionata in automatico.
La prima soluzione che mi viene in mente è quella di forzare l’aggiornamento dell’etichetta testuale con un $('#select_id_wrapper').find('.filter-option-inner-inner').html("val2"): accedo all’elemento tramite il metodo find() per accertarmi di modificare quello relativo al Wrapper di mio interesse; senza, altrimenti, modifico il testo di tutti i Select della pagina.
Ho abbozzato delle soluzioni rozze, poi chiaramente le si potranno adattare in delle funzioni ad-hoc, passando i parametri come meglio ci conviene (possiamo recuperare tramite jQuery il testo della option desiderata, ad esempio). Ho effettuato una prova veloce e sembra funzionare; spero possa fungere positivamente da “toppa” al problema sollevato.
Se qualcun’altro avesse soluzioni migliori e più pulite, chiaramente saranno più che ben accette anche dal sottoscritto!
Ciao Alessio,
grazie davvero per la tua risposta!
Sono riuscita ad aggirare il problema con uno script aggiuntivo, seguendo il tuo suggerimento, ed eliminando l’attribute ‘title’ dalla select perchè altrimenti sul browser Chrome non funzionava in quanto l’elemento con classe css "filter-option-inner-inner" viene inevitabilmente sovrascritto con il contenuto del title ignorando lo script di fix. Non è una soluzione propriamente ortodossa ma, come hai detto anche tu, l’unica realizzabile in tempi brevi!
Mi fa piacere che tu abbia risolto il problema, perlomeno in maniera “artigianale”!
Grazie anche per la doverosa segnalazione riguardo l’attributo title su Chrome: è sempre bene conoscere i “fastidi” sollevati dai browser nei vari casi!
Speriamo che venga implementata in futuro una soluzione più omogenea e integrata per questa esigenza, a mio avviso, piuttosto rilevante.
Certo, si potrebbe tentare di modificare il codice JS che regola il funzionamento del Select Wrapper (e temo sia un suicidio!) oppure “aggirare” il problema con qualche riga di codice, meno elegante ma sicuramente più funzionale!
