Question

表部门（department_id，名称）表类别（category_id，department_id，name）

我想实现这样的想法：当我在下拉列表中更改部门时，所有类别都将根据部门值进行更改

这是我的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.php中实现类Ajax的代码返回json

我以前喜欢它，但没有任何事情发生b / c我不使用类

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

现在我想用PDO实现这个想法，帮助我plz

Answer 1

我可以帮助理念和算法：

显示部门下拉列表并添加jquery以处理更改事件。
仅加载类别的JSON数据是好的，但有时它在IE和Safari中不起作用。一种强有力的方法是使用AJAX加载完整的select，然后替换现有的类别下拉列表。

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/

使用SMARTY和JSON的Jquery

2 个答案: