【问题标题】:Loading an Edit User form with data from database使用数据库中的数据加载编辑用户表单
【发布时间】:2012-07-19 16:37:14
【问题描述】:

我有一个显示成员列表的网格。网格有一个名为 Edit 的操作列,带有一个图标。如果用户单击“编辑”图标,则窗口将重定向到包含“编辑用户”表单的另一个页面。

现在我的商店和网格的代码如下:

    var userstore = Ext.create('Ext.data.Store', {
      storeId: 'viewUsersStore',
      model: 'Configs',
      autoLoad: true,
      proxy: {
        type: 'ajax',
        url: '/user/getuserviewdata.castle',
        reader: { type: 'json', root: 'users' },
        listeners: {
        exception: function (proxy, response, operation, eOpts) {
            Ext.MessageBox.alert("Error", "Session has timed-out. Please re-login and 
             try again.");
      }
    }
  }
});

var grid = Ext.create('Ext.grid.Panel', {
    id: 'viewUsersGrid',
    title: 'List of all users',
    store: Ext.data.StoreManager.lookup('viewUsersStore'),
    columns: [
        //{header: 'ID', dataIndex: 'id', hidden: true},
        {header: 'Username', dataIndex: 'username'},
        {header: 'Full Name', dataIndex: 'fullName'},
        {header: 'Company', dataIndex: 'companyName'},
        {header: 'Latest Time Login', dataIndex: 'lastLogin'},
        {header: 'Current Status', dataIndex: 'status'},
        {header: 'Edit', 
         menuDisabled: true, 
         sortable: false, 
         xtype: 'actioncolumn', 
         width: 50, 
         items: [{ 
            icon: '../../../Content/ext/img/icons/fam/user_edit.png', 
            handler: function (grid, rowIndex, colIndex){
                var rec = userstore.getAt(rowIndex); 
                alert("Edit " + rec.get('username')+ "?");  
                EditUser(rec.get('id')); 
                } 
             }] 
        }
    ]

});

function EditUser(id) {

    window.location = "/user/index.castle";

}

当用户点击编辑图标时,函数 EditUser(id) 被调用。在该函数中,window.location 将用户重定向到 Edit User 表单(这就是 url 的含义)。

现在我的问题是:如何将成员数据从数据库加载到编辑用户表单中?

换句话说,如果用户点击编辑图标,他/她应该被重定向到编辑用户表单/窗口,然后应该(自动)加载来自的成员数据(即用户名、全名等)数据库(每个成员都有一个唯一的 id)。

我使用的不是 php,而是 Ext JS 和 Castle Monorail (MVC)。我尝试使用 loadRecord(rec) 并且有效,但问题是网格记录不包含编辑用户表单中出现的所有数据字段,因此需要从数据库而不是记录加载数据。

例如,Edit User 表单有一个名为 Permissions 的复选框组,它在网格中被忽略了。

另外,编辑后的会员数据需要保存回数据库。

有人对如何解决这个问题有任何建议吗?

【问题讨论】:

  • 如果您修复了第一个代码块中的缩进会很好。谢谢。 :)
  • 很抱歉。刚刚修好了。
  • Ext.Ajax.Request 获取剩余数据怎么样?
  • 我该怎么做?我知道在删除用户时如何使用 Ajax 请求,但在涉及编辑用户时如何使用?

标签: javascript extjs castle-monorail


【解决方案1】:
  1. 为什么要使用 extjs 制作多页面应用程序?而不是单页应用程序?有什么优势?

  2. 您需要用户的 ID。那是从网格传递过来的。然后使用 Model.load() 将该用户从数据库加载到模型中。您可以使用 form.loadRecord() 将模型加载到表单中,它会根据表单字段的名称自动填充。

要加载模型并将其加载到表单中,您可以这样做:

Model.load(1, {
  callback: function(record){
    form.loadRecord(record); //any matching form names will get loaded into form
  }
});

三个。你应该为表单使用你奇怪的命名“配置”模型。您应该将代理从商店移动到模型。商店将继承其模型代理。

要将代理从存储移动到模型,只需在代码中将其删除,然后将“代理”属性添加到模型。无论是在商店还是模型上,它们都是相同的。

【讨论】:

  • 1.我被要求将用户重定向到编辑用户(不一定因为这样做是有利的)。 2. 我该怎么做?我知道如何使用 var formpanel = Ext.getCmp('EditUserForm'); formpanel.getForm().loadRecord(rec);但在我的情况下,我不知道如何使用 Model.load() 和 form.loadRecord() 。 3. 如何将代理从商店移动到模型?谢谢你的帮助。我对 Ext JS 比较陌生,并且正在工作中学习。
猜你喜欢
  • 2013-08-20
  • 1970-01-01
  • 2013-10-19
  • 2016-04-14
  • 1970-01-01
  • 2019-12-02
  • 1970-01-01
  • 2013-04-08
  • 1970-01-01
相关资源
最近更新 更多