2010-03-26 230 views
3

我正在使用jquery的标记化自动完成插件(http://loopj.com/2009/04/25/jquery-plugin-tokenizing-autocomplete-text-entry)。虽然我主要使用Ruby,但我对JavaScript并不熟悉。jquery:预填充自动填充字段

我的基本设置是这样的,对于一个新的空白表单工作正常:

$(document).ready(function() { 
    $("#tag_ids_field").tokenInput("/tags", { 
    queryParam: "search" 
    }); 
}); 

问题是当我尝试预填充它,像编辑页面。我试图做这样的事情(当页面加载时,“#tag_ids_field”文本框包含JSON) - 这种方式在应用程序方面只是更清晰)。

$(document).ready(function() { 
    var tags = $("#tag_ids_field").html(); 
    $("#tag_ids_field").tokenInput("/tags", { 
    queryParam: "search", 
    prePopulate: tags 
    }); 
}); 

但是,当页面加载时,我看到它只是填充了数百个条目,读取'undefined'。我得到这个就算我拿JSON输出Rails提供并尝试坚持正确的.js文件:

$(document).ready(function() { 
    $("#tag_ids_field").tokenInput("/tags", { 
    queryParam: "search", 
    prePopulate: "[{\"id\":\"44\",\"name\":\"omnis sit impedit et numquam voluptas enim\"},{\"id\":\"515\",\"name\":\"deserunt odit id doloremque reiciendis aliquid qui vel\"},{\"id\":\"943\",\"name\":\"exercitationem numquam possimus quasi iste nisi illum\"}]" 
    }); 
}); 

这显然不是一个解决方案,我只是想这是出于无奈,我也得到相同的行为。

我的两个问题:

一,为什么我的文本框充满“不确定”的标签,当我尝试预填充,我怎么可以让他们成功地预填充?

二,我打算在同一页面上有这样的许多自动填充字段(当几个记录一次编辑 - 他们都查询相同的地方)。我怎样才能让每个自动填充字段从它自己的文本框中预先填充它的值?喜欢的东西(应用这些设置应用于所有输入框具有一定的阶级,而不是某一特定ID的一个):

$(document).ready(function() { 
    $(".tag_ids_field").tokenInput("/tags", { 
    queryParam: "search", 
    prePopulate: (the contents of that particular ".tag_ids_field" input box) 
    }); 
}); 

Flash84x:我不知道你在说什么。 tag_ids_field不是数据库字段 - 它是我在模型上定义的虚拟属性。 setter(接受逗号分隔的id列表)定义记录与数据库中这些标记的关系。吸气剂(其填充在文本区域在页面加载时)可以返回它无论我想 - 现在我有它设置为只返回JSON当前标签数据,因为一切都是整齐的方式。

我可以更详细地解释它,如果你愿意,但事物的红宝石方面效果很好,我很舒服。我根本不了解JavaScript,所以在获取客户端数据后,我需要帮助操纵数据。

+0

没人能回答这个问题?我认为这对于知道JavaScript的人来说很容易。 – 2010-03-26 15:31:24

回答

1

我认为它会更有意义为控制器提供的数据到编辑视图,通过设置在输入单元的值属性填充经由红宝石的字段。即使您在编辑表单中使用AJAX,您也可以让控制器将数据传递给视图。除非你正在做的事情,其中​​的数据没有被保存到数据库中...

也许有必要对为什么你正在尝试做的是这样一些更深入的了解。

+0

更新了问题以进一步解释。 – 2010-03-26 06:10:53

+0

@克里斯可能的洞见:对于tokenInput工作,它需要一个名字以显示用户和ID发送回来的形式。所以控制器需要给它一个像'[{“id”:123,“name”:“例外”},{“id”:147,“name”:“令人惊叹的”}]''的json对象,但是该表单需要给予类似“123,147”的内容。通过这种方式,用户可以使用名称和inputToken来完成所有花哨的UI东西,并将其透明地转换为ID的CSV。 – Shawn 2011-11-17 23:26:15

3

没关系,我的工作了:

$(document).ready(function() { 
    $(".tag_ids_field").each(function(index) { 
    var ids = eval($(this).html()); 
    $(this).html(''); 

    $(this).tokenInput("/tags", { 
     queryParam: "search", 
     prePopulate: ids 
    }) 
    }); 
}); 
+0

这是否也解决了你得到的'undefined'? – Shawn 2011-11-17 23:27:20