0

我有 2 个选择框，一个带有汽车名称，第二个带有汽车型号，当我选择汽车名称（例如 BMW）时，第二个选择框必须更新属于 BMW 的汽车型号。我用 jQuery 创建了这个日志。但问题是，我的网页设计师使用 css3 创建了非常酷的选择框设计，为此他需要隐藏输入并选择具有相同 ID 属性的标签（例如 id="car_model"）。当我调用 jQuery 函数时，它会更新隐藏的输入并用选项填充它。我如何选择使用 id="car_model" 而不是具有相同 id="car_model" 的隐藏类型的选择。

控制器：

class HomeController {

def index() {
    def cars = Car.list();
    render (view: '/index', model:[cars:cars])
}

def getModels(params) {
    def models = Models.findAll {
        car.id == params.id
    }
    println(models)
    withFormat {
        html {
            render(template:'/select',model:[model:models])
        }
        json {
            render models as JSON
        }
    }
}

}

看法：

<div class="row field_select">
                <label class="label_title">Select Maker:</label>                    
                <g:select class="select_styled" name="car_maker" from="${cars}"
                    optionKey="id"
                    optionValue="name"
                    noSelection="['':'- Choose a car -']"
                    onchange="${remoteFunction(
                        action:'getModels.json',
                        onSuccess:'getCarModels(data)',
                        params:'\'id=\' + this.value' )}"/>

            </div>
            <div class="row field_select" >
                <label class="label_title">Select Model:</label>
                <select class="select_styled" name="car_model"></select>
            </div>

jQuery：

function getCarModels(data) {   
var $element = $('#car_model');
$element.empty();
$.each(data, function(id, modelName) {
  var option = $('<option/>').val(id).text(modelName);
  $element.append(option)
});
}

编辑：在此处输入图像描述

4

1 回答 1

0

元素的 idhtml应该是唯一的，您可以分配一个类来选择以使用class selector. 隐藏字段不会获得选择类，您将能够区分它。

var $element = $('.selectclass');

您没有其他选择，只有两个具有相同 id 和不同类型的元素，然后您可以通过在选择器中添加typeoftag来选择

现场演示

var $element = $('select[name=car_model]');
于 2013-09-26T09:58:55.877 回答