如何使用 asp.net mvc 中的标记在 Select2 输入中设置默认值

Posted 2023-05-07

【中文标题】如何使用 asp.net mvc 中的标记在 Select2 输入中设置默认值

【英文标题】：How to set default values in Select2 input with tagging in asp.net mvc

【发布时间】：2013-11-03 03:11:45

【问题描述】：

在我看来，这个 Select2 输入框充当标签控制器：

CSHTML

<input id="tagSelector" type="hidden" style="width: 300px"/>

JS

  $('#tagSelector').select2(
            placeholder: 'Select a tag...',
            multiple: true,
            ajax: 
                url: '@Url.Action("SearchTags", "UnitDetails")',
                dataType: 'json',
                data: function(term, page) 
                    return 
                        searchTerm: term
                    ;
                ,
                results: function(data, page) 
                    return  results: data ;
                
            ,
            createSearchChoice: function(term) 
                return  id: term, text: term ;
            
        ).on("removed", function(e) 
            var url = '@Url.Content("~/UnitDetails/UnTagUnit/" + Model.ViewUnitContract.Id)';
            var id = e.val;
            var tagName = e.choice.text;
            console.log(id + " : " + tagName);

            $.ajax(
                url: url,
                data:  selectedItem: tagName ,
                type: 'GET',
                dataType: 'json',
                success: function() 
                ,
                error: function() 
                
            );
        )
            .on("select2-selecting", function(e) 
                var url = '@Url.Content("~/UnitDetails/TagUnit/" + Model.ViewUnitContract.Id)';
                var id = e.val;
                var tagName = e.object.text;
                console.log(id + " : " + tagName);

                $.ajax(
                    url: url,
                    data:  selectedItem: tagName ,
                    type: 'GET',
                    dataType: 'json',
                    success: function() 
                    ,
                    error: function() 
                    
                );
            );
    );

C#

public JsonResult GetInitialTags(int id)

    Model = new UnitDetailsModel(UnitClient.GetUnit(id));
    foreach (var tag in Model.ViewUnitContract.Tags)
    
        Model.TagsSelected.Add(tag);
    

    var result = Model.TagsSelected.Select(a => new
        
            id = a.Id,
            text = a.Name
        );

    return Json(result, JsonRequestBehavior.AllowGet);

现在，我似乎无法弄清楚如何使用initSelection 来使用已选择的标签填充输入框。我希望有人能帮我解决这个问题，因为我开始感到有点失落:)

【参考方案1】：

通过将initSelection 属性添加到我的javascript 中找到了解决方案：

...
            initSelection: function (element, callback) 
                $.get('@Url.Action("GetInitialTags", "UnitDetails", new  id = Model.ViewUnitContract.Id )', function (initTags) 
                    var tags = [];

                    for (var i = 0; i < initTags.length; i++) 
                        tags.push( "id": initTags[i].id, "text": initTags[i].text );
                    

                    callback(tags);
                );
            ,
...