2014-12-16 15 views
10

Sto usando JQuery Validate su un modulo JQuery Mobile che ha un listview con un'opzione Auto Complete che viene creata dinamicamente.JQuery Validate Uncaught TypeError: Impossibile leggere la proprietà 'settings' di undefined

Viene visualizzato questo errore se si tenta di digitare nel campo di completamento automatico, una volta che la convalida è attiva.

Vedo che il problema è correlato al modulo creato da jQuery Mobile per contenere l'input del filtro ma non riesco a capire come impedire a jQuery Validate di convalidare il campo.

posso riprodurre usando JS Fiddle

(Premere Convalida e quindi digitare nella casella filtro)

Eventuali suggerimenti apprezzato

Grazie

<body> 
<script> 
    jQuery.validator.setDefaults({ 
     ignore: '[data-type="search"]' 

    }); 
</script> 
<form> 
    <input required> 
    <ul id="ac" data-inset="true" data-filter="true" data-filter-reveal="true" data-filter-placeholder="Search cars..."> 
     <li><a href="#">Acura</a> 

     </li> 
     <li><a href="#">Audi</a> 

     </li> 
    </ul> 
    <button onclick="$('#ac').attr('data-role','listview');$('#ac').listview();$('form').validate();">Validate</button> 
</form> 

+0

stai usando jQM 1.3? o versione più recente? – Omar

risposta

42

L'intero problema è causato dall'HTML dinamico creato dalla funzione listview(). L'ispezione del DOM rivela che questo crea dinamicamente un nuovo contenitore <form>. Dato che hai inserito listview all'interno del tuo contenitore <form>, ora hai <form></form> nidificato all'interno di <form></form>, che è un codice HTML non valido, e l'intero motivo per cui il plugin jQuery Validate funziona in modo imprevisto.

La soluzione è posizionare l'elemento listview all'esterno del contenitore <form>.

+1

"Ora avete un

inserita all'interno di una
che è molto valido HTML e tutta la ragione il plugin jQuery Convalida sta lavorando in modo così inaspettato" questa parte risolto il mio problema –

+0

attenzione, alcuni * plugin aggiungere un '

' di programmazione, e fare validare fallire esattamente per questo. [http://hayageek.com/docs/jquery-upload-file.php]* – Petruza

+0

@ VeyselÖzdemir Se questo ha risolto il tuo problema, forse dovresti accettare la risposta qui ufficialmente. – rumblestrut

Problemi correlati