Question

首先，我使用wordpress，目标是选择以jquery结构的下拉菜单选项，以选择父类别。然后，此选择将使用父项的子类别更新第二个选择菜单。

到目前为止，我有这个ajax：

<script>
$(function(){
    $( "#categories" )
      .selectmenu({
        select: function getval() {
        var parent = $("#categories").val();

        $.ajax({
            url: "ajax.php",
            data: { parent : parent },
            type: "POST",
            success: success: function(response){
                $(".sub_cat").html(response);
            },
            error: function() {
                alert("Error, possible missing file.");
            }
            }); //End of ajax
        alert(parent);
        } //End of getval

        }) //End selectMenu
      .selectmenu( "menuWidget" )
        .addClass( "overflow" );

    $( "#sub_cats" )
       .selectmenu()
       .selectmenu( "menuWidget" )
       .addClass( "overflow" );

     var categories = $('#categories');
     var subcats = $('#sub_cats');       
});
</script>

这是将填充的HTML：

<fieldset>
<div class=sub_cat>

</div>
</fieldset>

这是ajax.php：

<?php
$parent = $_POST['parent'];
$subcats = get_categories("child_of=$parent");

$parent =   "<label for="sub_cats">Select a Sub-category</label>
            <select name="sub_cats" id="sub_cats">
            <option selected="selected">Pick a Sub-Category</option>" .
            foreach($subcats as $subcat) {
            "<option value=" echo $subcat->name ">" . echo $subcat->name . "</option>"
            } .
            "</select>"
?>

菜单按原样进入，警报进入，父类别在选择时始终发送到ajax。但成功警报从未被触及，我不知道我应该放在ajax.php文件中。我的猜测是使用该文件来获取php中的子猫，然后以json格式发送它，但我不知道如何。

绝对感谢任何帮助，我一直在努力解决这个问题。

我已经尝试过以下的解决方案，但我从来没有从ajax.php获得任何代码或值，并且有任何答案。多数民众赞成在哪里停止。我也不知道如何使用新项目填充下一个选择框。假装我是一个超级无知的程序员，对这些结构并不了解，并从这个角度解释，这可能对我有所帮助。

Answer 1

在ajax.php文件中......执行此操作......

$parent = $_POST['parent'];

// Query the subcategories using parent ..

// then loop and create select box ...

然后改变下面的ajax成功...并将数据填充到subcatogory div

success: function(response){
    $(".subcat-div").html(response);
}

Answer 2

简单的方法是在#categories中更改事件这必须向服务器发送请求，并以html格式响应#sub_cats

让我们看看：

//in your js 

$(document).ready(function(){
     $("#categories").change(function(){
        //here we get corrent selected id 
        //form categories in corrent selected option
        var id = $(this).val();

        //simple ajax request $.post
        $.post("ajax.php",{
            id:id           
        },function(data){
            $("#sub_cats").empty()
            $("#sub_cats").append(data)
        },"html")
    });
}

//

在ajax.php上，你的回报必须是Html

...您的查询高于最终结果：

while($sub = mysqli_fetch_array($result, MYSQLI_ASSOC)){
    echo "<option value='".$sub['id']."'>".$sub['name']."</option>";
}

检查出来。

如何使用Ajax使用第一个选择框的值来更新jquery中的第二个选择框？

2 个答案: