@sacred1

Как реализовать ajax в jQuery UI?

В 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 запрос...
			});

Но так не получается.
Заранее больше спасибо!
  • Вопрос задан
  • 3063 просмотра
Пригласить эксперта
Ответы на вопрос 1
@AlexanderY
Не совсем понятен вопрос, хотя, если отвечать на "Собственно по событию change должен происходить та самая ajax подгруздка данных", возьмите и подставьте свой ajax-запрос в функцию:

$(document).ready(function(){
      $( "#selectmenu" ).selectmenu({
        change: function() {
          $.getJSON('mysql_json.php', function(data) {
            for(var i=0;i<data.length;i++){
                $('#selectmenu').append("<option>"+data[i].city +"</option>");
            }
          });
                                //текущий пункт списка 
        	alert($("#selectmenu :selected").html());
        }
      });

      
});


Хотя, повторюсь, ваша задача мне до конца не ясна.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы