Automatische Vervollständigung mit unterschiedlichen Werten als der Titel

Question

Ich versuche, eine Form der automatischen Vervollständigung mit Jquery zu machen, aber ich habe in ein Problem laufen. Ich versuche, es zu machen, so dass, wenn ein Benutzer auf den Namen eines Ortes eingeben beginnt, die in unserer Datenbank ist, ist es ihnen den vollständigen Namen des Ortes, in dem die automatische Vervollständigung zeigt, aber wenn sie darauf klicken, wird das Textfeld gefüllt mit die Adresse des Ortes, die mit google Maps dargestellt werden. Was wäre der beste Weg, dies zu erreichen?

Answer 1

Hier ist eine sehr grobe Skizze von Code, der Ihnen den Einstieg erhalten. Keineswegs ist es vollständig, aber es sollte Ihnen eine gute Startpunkt geben. Hoffe, es hilft

$("#mySearchBox").change(function(){
/*
    send a ajax request to receive a json object.
    We use the callback function to populate the 
    a div tag "autocomplete" with the names
*/
$.getJSON("http://myurl.com/myPage?search="+$(this).val()
        function(data){
          $.each(data.items, function(i,item){
            /*
                Assume item looks like this

                item = {[{"address": 100 Main st",
                           "name": "Bob and Joe's Dinner"],
                            ...
                       }
            */              
                /* Populate autocomplete with new spans
                   We use the text attribute to hold the address
                   You may want to look in to jquery data() feature. 
                */
                $("#autoComplete").append('<span text="'+ item.address +
                                          '" class="searchResult">'+ item.name +'</span>');
          });
        });

});

$("#autoComplete .searchResults").click(function(){
    /*  
        Here we handle what the user clicks on.
        Pull out the address from the attr and 
        put that back in the mySearchBox
    */
    var address = $(this).attr("text");

    //Load the adress back int the textfield
    $("#mySearchBox").val = address;
});

Answer 2

Wahrscheinlich in dem gesamten „Person“ Objekt in Javascript übergibt ein JSON-Objekt. Dann können Sie wählen, und wählen, wo Sie jedes Stück des Objekts gehen wollen.