我有一个下拉样式with chosen jquery,看起来效果很好。
此下拉列表有两个选项:Defender和Protector。
当用户选择一个选项时,会出现第二个下拉列表(奇怪的是未选择样式)以及询问后卫或保护者是否有ID。
我不知道如何将所选样式应用于生成的下拉列表。 我尝试在jquery函数上附加chzn类但没有成功。
如何使用所选样式设置生成的下拉列表的样式?
这是剧本:
$(function () {
$('#select_guy').change(function () {
$('#already_exists').show();
$('.people_class').hide();
if ($('#select_guy').val() == 'Defender') {
$("#already_exists").html('');
$("<option/>").val('0').text('Select option').appendTo("#already_exists");
$("<option/>").val('Defender-hasID').text('Defender has ID').appendTo("#already_exists");
$("<option/>").val('Defender-noID').text('Defender has NO ID').appendTo("#already_exists");
}
if ($('#select_guy').val() == 'Protector') {
$("#already_exists").html('');
$("<option/>").val('0').text('Select otcion').appendTo("#already_exists");
$("<option/>").val('protector-hasID').text('Protector has ID').appendTo("#already_exists");
$("<option/>").val('protector-noID').text('Protector has NO ID').appendTo("#already_exists");
}
});
$('#already_exists').change(function () {
$('.people_class input').val('');
$("#id_cedente").val('').trigger("liszt:updated");
$("#id_protector").val('').trigger("liszt:updated");
$('.people_class').hide();
$('#' + $(this).val()).show();
/*if ( $('#already_exists').val() == 'Defender-noID' )
$(".chzn-select").val('').trigger("liszt:updated");*/
});
});
$(".chzn-select").chosen();
$(".chzn-select-deselect").chosen({
allow_single_deselect: true
});
$(".chzn-select").chosen({
no_results_text: "No results"
});
请查看 jsfiddle
@Serhiy几乎解决了它的问题
$('#already_exists').chosen();
在功能结束时
答案 0 :(得分:1)
我认为你只需要在主变更函数中执行render方法。
$(".chzn-select").chosen();
由于动态添加下拉列表并且最初未呈现。
如果这是一个新项目,你也可以查看select 2,它可能在这一点上更加发达,尤其是因为你正在使用jquery。 http://ivaynberg.github.io/select2/