如何使用骨干Js从列表视图编辑记录

时间:2014-06-23 23:01:35

标签: javascript html backbone.js

这是对我之前发布的内容的编辑。我厌倦了这篇文章中建议的一些事情。我认为即将获得它,但需要更多调整。

我希望从我的列表中编辑一条记录:这就是我的视图设计方式:

var EditSubAccount = Backbone.View.extend({
     render: function(id,options){  
            var self= this; 

                var subaccount = new SubAccountModel([],{id: this.options});
                subaccount.fetch({

                    success: function(subaccount){
                        var d = subaccount.toJSON();
                        var user = d.data.items;
                       //user gives the Json o/p as shown below
                        var template = $("#sub-account-list").html(_.template(edittmpl, {user:user}));


                })
            }

这里user给出Json对象如下:

[
 {
    accountType: "Customer"
    active: true
    name: account 1
    id: 87384738
    billingContactInfo: 
    {
       address1: "1234 asdf"
       address2: ""
       city: "mountain view"
     }
   }
 ]

和我的HTML:

<form class="edit-form" method="PUT" >
        <table>
            <tbody>

        <tr>
       <td> <input type = "text"class="name" value= "<%= user ? user.name : '' %>" /></td>
     <!-- get undefined when on `user.name` -->
    </tr>

    </tbody>
    </table>
    <% if (subaccount){ %>

    <input type="hidden" value = "<%= user.id %>" />

    <% } %>

        <button class="save" method="PUT">Save</button>
        <button class="cancel">Cancel</button>
    </form>

和我的路由器,我在初始化Editaccount:

var AppRouter = Backbone.Router.extend({
  routes: {
      'edit/:id' : 'editSubAccount',
}
  editSubAccount: function(id){
   var editsubaccount = new EditSubAccount(id); 
        editsubaccount.render({id:id});
  }

  });

当我尝试点击编辑链接时,它会显示我需要编辑的正确“ID”,但表单显示为空白而不是填充字段。下面是我的列表的样子: enter image description here

我不确定我在这里缺少什么。请有人提出任何意见吗?

1 个答案:

答案 0 :(得分:1)

尝试做subacount.toJSON()&#39;当您使用模板绑定模型时,可能会出现问题。

但要注意你的渲染功能,它做了很多事情,因为你的代码在成长,无法维护。

我有一篇关于它的帖子,请看这里帮助解决这个问题http://www.rcarvalhojs.com/dicas/de/backbone/2014/06/04/5dicas-backbone.html

不幸的是,它只能用葡萄牙语提供。尝试使用谷歌翻译

希望它有所帮助。