当选择数组时,基于另一个选择框填充

时间:2013-04-02 03:10:54

标签: php jquery

我知道如何使用jquery和ajax根据另一个选项填充一个选择框,但是如果选择框是数组,你怎么做呢?

默认情况下页面上有5个,但是我也使用.EnableMultiField()来添加更多行,因为我需要它们......在任何给定的一周,我们将10到30辆车添加到我们的库存中。

的Ajax:

$(".make").change(function() {
var id=$(this).val();
var dataString = 'id='+ id;

$.ajax ({
    type: "POST",
    url: "get_models.php",
    data: dataString,
    cache: false,
    success: function(html) {
        $(".model").html(html);
    } 
});

});

PHP:

            <ul>
            <li><label for="year[]">Year</label><select name="year[]"><option></option>'.$Year.'</select></li>
            <li><label for="year[]">Make</label><select name="make[]" class="make"><option></option>'.$Make.'</select></li>
            <li><label for="year[]">Model</label><select name="model[]" class="model" style="width: 120px"><option></option>'.$Model.'</select></li>
            <li><label for="trim[]">Trim</label><input type="text" size="10" name="trim[]" /></li>
            <li><label for="vin[]">VIN</label><input type="text" name="vin[]"size="20" maxlength="17" onkeyup="return Upper(event,this)" /></li>
            <li><label for="mileage[]">Mileage</label><input type="text" name="mileage[]" size="3" maxlength="6" /></li>
            <li><label for="color[]">Color</label><select name="color[]"><option></option>'.$Color.'</select></li>
            <li><label for="cost[]">Cost</label><input type="text" name="cost[]" size="6" maxlength="6" onchange="currency(this)" /></li>
            <li><label for="asking[]">Asking</label><input type="text" name="asking[]" size="6" maxlength="6" onchange="currency(this)" /></li>
        </ul>

2 个答案:

答案 0 :(得分:1)

我认为你的问题是你通过AJAX加载的模型是在所有.model中设置的。您需要将$('.make').change(...)更改为以下

        $(".make").change(function () {
           var $this = $(this);
           var id = $(this).val();
           var dataString = 'id=' + id;

           $.ajax({
              type: "POST",
              url: "get_models.php",
              data: dataString,
              cache: false,
              success: function (html) {
                 $(".model", $this.closest('ul')).html(html);
              }
           });
        });

这将设置新的&#34;模型&#34;仅适用于已更改.model&#39; s .make

中的<ul>

<强>更新

以适应动态添加的.make,替换

$(".make").change(function () {

$(document).on('change', 'ul .make', function () {

答案 1 :(得分:0)

我对答案的建议是,您的前三个<label>错误地指向year[]而不是year[]make[]model[]。这会丢掉你的东西吗?它击中了第一个“制造”字段并抛出。对我有意义......

祝你好运(: