javascript – 设置select2输入的默认值

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了javascript – 设置select2输入的默认值，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含2235字，纯文字阅读大概需要4分钟。

内容图文

我正在使用select2,我对这个库有点新手.
我有一个页面,如果该值被发布,我的select2输入应设置为默认值.
这是html

<!-- COUNTRY -->
<span id="agency_data">
    <input type="hidden" name="country_id" id="filter_country" data-placeholder="Choose A Country Name" data-init-text="<?= isset($data['cty_name']) ? $data['cty_name'] : '' ?>" value="<?= isset($data['cty_name']) ? $data['cty_name'] : '' ?>" />
 </span> 

这是我的jQuery

        //******** COUNTRY ********
if(typeof countryId === 'undefined') {
    countryId = '';
}
if(typeof countryName === 'undefined') {
    countryName = '';
}

var dataArray = [{id:countryId,text:countryName}];

$('#filter_country').select2({
    minimumInputLength: 0,
    allowClear: true,
    ajax: {
        url: base +"/agencyList/search",
        dataType: 'json',
        type: 'POST',
        data: function (term, page) {
            return {
                country: term
            };
        },
        results: function (data, page) {
            return { 
                results: data
            };
        }
    },
    data:dataArray,
    initSelection: function (element, callback) {
        $(dataArray).each(function() {
            if (this.id == element.val()) {
                callback(this);
                return
            }
        })
    }
});

正如我所说,我无法弄清楚如何设置输入的默认值.
我看过this solution但仍然无法让它工作.
有什么帮助吗？

工作方案

感谢约翰在这里我是如何工作的：
 HTML：

<span id="agency_data">
                    <input type="hidden" name="ag_cty_id" id="filter_country" data-placeholder="Choose A Country Name" data-init-text="<?= isset($data['cty_name']) ? $data['cty_name'] : '' ?>" value="<?= isset($data['ag_cty_id']) ? $data['ag_cty_id'] : '' ?>" />
                </span>

jQuery的：

    $('#filter_country').select2({
    minimumInputLength: 0,
    allowClear: true,
    ajax: {
        url: base +"/agencyList/search",
        dataType: 'json',
        type: 'POST',
        data: function (term, page) {
            return {
                country: term
            };
        },
        results: function (data, page) {
            return { 
                results: data
            };
        }
    },
    initSelection: function (element, callback) {

        console.log('id elemt: ' + element.val());
        callback({ id: element.val(), text: element.attr('data-init-text') });
    }
});

解决方法:

我认为您显示的代码不起作用的原因是您将dataArray中对象的id属性与输入值进行比较,但输入的值是国家/地区名称,而不是国家/地区ID.

您应该将输入值设置为国家/地区的ID,而不是其名称.

然后你可以避免使用dataArray并使用：

initSelection: function(element, callback) {
    callback({ id: element.val(), text: element.attr('data-init-text') });
}

这将从输入的值和输入的data-init-text属性中的文本中获取id.

jsfiddle

内容总结

以上是互联网集市为您收集整理的javascript – 设置select2输入的默认值全部内容，希望文章能够帮你解决javascript – 设置select2输入的默认值所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端