在标记对象中添加来自 .get 的标记词

问题描述

我通过标签将关键字的概念引入我的页面。该页面用作“添加”和“编辑”页面。当它是“修改”时,我将通过 $ .get 查找我的信息。我的问题是它在页面加载时可以正常工作 2 次。

这是它工作的时候:

enter image description here

这是没有的时候。这是我的代码

enter image description here

这就是我构建对象标记的方式:

我对标签对象不是很了解,所以可能这不是插入标签的方式。

   $(document).ready(function () {
            $(".tag").tagging({
                'no-spacebar': true,// default - false
                'forbidden-chars': [".","_","?","#","×","  "],// double space added
                "forbidden-chars-callback": function () {
                    sweetAlertInput("Vous ne pouvez utiliser ce caractère ","etabMotsClef");
                },'no-duplicate-callback': function () {
                    sweetAlertInput("Vous avez déjà utilisé ce mot clé ",'no-duplicate': true,'no-enter': false,'tags-limit': 5,'no-del': true,'no-quote': true,'edit-on-delete': false,'no-comma': true,'type-zone-class': true,'no-focus': true,"tag-on-blur": 0
            });

        });

获取

   $.get("@Html.Raw(Url.Action("TelechargerInfoOrganisme","Etablissements"))",function (data) {
        //$("#dropdownCFsection").html('<div class="row"><div class= "col-md-6"><div class="form-group"><label for="projectinput5"><strong>@Resource.Organisme</strong></label><select id="organisme" name="organisme" class="custom-select"></select></div></div>');
        $.each(data,function (index,row) {
        
            if (row?.etab_motcle) {
                var motsstring = row?.etab_motcle;
                //console.log(motsstring);
                var motsArray = motsstring.split(',');
                //console.log(motsArray);
                $.each(motsArray,value) {
                    $('#etabMotsClef').append(value + ',');
                });
            }
        });
     });

还有 html:

 <div class="col-md-12">
     <div class="form-group">
         <label><strong>Liste des mots clés:</strong>&nbsp;&nbsp;&nbsp;<button class="btn btn-info add-special-keys" style="padding-top:3px;padding-bottom:3px;padding-right:6px;padding-left:6px;" type="button"><i class="feather icon-plus"></i></button></label>
         <div class="row">
             <div class="col-6">
                 <div class="tag form-control" style="height:120px;outline: none;" data-tags-input-name="tag" maxlength="250" id="etabMotsClef" name="etabMotsClef"></div>
             </div>
         </div>
      </div>
  </div>

我用这个github来指导我: https://github.com/sniperwolf/taggingJS#available-options

解决方法

我在对象标记中找到了一种新方法,而不是在我的 div t 中进行附加操作,我不再遇到问题:

var motsArray = [];

     $(document).ready(function () {

            $.get("@Html.Raw(Url.Action("TelechargerInfoOrganisme","Etablissements"))",function (data) {
                //$("#dropdownCFsection").html('<div class="row"><div class= "col-md-6"><div class="form-group"><label for="projectinput5"><strong>@Resource.Organisme</strong></label><select id="organisme" name="organisme" class="custom-select"></select></div></div>');
                $.each(data,function (index,row) {
                   
                    if (row?.etab_motcle) {
                        var motsString = row?.etab_motcle;
                        //console.log(motsString);
                        motsArray = motsString.split(',');
                        console.log(motsArray);
//////HERE THAT I ADD MY KEYWORDS IN MY TAGS
                        $('.tag').tagging("add",motsArray);
                    }

                });
            });

            $(".tag").tagging({
                'no-spacebar': true,// default - false
                'forbidden-chars': [".","_","?","#","×","  "],// double space added
                "forbidden-chars-callback": function () {
                    sweetAlertInput("Vous ne pouvez utiliser ce caractère ","etabMotsClef");
                },'no-duplicate-callback': function () {
                    sweetAlertInput("Vous avez déjà utilisé ce mot clé ",'no-duplicate': true,'no-enter': false,'tags-limit': 5,'no-del': true,'no-quote': true,'edit-on-delete': false,'no-comma': true,'type-zone-class': true,'no-focus': true,"tag-on-blur": 0
            });

        });