Jquery multiple autocomplete-Feld

Habe ich die jquery auto-complete von der jquery-website. es funktioniert ebenso gut für ein Feld. Nun jedoch möchte ich hinzufügen, dass verschiedene Bereich mit unterschiedlichen Werten, wie mache ich das? Ich habe versucht, einige Möglichkeiten, die aber vermasselt das ganze system. Über alle einem meiner Felder ist man jetzt nicht. muss ich ihm eine neue Funktion namens. Ich bin neue auf diese Dinge.

Ich dachte, dass durch das hinzufügen ein neues Feld und neue var oben würde es funktionieren, aber es didng

var projects = [
  {
    value: "CMPT101",
    label: "CMPT 101",
    desc: "Discrete Mathematics I"

  },


  var instr={
      value:"johnson "
      lable:"Johnson"
  }
]



select: function( event, ui ) {
        $( "#project" ).val( ui.item.label );
        $( "#instr" ).val( ui.item.label );
        $( "#project-id" ).val( ui.item.value );
        $( "#project-description" ).html( ui.item.desc );
        $( "#project-icon" ).attr( "src", "images/" + ui.item.icon );

http://jsfiddle.net/6wTHK/4/

es gibt mehrere Tippfehler in deinem fiddle ^^ kann nicht funktionieren!
Sie vermissen ein { in Ihre fiddle an JavaScript line 65. Außerdem müssen Sie jQuery und jQuery UI
auch ID eindeutige Verletzung in die Eingabefelder. Sie nicht haben die gleiche id.
Tut mir Leid, Jungs. okay Ihr seit jetzt behoben vielen Dank, aber wie bekomme ich das zweite Feld, um ein drop-box, mit tottaly andere Werte?
füllen Sie eine zweite var foo =[{ yikes:'super' }, ..] und geben auch alle jquery Sachen hinter sich, wie in der ersten.

InformationsquelleAutor benzo | 2013-04-12

  1. 1

    So, ich habe ein Beispiel, um Ihnen zu erklären, was Sie tun müssen, um mehr Eingänge.

    FIDDLE: http://jsfiddle.net/6wTHK/6/ nicht wie im code unten

    Können sagen, wir haben zwei inputs :

    <input  name="project1" id="searchbox1" placeholder="Cmpt 1"/>
<input  name="project2" id="searchbox2" placeholder="Cmpt 2"/>

    #searchbox1 hat es die Werte gespeichert, die in der var projects1

    var projects1 = [
      {
        value: "CMPT101",
        label: "CMPT 101",
        desc: "Discrete Mathematics I"
},
{
        value: "CMPT102",
        label: "CMPT 102",
        desc: "Discrete Mathematics II"
},
{
        value: "CMPT103",
        label: "CMPT 103",
        desc: "Discrete Mathematics III"
}];

    #searchbox2 hat es die Werte gespeichert, die in der var projects2

    var projects2 = [
          {
            value: "CMPT104",
            label: "CMPT 105",
            desc: "Discrete Mathematics IV"
    },
    {
            value: "CMPT106",
            label: "CMPT 106",
            desc: "Discrete Mathematics V"
    },
    {
            value: "CMPT107",
            label: "CMPT 107",
            desc: "Discrete Mathematics VI"
    }];

    Jetzt für jede input fügen wir die .autocomplete() Funktion;

     $( "#searchbox1" ).autocomplete({ //change #searchbox2 to your input id
      minLength: 0,
      source: projects1, //change here the source of your values
      focus: function( event, ui ) {
        $( "#searchbox1" ).val( ui.item.label );
        //you had more stuff here
        return false;
      },
      select: function( event, ui ) {
        $( "#searchbox1" ).val( ui.item.label );
        //you had more stuff here
        return false;
      }, 
      })
    .data( "ui-autocomplete" )._renderItem = function( ul, item ) {
      return $( "<li>" )
        .append( "<a>" + item.label + "<br>" + item.desc + "</a>" )
        .appendTo( ul );
    };

    Und für die zweite input

    $( "#searchbox2" ).autocomplete({ //change #searchbox2 to your input id
          minLength: 0,
          source: project2, //change here the source of your values
          focus: function( event, ui ) {
            $( "#searchbox2" ).val( ui.item.label );
            //you had more stuff here
            return false;
          },
          select: function( event, ui ) {
            $( "#searchbox2" ).val( ui.item.label );
            //you had more stuff here
            return false;
          }, 
          })
        .data( "ui-autocomplete" )._renderItem = function( ul, item ) {
          return $( "<li>" )
            .append( "<a>" + item.label + "<br>" + item.desc + "</a>" )
            .appendTo( ul );
        };
    ein bisschen css Zuhälterei jsfiddle.net/6wTHK/8
    okay vielen Dank, lassen Sie mich versuchen, dies jetzt, bc ich habe es einmal gemacht, aber vielleicht kann ich vergessene Sachen
    jsfiddle.net/6wTHK/9 eines Tages wirst du uns unterrichten! 😛
    Ist es okay, wenn ich sage, ich Liebe dich hier ??? ich danke Euch so sehr, ich wünschte, ich wüsste, wie viel Sie haben
    ich denke, das ist, was stackOVERflow bedeutet. es gibt eine Menge von rude dudes auch. aber eines Tages werden Sie Hilfe brauchen :))

    InformationsquelleAutor Spokey

Schreibe einen Kommentar