多组下拉列表

时间:2012-05-01 22:20:24

标签: javascript jquery

在jQuery中,如何为每组手机获取多个下拉菜单,例如:

客户可以选择1台以上的手机进行订购。首先,客户需要从下拉列表中选择一个手机(1到15)。

如果他们从下拉列表中选择了数字5,那么5组dropdrowns应该如下所示:

第一组:

Select Phone [Dropdown / load entries via ajax] 

Select Contract Length [Dropdown / load entries via ajax]

Select Contract Plan [Dropdown / load entries via ajax]

Select Additional Addon [Dropdown  / load entries via ajax]

第二组:

Same dropdowns as above

其他问题是,如果错误(PHP验证)没有正确填写表单 - 它将重定向回同一页面,但需要再次重新选择下拉列表。如何让它也起作用?

2 个答案:

答案 0 :(得分:1)

非常确定你必须将一些表示表单完成失败的变量添加到会话或html中的某些隐藏元素然后加载文档 - 检查该变量并手动调用这些下拉列表。

OR

不允许点击提交按钮并在javascript中检查验证。然而,它不会那么安全,但它会为你和用户节省麻烦。我自己更喜欢在单击提交之前检查表单只是等待几秒钟直到重新加载页面并且我面对我选择/写错了的事实。

OR

使用xmlhttprequest或类似的工作自动验证提交点击,js访问php文件,验证,返回结果并允许提交数据。不会超级安全,但是......你可以再次使用相同的php文件重新检查(如果有人尝试非法传递一些数据而不是通过表单并且xmlhttprequest无法捕获它,将被捕获)。对用户来说是最安全和最好的方式。

答案 1 :(得分:1)

假设这个标记:

<select id="qty">
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
</select>
<div id="placeholder"></div>

使用此JavaScript:

$('#qty').change(function() {
    var qty = $('#qty').val() * 1;

    $('#placeholder').html(''); //Clear existing.

    for (var i = 0; i < qty; i++)
    {
        $('#placeholder').append(
            '<select id="phone_' + i + '"></select>');
    }
});

在您的PHP脚本中,您需要检查每个可能的字段名称 - 可能会更糟糕,最好在提交之前将这些名称合并到隐藏字段中。

看起来@AndriusNaruševičius回答了你问题的另一半。