JQuery with SMARTY and JSON

Question

table department (department_id, name) table category (category_id, department_id, name)

I want to realize the idea that when changing a department in the drop-down list, all categories will change in accordance with the value of the department

This is my jquery script

{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}

I want to know how I can embed the code for the Ajax class in ajax.php file to return json

I do it as before but nothing happens b / c i dont use class

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

Now I want to use a class with PDO to implement this idea, help me plz

Answer 1

I can help with the concept and algorithm:

• Display the department dropdown and add jquery to handle the change event.
• JSON , IE . - 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.

Answer 2

jQuery Smarty auto_update. http://www.balupton.com/sandbox/jquery-smarty/demo/