jquery - 添加/删除/更改输入文本的部分值

时间:2012-08-30 20:33:43

标签: javascript jquery

我正在使用此插件:http://loopj.com/jquery-tokeninput/来做一个建议字段,用户可以在其中开始输入,选择他们想要的项目,并且他们可以添加多个建议。

这个插件有一个onAdd和一个onDelete回调。

我想要做的是,onAdd,我想将元素id存储在隐藏输入的值中。他们可以添加多个项目,因此输入值最终如:123,145,875,968

这没关系。现在我需要帮助的地方是OnDelete事件。我需要更新输入值以反映他们删除项目的事实。

这是代码

onAdd: function (item) {
   var value = $("#itemID").val();
   $("#itemID").val(value + item.id + ',');
},
onDelete: function (item) {
   ???? In word: Remove that specific ID from the input value, but keep the other value
}

PS。我将这些ID存储在输入中,以便以后轻松获取ajax调用值的列表。 现在,我不确定这是否是最好的方式,但是,是的,这就是我作为“新”程序员的想法:)

提前致谢

3 个答案:

答案 0 :(得分:1)

我不相信您需要在添加或删除项目时存储建议字段的总值。每当您准备好进行ajax调用时,请使用以下方法获取建议字段的当前值:

selector.tokenInput("get");

这是在“方法”部分中引用的jQuery Tokeninput页面上记录的。这将获得值的JSON表示,如下所示:

[{id: 0, name: "something"},{id: 1, name: "something else"}]

然后你可以循环遍历它,抓住id(如果这就是你想要的),并将它们连接成一个字符串并通过AJAX提交它们。

必要时序列化。如果您要对数据进行额外的工作,请将其保留为最容易完成工作的格式,直到您需要对其进行序列化。

答案 1 :(得分:1)

更新

查看插件文档:

selector.tokenInput("get"); 从tokeninput获取所选标记的数组(每个项目都是{id: x, name: y}类型的对象。

尝试这样的事情:

// do this at time of submit()
var tokens = $('#your-plugin-element-id').tokenInput( 'get' );
var output = [];
$.each( tokens, function( i, el ) {
  output.push( el.id );
});
var outputString = output.join( ',' );

然后您不必在单独的隐藏输入中跟踪。

更清晰,但使用map()

可能更难理解
var tokens = $('#your-plugin-element-id').tokenInput( 'get' );
var outputString = $.map( tokens, function( el ) { return el.id; } ).join( ',' );

-

这应该有效:

var itemList = $('#itemID').val().split(',');
for( var i=0 ; i<itemList.length ; i++ ) {
  if( itemList[i] == item.id ) {
    itemList.splice( i, 1 );
    break;
  }
}
$('#itemID').val( itemList.join( ',' ) );

编辑:这是对现有代码的快速修复,但在提交时序列化会更好,如其他评论所述

答案 2 :(得分:1)

检查此代码

                onDelete: function (item) {
                var idd  = item.id;
                alert (idd);
                var value = $("#itemID").val();  
                var x = value.replace( idd+ ',', "" );
                $("#itemID").val(x);
                }

itemID是隐藏的输入