campo con autocompletamento a formato multiplo (nomi/date)

MarcoGrazia

Utente Attivo
15 Dic 2009
853
21
28
63
Udine
www.stilisticamente.com
Ciao ragazzi mi servirebbe il vostro aiuto per un'applicazione che sto creando.
Ho un database contenente dei dati, su questo devo poter cercare dei dati o per nome o per data, farlo non è certo difficile, il problema sta a monte della ricerca, ovvero l'interfaccia utente che deve essere più semplice possibile. ( a prova di utonto :D )
in pratica il "box" di ricerca è molto semplificato e consiste di una select, di un campo di testo e di un bottone di invio.
  • la select contiene due opzioni: ricerca per nome, ricerca per data;
  • il campo di testo permette una o l'altra ricerca;
  • il tasto di invio... be è ovvio :D
Ora al campo di testo è associato l'autocompletamento, scrivendo almeno 3 caratteri si attiva e fornisce un suggerimento su quanto già digitato, come avviene normalmente avviene per tutti questi sistemi.
Funziona perfettamente per la ricerca sui nomi in quanto richiama proprio quel tipo di ricerca.
Ora vorrei implementare anche la ricerca per date ma senza fare strane cose o doppioni delle funzioni già esistenti.
Il codice attuale, semplificando è questo:
HTML:
.....
<select id="tipoRicerca">
  <option value="0" selected>Per nome ( predefinito)</option>
  <option value="1">Per data</option>
</select>
<input type="text" id="testoRicerca" value="">
....
javascript/jquery
Codice:
var tipoRicerca = 0;  // Valore predefinito
$('#tipoRicerca').on('change', function()
{
                   tipoRicerca = $(this).val();
});
$( 'input[name="testoRicerca"]' ).autocomplete({
                    source: 'suggestionRettifiche.get.php?id=' + tipoRicerca,
                    minLength: 3,
                    autoFill: true,
                    max:50,
                    formatItem: function ( row ) {    return row[0] + " (" + row[2] + ", " + row[1] + ")" + " "+row[5];    },
                    formatMatch: function ( row ) {    return row[0];    },
                    formatResult: function ( row ) {    return row[0];    }
});
Ora, a prescindere che il passaggio di ID sul "source" è stata una mia idea avvallata da qualche ricerca sul web, la cosa non funziona.
Ovviamente quel parametro ID serve al file remoto per fare una scelta sul tipo di ricerca ( a seconda del suo valore, passa al motore del database una stringa SQL o un'altra.
Il problema è che non la passa proprio!
Sempre cercano nel web ho trovate altre soluzioni ma nessuna funziona, qualcuno sa aiutarmi?
Grazie.
 
Ciao, io passo il parametro nell'url come hai fatto tu e funziona egregiamente. Dovresti però inizializzare la fnzione autocomplete() ogni volta che modifichi la select
Codice:
$('#tipoRicerca').on('change', function () {
        tipoRicerca = $(this).val();
        $('input[name="testoRicerca"]').autocomplete({
            source: 'suggestionRettifiche.get.php?id=' + tipoRicerca,
            minLength: 3,
            autoFill: true,
            max: 50,
            formatItem: function (row) {
                return row[0] + " (" + row[2] + ", " + row[1] + ")" + " " + row[5];
            },
            formatMatch: function (row) {
                return row[0];
            },
            formatResult: function (row) {
                return row[0];
            }
        });
    });
ps
manca il name all'input
 
Tranquillo c'è nella versione orginale, e non funziona lo stesso e non credo sia significativo per il funzionamento dell'autocomplete.
Comunque il problema non è che non funziona l'autocomplete, infatti funziona benissimo per la parte predefnitia, ma non viene proprio passata la id nella get, che definirebbe una query alternativa a quella predefinita.
Comunque sono riuscito nell'impresa e quindi la lascio qui a furtura memoria :D
Codice:
$( 'input[name="testoRicerca"]' ).autocomplete({
                   source: function(request, response)
                   {
                       $.ajax({
                           url: 'suggestionRettifiche.get.php',
                           dataType: "json",
                           data: {
                               term : request.term,
                               id : tipoRicerca
                           },
                           success: function(data) {
                               response(data);
                           }
                       });
                   },
                   
                   minLength: 3,
                   autoFill: true,
                   max:50,
                   formatItem: function ( row ) {   return row[0] + " (" + row[2] + ", " + row[1] + ")" + " "+row[5];   },
                   formatMatch: function ( row ) {   return row[0];   },
                   formatResult: function ( row ) {   return row[0];   }
               });
id è il mio parametro di passaggio.
term è predefinito e non va modificato.
 
Ultima modifica:
Io avevo fatto questa prova
HTML:
<script src="/js/jquery-2.1.0.js" type="text/javascript"></script>
<script src="/js/jquery-ui.js" type="text/javascript"></script>
<script src="/js/jquery.ui.autocomplete.html.js" type="text/javascript"></script>
<select id="tipoRicerca">
    <option value="0" selected>Per nome ( predefinito)</option>
    <option value="1">Per data</option>
</select>
<input type="text" name="testoRicerca" id="testoRicerca" value="">
<script>

    $('#tipoRicerca').on('change', function () {
        autocomplete($(this).val());
    });
    autocomplete(0)
    function autocomplete(tipoRicerca) {
        $('input[name="testoRicerca"]').autocomplete({
            source: 'suggestionRettifiche.get.php?id=' + tipoRicerca,
            minLength: 3,
            autoFill: true,
            max: 50,
            formatItem: function (row) {
                return row[0] + " (" + row[2] + ", " + row[1] + ")" + " " + row[5];
            },
            formatMatch: function (row) {
                return row[0];
            },
            formatResult: function (row) {
                return row[0];
            }
        });
    }
</script>
nel php mi sono limitato a riportare il parametro ricevuto
PHP:
<?php
$a["value"] = $_REQUEST['id'];
echo json_encode($a);
come puoi vedere dall'esempio che ti ho linkato passa correttamente il parametro "id".
 

Discussioni simili