0

所以我目前正在处理按州组织的商店列表。而不是只将它们全部列在页面上,我想使用一个选择框,您显然选择了一个状态,然后处于该状态的商店异步显示而无需点击提交按钮......我觉得我知道它背后的理论,我只是在寻找一个很好的例子/教程来工作

谢谢你的帮助

skv

4

2 回答 2

1

我会为您的商店创建您选择的状态框和选择容器;

<select id="state">
    <option value="">Select State</option>
    <option value="AL">Alabama</option>
    ...
</select>
<select id="stores"></select>

然后在jquery中设置一个change事件来监听你的状态选择框来改变

$('#state').change(function(){
    if($(this).val()==''){
        $('#stores').html('<option value=""></option>');
        return;
    }
    $.ajax({
        type:"POST",
        url:"PATH_TO_PHP",
        data:"state="+$(this).val(),
        success:function(x){
            $('#stores').html(x);
        }
    });
});

然后在您的 php 端检索状态,找到商店并返回选项

$state = $_POST['state'];

// $stores = SQL QUERY TO GET STORES

echo '<option value="">Choose a Store</option>';
foreach($stores as $s){
    echo '<option value="'.$s.'">'.$s.'</option>';
}
于 2012-10-17T18:33:58.090 回答
1

您可以尝试搜索 ajax php 下拉教程,作为快速指导,您需要做的就是使用选定状态向您的服务器运行 ajax 请求,并在下一个下拉列表中填写商店名称,我将粘贴示例代码在这里,但您仍然需要根据您的需要对其进行修改。

HTML 结构

<select name="state" id="state">
<option value="State1"> State 1 </option>
<option value="State2"> State 2 </option>
<option value="State3"> State 3 </option>
</select>

<div id="store_dropdown">
</div>

jQuery Ajax 请求

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script type="text/javascript">
    $(function(){
        function getStores(){
            data = 'state=' + $('#state').val();
            $.post('getStores.php',data,function(response){
                $('#store_dropdown').val(response);
            })
        }

        $('#state').keyup(getStores);
        $('#state').keydown(getStores);
        $('#state').mouseup(getStores);
        $('#state').mousedown(getStores);
    })
</script>

php代码

    $state = $_POST['state'];
// here goes your sql query to the database

// run a while loop with the fetched data

$output = '<select name="store_name">';
while($row = mysql_fetch_array($sql))
{
    $output .= '<option value="'.$row['store_name'].'">'.$row['state_name'].'</option>';
}
$output .= '</select>';
echo $output;
于 2012-10-17T18:27:46.763 回答