更新标记表后刷新tag-it中的数据

时间:2015-04-24 11:13:02

标签: jquery html asp.net-mvc

我目前在我的mvc页面上使用两个脚本,一个使用Tag-It,另一个允许我通过对话框添加新标签。但是,下面的脚本在创建新标记时不会加载新数据,我想知道如何让它加载新标记。当对话框关闭后,当用户创建标记时,它应该在Tag-It to tag中可用。情况并非如此,我必须重新加载页面才能在Tag-It中看到新标记。

用于创建新标记的对话框:

<script type="text/javascript">
    var dialog = $('#dialog');
    var tags = $('#singleFieldTags');
    var url = '@Url.Action("CreateTag")';
    $('#addtag').click(function () {
        dialog.show();
    });
    $('#createtag').click(function () {
        var form = $(this).closest('form');
        $.post(url, form.serialize(), function (data) {
            if (data) {
                //method for reloading tag it data....
                form.get(0).reset(); 
                dialog.hide(); 
            }
        });
    })
</script>

Tag-It脚本:

<script type="text/javascript">
    $(function () {
        var sampleTags = JSON.parse('@Html.Raw(ViewBag.AllTags)');
        $('#singleFieldTags').tagit({
            availableTags: sampleTags,
        });
    })
</script>

2 个答案:

答案 0 :(得分:2)

成功保存新Tag后,您可以使用$(element).tagit("createTag", "tagName"); Refer documentation

将其名称属性添加到现有代码列表中
 $('#createtag').click(function () {
    var form = $(this).closest('form');
    $.post(url, form.serialize(), function (data) {
      if (data) {
        //method for reloading tag it data....
        form.get(0).reset(); 
        dialog.hide(); 
        // Add the new tag
        var tagName = ? // based on a previous related question, this would be data.Name
        $('#singleFieldTags').tagit("createTag", tagName);
      }
  });
})

答案 1 :(得分:1)

应该像

一样简单
$('#singleFieldTags').tagit('add', data);

这假设data仅包含新标签。否则,请务必从data检索标记。