[英]jQuery Select2 plugin on dynamicaly loaded div
I try to load a div that has a listbox with a select2 plugin. 我尝试加载一个具有带有select2插件的列表框的div。 The below code is for the div container 以下代码用于div容器
<div class="form-body">
<div class="form-group">
<?php echo lang('project_product', 'product', array('class' => 'col-sm-2 control-label')); ?>
<div class="col-sm-2">
<select id="id_product" name="id_product" tabindex="4" class="form-control select2 id_product"></select>
</div>
</div>
<div class="form-actions pull-right">
<a href="javascript:;" id="cancel_product" class="btn btn-default">
Cancel
</a>
<a href="javascript:;" id="add" class="btn btn-success">
<i class="fa fa-plus"></i> Add product
</a>
</div>
</div>
The div container is loaded by a on click event on a button: div容器通过按钮上的on click事件加载:
$(document).on('click', '#add_product', function(e){
$('#add_p_container').removeClass('hide');
$('#add_p_container').load(JS_BASE_URL + 'admin/projects/add_product/' + id_project);
});
The issue is that, if I load the jQuery from below in the js file where the on click event for the #add_product
, nothing will work for the select2. 问题是,如果我从下面的js文件中加载jQuery文件,其中#add_product
的on click事件对select2 #add_product
。
The code that I use to initialize the select2: 我用来初始化select2的代码:
$("#id_product").select2({
minimumInputLength: 2,
placeholder: "Select a product",
allowClear: true,
quietMillis: 100,
ajax: {
url: JS_BASE_URL + 'admin/products/productsList',
dataType: 'json',
type: "GET",
quietMillis: 50,
data: function (params) {
return {
q: params.term, // search term
page: params.page
};
},
processResults: function (data, params) {
// parse the results into the format expected by Select2
// since we are using custom formatting functions we do not need to
// alter the remote JSON data, except to indicate that infinite
// scrolling can be used
params.page = params.page || 1;
return {
results: data,
pagination: {
more: (params.page * 30) < data.total_count
}
};
},
cache: true
},
escapeMarkup: function(markup) {
return markup;
} // let our custom formatter work
});
If I load the select2 from above directly when loading it in the div, I will receive the error: 如果在div中将select2直接从上面加载时,我将收到错误消息:
[Show/hide message details.] SyntaxError: expected property name, got end of script
Does any of you know how to solve this? 你们当中有人知道如何解决吗? Thank you! 谢谢!
After trying to search a way to fix the issue, it seems that loading the script into the div will work but removing all the comments I don't know why, but it des work 在尝试寻找解决问题的方法之后,似乎可以将脚本加载到div中,但是删除所有我不知道为什么的注释,但是可以工作
So, make sure you do not leave any comments, otherways it will not work 因此,请确保您没有留下任何评论,否则它将无法正常工作
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.