select2下拉插件,自动填充并添加新记录

Question

我现在正在使用select2下拉插件.我遇到的情况是我必须添加一个select2字段,该字段会自动填充我们应用中的现有邮件ID.我能够这样做,但我还必须添加新的邮件ID,它们不在同一领域的应用程序中.我无法解决这个问题.你能不能帮我解决这个问题......

这是我的视图页面代码.

 <input type="hidden" class="select2 to_email w-100" name="to_email[]"
 data-role="to_email" data-width="100%" data-placeholder="To" value="">

Js代码:

$('body').on('click','[data-button="reply-mail"],[data-click="reply"]', function() {
    attach = [];
    var $ti = $(this).closest('[data-role="row-list"]').find('[data-role="reply-mail-wrap"]');
    var $to_this = $ti.find('[data-role="to_email"]');
    var mail_toadr = $ti.find('input[name="to_addr"]').val(); 
    $($to_this).select2({
        placeholder: "Search for a contact",
        minimumInputLength: 3,
        //maximumSelectionLength: 1,
        multiple : true,
        ajax: {
            url: Utils.siteUrl()+'mailbox/get_all_contacts',
            type: 'POST',
            dataType: 'json',
            quietMillis: 250,
            data: function (term, page) {
                return {
                    term: term, //search term
                    page_limit: 100 // page size
                };
            },
            results: function (data, page) {
                return { results: data};
            }

        },
        initSelection: function(element, callback) {
            return $.getJSON(Utils.siteUrl()+'mailbox/get_all_contacts?email=' + (mail_toadr), null, function(data) {
                    return callback(data);

            });
        }
    });
});

我知道,工作范例对你来说可能更好,但对不起,我不知道怎么做.屏幕截图为小帮助:http://awesomescreenshot.com/08264xy485

请帮忙..

Answer 1

我已经解决了我的要求。如果我们在字段中输入不存在的值，则 results:function (data, page) {...}返回一个空数组。我们可以这样检查：

results: function (data, page) {
    for (var obj in data) {
        id = JSON.stringify(data[obj].id);
        text = JSON.stringify(data[obj].text);
        if (id == '"0"') {
            $ti.find('.to_email').select2('val', '<li class="select2-search-choice"><div>'+ text +'</div><a tabindex="-1" class="select2-search-choice-close" onclick="return false;" href="#"></a></li>');
        }
    }
    return { results: data};
}

但是，比这更好的是，我建议您在我们获取结果的区域进行检查（此处：）Utils.siteUrl()+'mailbox/get_all_contacts'。我这样做是为了解决我的问题：

function get_all_contacts()
{
    // $contacts is the result array from DB.
    // $term is the text to search, eg: 111

    foreach($contacts as $contact_row) {
        $contact_all[] = array('id' => $contact_row['id'], 'text' => $contact_row['primary_email']);
    }
    if (empty($contact_all)) {
        $contact_all = array('0' => array('id' => 'undefinedMAILID_'. $term, 'text' => $term ) );
    }
    $contact_data['results'] = $contact_all;
    send_json_response($contact_all);
}

在 JS 中获取价值：

sel_ids = $('.to_email').select2('val');
console.log(sel_ids);

// console will show -  ["value if mail id is existing", "undefinedMAILID_111"]

希望这会对某人有所帮助。