Jquery mobile - Checkbox di aggiornamento con pageinit

Sto chiamando una pagina (vedi codice sotto) da un elenco di collegamenti su un'altra pagina usando. Una lista come questaJquery mobile - Checkbox di aggiornamento con pageinit

<ul data-role="listview" data-theme="g"> 
     <li><a href="test.html">test</a></li> 
</ul>

con il codice sotto la pagina test.html.

Sto usando jquery mobile su queste pagine. Solo le caselle di controllo dopo le prime 3 caselle di controllo sembrano essere aggiornate correttamente (visualizzate come selezionate) quando la pagina viene caricata facendo clic sul collegamento. Le prime tre caselle di controllo sembrano sempre non selezionate e il loro valore selezionato è impostato su falso. Ciò che è insolito è che se inserisco un'istruzione if subito dopo l'istruzione che sta impostando la casella di controllo su true, il valore selezionato della casella di controllo è true, ma sembra essere falso nella pagina sottoposta a rendering e si guarda il valore selezionato nell'area degli elementi del web inspector. Quando si aggiorna la pagina (usando F5 o il pulsante di aggiornamento vicino alla barra degli indirizzi) le caselle di controllo si aggiornano come ci si aspetterebbe. Qualsiasi aiuto sarebbe molto apprezzato. Mentre il codice di esempio qui sotto sembra semplicemente impostare tutte le caselle di controllo su un valore controllato, sono davvero (nella mia pagina reale) ad impostare il loro valore in base ai dati di un recordset, quindi non posso semplicemente eseguire un'impostazione di massa su true e refresh. Devo scorrere il recordset e impostare i valori della casella di controllo di conseguenza. Il seguente codice è solo una semplice riproduzione dell'errore che sto avendo. Grazie!

<!doctype html> 
<html lang="en"> 
    <head> 
     <meta charset="utf-8" /> 
     <title>Checkbox</title> 
     <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1"> 
      <link rel="stylesheet" href="jqm1/jquery.mobile.structure-1.0.1.min.css" /> 
      <script src="jqm/jquery-1.7.1.min.js"></script> 
      <script src="jqm/jquery.mobile-1.0.1.min.js"></script> 

     </head> 
     <body> 
     <div id="loadCB" data-role="page"> 
      <script type="text/javascript"> 
       $("#loadCB").live('pageinit', function() { 
        // do something here... 


        for (i=0;i<=5;i++) 
        { 
        $("#checkbox-"+i).prop("checked", true); 
        $("#checkbox-"+i).prop("checked", true).checkboxradio("refresh"); 
        } 


       }); 
      </script> 

      <article data-role="content"> 


       <form id="frmR"> 
        <input type="checkbox" name="checkbox-0" id="checkbox-0" class="custom" value="0"/> 
        <label for="checkbox-0">checkbox-0</label> 
        <input type="checkbox" name="checkbox-1" id="checkbox-1" class="custom" value="1"/> 
        <label for="checkbox-1">checkbox-1</label> 
        <input type="checkbox" name="checkbox-2" id="checkbox-2" class="custom" value="2"/> 
        <label for="checkbox-2">checkbox-2</label> 
        <input type="checkbox" name="checkbox-3" id="checkbox-3" class="custom" value="3"/> 
        <label for="checkbox-3">checkbox-3</label> 
        <input type="checkbox" name="checkbox-4" id="checkbox-4" class="custom" value="4"/> 
        <label for="checkbox-4">checkbox-4</label> 
        <input type="checkbox" name="checkbox-5" id="checkbox-5" class="custom" value="5"/> 
        <label for="checkbox-5">checkbox-5</label> 

        <input type="submit" value="Set Rules" /> 
       </form>    


      </article>   
     </body> 
    </div> 
    </html>

fonte

2012-02-20 Paul in Colorado

ho scritto un elenco abbastanza completo di widget ed il metodo con cui li aggiorna: http://andymatthews.net/read/2011/12/14/Refreshing-jQuery-Mobile-listviews,-buttons,-select-dropdowns,-and-input-fields

Forse sarà rispondere alla tua domanda?

fonte

2012-02-20 17:17:07 commadelimited

Grazie per la risposta. Sembra che io stia già usando un codice simile mentre mostri sulla tua pagina. Le mie checkbox non sembrano essere aggiornate correttamente quando la pagina viene caricata da un'altra pagina. –

Controlla questo codice

$("#loadCB").live('pageinit', function() { 
        // do something here... 


        $("input[type='checkbox']").attr("checked",false).checkboxradio("refresh"); 


       });

fonte

2012-02-23 05:38:57 Hkachhia

Harry, grazie per il feedback. Mentre questo imposterà tutte le caselle di controllo su non ha risolto il problema nell'esempio che ho fornito. Sto impostando i valori delle caselle di controllo in base a un recordset restituito da un database, quindi non posso impostare tutti i valori su true. Devo scorrere i record e impostare solo le caselle da verificare per verificare. Il mio problema è che le prime tre checkbox non sembrano mai aggiornare correttamente. Grazie. –

Jquery mobile - Checkbox di aggiornamento con pageinit

risposta

Problemi correlati