В JQuery UI есть так называемое selectmenu,смысл заключается в том чтобы закинуть туда нужные мне пункты списка (тобишь option)которые в свою очередь приходят json из базы данных,
и при выборе некого пункты списка сделать нужную подгруздку данных из того же json'a по средствам ajax соответственно .С помощью сценария получил некий json(скинул именно preview,т.к будут символы из-за кодировки) :
{id: "1", city: "Санкт-Петербург", name: "Вася"}
{id: "2", city: "Москва", name: "Коля"}
{id: "3", city: "Тверь", name: "Петя"}
{id: "4", city: "Самара", name: "Света"}
{id: "5", city: "Великий Новгород", name: "Костя"}
{id: "6", city: "Краснодар", name: "Ира"}
{id: "7", city: "Ярославль", name: "Настя"}
При этом есть такая вот разметка :
<select id="selectmenu">
<option value="" selected="selected"></option>
</select>
И непосредственно сам скрипт :
$(document).ready(function(){
$( "#selectmenu" ).selectmenu({
change: function() {
//текущий пункт списка
alert($("#selectmenu :selected").html());
}
});
$.getJSON('mysql_json.php', function(data) {
for(var i=0;i<data.length;i++){
$('#selectmenu').append("<option>"+data[i].city +"</option>");
}
});
});
Собственно по событию change должен происходить та самая ajax подгруздка данных(например выбрали пункт меню Москва - и отображаются всю люди с Москвы ) Для этого я как понимаю надо условие,что бы текущий список пункта
$("#my_select :selected").html();
должен быть равен в многомерном массиве переменной city c последующими данными в виде кто там живет непосредственно - name.
Или как то можно проще все реализовать?
И как сделать так чтобы ajax был неким параметром как событие change?Много раз видел что делают вот так :
$( "#selectmenu" ).selectmenu({
change: function() {
//текущий пункт списка
alert($("#selectmenu :selected").html());
},
open:function(){
наш ajax запрос...
});
Но так не получается.
Заранее больше спасибо!