2010-10-26 1 views
1

привет я следовал этот учебник которым использует Jquery UI для создания токенов фейсбук, как: http://net.tutsplus.com/tutorials/javascript-ajax/how-to-use-the-jquery-ui-autocomplete-widget/JQuery UI маркер

моя проблема мне нужно передать два значения через Json: идентификатор и ИМЯ: сервер скрипт выглядит следующим образом:

header('Content-Type: text/html; charset=iso-8859-1', true); 
include($_SERVER['DOCUMENT_ROOT'].'/inrees/inrees/communaute/includes/_db.php'); 

$param = $_GET["term"]; 
$query = mysql_query("SELECT * FROM comm_carnet, in_emails 
         WHERE carnet_iduser=emails_id 
         AND emails_id!='".$_COOKIE['INREES_ID']."' 
         AND emails_nom REGEXP '^$param'"); 

//build array of results 
for ($x = 0, $numrows = mysql_num_rows($query); $x < $numrows; $x++) { 
    $row = mysql_fetch_assoc($query); 
    $friends[$x] = array("name" = > $row["emails_nom"], "id" = > $row["emails_id"]); 
} 

//echo JSON to page 
$response = $_GET["callback"]."(".json_encode($friends).")"; 

echo $response; 

эхо на стороне сервера сценария:

([{"name":"dupont","id":"34998"},{"name":"castro","id":"34996"},{"name":"castelbajac","id":"34995"}]) 

(именно это мне и нужно)

прямо сейчас я передаю массив «name», но не «id», который должен быть скрытым вводом с соответствующим идентификатором из базы данных, html-страницей, где звоните в PHP делается выглядит следующим образом:

//attach autocomplete 
$("#to").autocomplete({ 

    //define callback to format results 
    source: function (req, add) { 

     //pass request to server 
     $.getJSON("messages_ajax.php?callback=?", req, function (data) { 

      //create array for response objects 
      var suggestions = []; 

      //process response 
      $.each(data, function (i, val) { 
       suggestions.push(val.name); 
      }); 

      //pass array to callback 
      add(suggestions); 
     }); 
    }, 

    //define select handler 
    select: function (e, ui) { 

     //create formatted friend 
     var friend = ui.item.value, 
      span = $("<span>").text(friend), 
      a = $("<a>").addClass("remove").attr({ 
       href: "javascript:", 
       title: "Remove " + friend 
      }).text("x").appendTo(span); 
     $("<input />", { 
      value: "id", 
      type: "hidden", 
      name: "id" 
     }).appendTo(span); 
     //add friend to friend div 
     span.insertBefore("#to"); 
    }, 

    //define select handler 
    change: function() { 
     //prevent 'to' field being updated and correct position 
     $("#to").val("").css("top", 2); 
    } 
}); 

//add click handler to friends div 
$("#friends").click(function() { 
    //focus 'to' field 
    $("#to").focus(); 
}); 

//add live handler for clicks on remove links 
$(".remove", document.getElementById("friends")).live("click", function() { 

    //remove current friend 
    $(this).parent().remove(); 

    //correct 'to' field position 
    if ($("#friends span").length === 0) { 
     $("#to").css("top", 0); 
    } 
}); 

так, в основном, где вы видите свой комментарий: "//define select handler" что что-то должно быть сделано, но я не могу это сделать! Я добавил строку:

$("<input />", {value:"id", type:"hidden", name:"id"}).appendTo(span); но он не получает мой массив «id», любая помощь оценивается.

рассматривает

+0

HELP stack overflowers – tetris

ответ

3

ваш код должен быть:

UPDATE С DEMO

$(function() { 
    $("#to").autocomplete({ 
     //define callback to format results 
     source: function(req, add) { 
      //pass request to server 
      $.getJSON("json.json", req, 
      function(data) { 
       add($.map(data, 
       function(item) { 
        return { 
         id: item.id, 
         label: item.name, 
         value: item.name 
        } 
       })); 
      }); 
     }, 
     //define select handler 
     select: function(e, ui) { 
      $('<a class="del_friend" href="#' + ui.item.id + '" title="remove">' + ui.item.label + '<span>x</span>' + 
       '<input name="friend[]" type="hidden" id="friend_' + ui.item.id + '" value="' + ui.item.id + '" /></a>').insertBefore('#to'); 
     }, 
     //define select handler 
     change: function() { 
      $("#to").val(""); 
     } 
    }); 
//delete friends 
    $('a.del_friend').live('click', function(e) { 
     e.preventDefault(); 
     var friend_id = this.hash.split('#')[1]; 
     alert(friend_id); //AJAX Call and delete item by it's ID 
     $(this).fadeOut(500).remove() 
    }); 
}); 
  • Примечание: это предполагается, что ваш JSON код выглядит следующим образом:

    [{ "Имя": "Дюпон", "идентификатор": "34998"}, { "имя":» Castro», "идентификатор": "34996"}, { "имя": "Кастельбажак", "идентификатор": "34995"}]


  • ВАЖНАЯ READS:
+0

Это выглядит действительно круто. веселит. (пожалуйста, держите демо онлайн) – tetris

0

Таким образом, это выглядит, как вы добавляете только name S в список предложений, а не все data объекта, который будет содержать name и id членов. Вместо того, чтобы сделать это:

suggestions.push(val.name) 

пытается толкая весь объект данных на список вы передаете на ваш обратный вызов:

suggestions.push(val) 

Тогда в обратном вызове, ui.item.value будет содержать полный элемент данных, поэтому вам нужно немного изменить свой код.Чтобы получить доступ к значениям name и id отдельно, можно предположительно сделать что-то вроде этого:

var friendName = ui.item.value.name; 
var friendID = ui.item.value.id; 

Затем вы можете использовать эти переменные, где нужно (friend становится friendID, и вместо передачи {value:"id" ...} к скрытому входу, вы могли бы сделать {value:friendID ...}

+0

Я попробовал, он не работает. – tetris