JQuery с SMARTY и JSON - PullRequest
Новая
       22

JQuery с SMARTY и JSON

3 голосов
/ 13 февраля 2010

стол отдела (отдел_ид, название) категория таблицы (category_id, департамент_id, имя)

Я хочу реализовать идею о том, что при изменении отдела в раскрывающемся списке все категории будут меняться в зависимости от значения отдела

Это мой jquery скрипт 

{literal}
<script type="text/javascript">
$(document).ready(function(){
  $('#department').change( function() {
    var departmentVal = $(this).val();
    $("#category option").remove();
    $.getJSON("ajax.php",{departmentId: $(this).val(), dataType: "json", ajax: 'true'},
      function(j){
        var options = '';
          for (var i = 0; i < j.length; i++) {
            options += '<option value="' + j[i].category_id + '">' + j[i].name + '</option>';
           }
         $("#category").html(options);  
    })
  });
});
</script>
{/literal}

Я хочу знать, как я могу улучшить код для класса Ajax в файле ajax.php вернуть JSON

Я делаю это раньше, но ничего не происходит, потому что я не использую класс 

$category= array();
while($grab = $db->fetch_array($result)) {
  $category[] = array('optionValue' => $grab['category_id'], 'optionDisplay' => $grab['name']);
}
echo json_encode($category);

Теперь я хочу использовать класс с PDO для реализации этой идеи, помогите мне, плз

Ответы [ 2 ]

1 голос
/ 14 февраля 2010

Я могу помочь с концепцией и алгоритмом:

  1. Показать выпадающий список отдела и добавить jquery для обработки события изменения.
  2. Загрузка только данных JSON для категорий - это хорошо, но иногда это не работает в IE и Safari. Один из надежных способов сделать это - загрузить полный select с помощью AJAX, а затем заменить существующий выпадающий список категорий. 
jQuery(function($){
  $('#department').change( function() {
    var departmentVal = $(this).val();
    var cat_parent =  $("#category").parent();
    cat_parent.html("Loading...");
    $.get("category_select.php",
          {departmentId: departmentVal},
          function(data){
            cat_parent.html(data);
          })
  });
});

category_select.php потребуется вернуть данные в формате: 

<select id="category">
  <option>...</option>
</select>

Убедитесь, что вы поместили выбранную категорию в родительский объект, у которого нет других детей: 

<span>
  <select id="category">
    <option>Select a department first</option>
  </select>
</span>

Этот метод будет работать в последних версиях IE, Safari, Google Chrome и Firefox.

0 голосов
/ 23 июля 2010

Вы должны иметь возможность реализовать это с помощью jQuery Smarty с его модификатором auto_update. http://www.balupton.com/sandbox/jquery-smarty/demo/

...