将模型发送到 Jquery答案

【问题标题】：Send model to Jquery将模型发送到 Jquery
【发布时间】：2013-07-05 09:30:45
【问题描述】：

我想使用 Fuelux jquery 插件在我的 mvc 视图中创建树。要使用这个插件，我必须使用下一个代码将数据发送到插件：

$('#MyTree').tree({ dataSource: dataSource })

我不知道如何将视图中的模型对象作为参数发送给插件。数据必须有什么结构？

【问题讨论】：

【解决方案1】：

您需要将模型转换为 Json 并将转换后的对象用作数据源：

<script>
$(dcoument).ready(function(){

var datasource = @ViewBag.JsonModel;
$('#MyTree').tree({ dataSource: dataSource });

});
</script>

现在您需要在操作中填充 ViewBag.JsonModel：

public ViewResult YourActionName()
{
 // your logic on getting model
ViewBag.JsonModel = //convert model to json using jsonserializer
}

这是树插件示例：

 // INITIALIZING TREE
var treeDataSource = new TreeDataSource({
data: [
{ name: 'Test Folder 1', type: 'folder', additionalParameters: { id: 'F1' } },
{ name: 'Test Folder 2', type: 'folder', additionalParameters: { id: 'F2' } },
{ name: 'Test Item 1', type: 'item', additionalParameters: { id: 'I1' } },
{ name: 'Test Item 2', type: 'item', additionalParameters: { id: 'I2' } }
],
delay: 400
});
$('#MyTree').tree({dataSource: treeDataSource});

【讨论】：

我的模型必须具备哪些属性？插件文档中没有关于它的任何信息。
看我在回复中添加了树示例
我刚刚尝试了您的解决方案。我收到错误“无法获取未定义或空引用的属性 'fn'”。也许json数据需要一些额外的属性？
这里是示例页面链接exacttarget.github.io/fuelux/#tree。它包含 Tree.js 的 worling 示例，看看源代码（我更喜欢 firebug）