jQuery Autocomplete .. bloccare submit se codice inesistente

[FN79]

Ciao a tutti.
Ho forse un problema banale ma non riesco a saltarci fuori.
In un form di ricerca avanzato ho un campo input text a cui ho applicato correttamente il jquery di autocompletamento.

L'utente finale inserisce almeno tre caratteri e da quarto in poi viene fuori la tendina con il suggerimento degli eventuali codici trovati.

E fin qui tutto ok ..

Quello che non riesco a fare e bloccare l'invio del form e visualizzare in un div di erroreun messaggio del tipo 'codice non trovato' nel caso in cui l'utente inserisca un codice che non è presente nella base dati su cui lavora l'autocompletamento.

Il codice che uso (e che ho un pò sistemato guardando tutorial online) è il seguente.

$("#DATA").autocomplete({
minLength: 3,
source: CODICI,
focus: function(event, ui) {
$("#DATA").val(ui.item.label);
return false;
},

select: function(event, ui) {

$("box-alert").html(ui.item.value)
log(ui.item ? ("Selected: " + ui.item.value + " aka " + ui.item.id) : "Nothing selected, input was " + this.value);
return false;
}
})
.data("autocomplete")._renderItem = function(ul, item) {
return $("[*]")
.data("item.autocomplete", item)
.append("<a>" + item.label + "
" + item.desc + "</a>")
.appendTo(ul);
};

Praticamente il form parte sia che inserisca qualcosa di esistente che qualcosa di inesistente.
Come posso bloccare il submit nel caso di codice insesistente?

Grazie 1000
FN

[lucavizzi]

Il "CODICI" nella source è un array?

[FN79]

.. esatto .. ti faccio un esempio

var CODICI= [
{
label: "111",
desc: "prodotto 01"
},

{
label: "222",
desc: "prodotto 02"
},

{
label: "333",
desc: "prodotto 03"
},
etc.
etc.
{
label: "999",
desc: "prodotto 999"
}
];

Non uso base dati come JSON o altro .. creo un array direttamente alla variabile codice
Ho una media di 100/150 prodotti quindi riesco benissimo a gestirli così .. hai qualche suggerimento?
io non ho ancora risolto nulla

Grazie
FN

[lucavizzi]

function validazione(){
 var uiField=$('#DATA').val().split('
')[0];//il label
 for(var i=0; i<CODICI.length; i++){
	 var obj=CODICI[i];
	 if(obj.label==uiField){
                     return true; //trovato (esce dal ciclo ed invia il modulo)
               }
 }
 alert('codice non trovato');
 return false;//blocca l'invio del modulo
}
<form ... onSubmit="return validazione()">
...
</form>

edit:
Cosa compare nel campo con id DATA?

[FN79]

Innanzitutto grazie per la risposta.
Però non riesco a capire una cosa.

La funzione che proponi è, diciamo, 'extra' rispetto a quella del jquery di autocompilazione? .. non devo integrarla dentro?
E poi io non vorrei che venisse un alert a video nel caso in cui il codice non ci fosse, ma che venisse visualizzato il messaggio dentro ad un div sotto al form .. del tipo

$("#errore").text("! Nessun articolo trovato");

.. mmm .. scusami tanto ma non riesco proprio a capire come integrare il tutto ..

[lucavizzi]

Cosa compare nel campo con id DATA? Sia il label che la descrizione?

Se non hai già una funzione che valida il modulo prima dell'invio, basta che aggiungi la function "validazione" tra i tag <script> </script> ed aggiungi l'evento onSubmit al modulo come ti ho mostrato nel post precedente.

L'alert puoi rimpiazzarlo con il tuo codice.

[FN79]

Allora sul form ho già una funzione in jquery che valida che il form non sia vuoto prima di inviare.

Poi quando inizio a scrivere dentro al campo input, al terzo carattere inserito viene visualizzata sotto la tendina con tutti i codici e le descrizioni (praticamente il contenuto dell'array CODICI) ma l'utente può anche 'bypassare' questo suggerimento di autocompilazione e scrivere un suo codice

Se questo però non è presente nell'array CODICI il form non deve essere spedito e si deve visualizzare sotto un messaggio del tipo 'nessun codice trovato' ..

[lucavizzi]

Posta la funzione che valida il modulo.
Se viene selezionato un valore dalla tendina, nel campo compare solo il label (111) o anche la descrizione (prodotto01)?

[FN79]

Ma la funzione che valida il form è jquery form validate e quindi è uno script molto lungo che faccio fatica a postare.
Mentre se viene selezionato una valora dalla tendina compare solo il label (111) e non la descrizione ..

Io vorrei continuare a lavorare in jquery perchè credo che la soluzione ci sia .. sono io che proprio non riesco a capire come implementare il discorso ..

[lucavizzi]

Non puoi materialmente obbligare a scegliere dalla tendina di UI quindi bisogna controllare il valore prima dell'invio del modulo.
Come lo inizializzi il validate di jQuery?