如何从自定义对话框编辑数据网格中的选定行

这是我的代码，我有问题。

require([
"dijit/layout/BorderContainer",
"dijit/layout/ContentPane",
"dojo/data/ItemFileWriteStore",
"dojox/grid/DataGrid"
], function(BorderContainer, ContentPane, ItemFileWriteStore, DataGrid) {
  var data_list = [{
    id: '01',
    Name: 'Niko',
    Phone: '010101',
    Birthday: '01.01.91'
  }, {
    id: '02',
    Name: 'Sasha',
    Phone: '020202',
    Birthday: '01.01.92'
  }, {
    id: '03',
    Name: 'Pavel',
    Phone: '030303',
    Birthday: '01.01.93'
  }, {
    id: '04',
    Name: 'Alex',
    Phone: '040404',
    Birthday: '01.01.94'
  }];
  var store = new ItemFileWriteStore({
    data: {
      idetifier: 'id',
      items: data_list
    }
  });
  var layout = [{
    name: 'Name',
    field: 'Name',
    'width': '90%'
  }];
  var grid = new DataGrid({
    id: 'grid',
    store: store,
    structure: layout,
    onClick: function(item) {
      var itemData = this.getItem(item.rowIndex);
      dojo.byId("itemInfo").innerHTML = "<table><tr><td>Name:</td><td>" + itemData.Name + "</td></tr><tr><td>Phone:</td><td>" + itemData.Phone + "</td></tr><tr><td>Birthday:</td><td>" + itemData.Birthday + "</td></tr></table>";
    }
  }, dojo.byId("myDataGrid"));
  grid.startup();
});

html,
body {
  width: 100%;
  height: 100%;
  overflow: hidden;
  margin: 0;
  padding: 0;
}
#DashboardContainer {
  width: 100%;
  height: 100%;
}
#Content, #Info, #itemInfo {
  height: 100%;
  width: 50%; 
}

<!DOCTYPE html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
  
    <script src='//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojo/dojo.js'></script>
  
  
    <link rel="stylesheet" type="text/css" href="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojo/resources/dojo.css">
    <link rel="stylesheet" type="text/css" href="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dijit/themes/claro/claro.css">
    <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/dojo/1.6/dojox/grid/resources/Grid.css">
	<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/dojo/1.6/dojox/grid/resources/claroGrid.css">   
    <script >
        var djConfig = {    	  
            parseOnLoad: true
        }   
    </script>    
      
    </head>
<body class="claro" style="font-family: Verdana; font-size: 11px;">
  <div dojoType="dijit.layout.BorderContainer" id="DashboardContainer" design="headline" splitters="false">
    
    <div dojoType="dijit.layout.ContentPane" id="Content" region="center">
      <div dojoType="dojox.grid.DataGrid" id="myDataGrid"></div>
    </div>
    <div dojoType="dijit.layout.ContentPane" id="Info" region="right">
      <div id="itemInfo">
        <p>Hello</p>
      </div>
    </div>
  </div>
</body>

我有一个简单的DataGrid。但我不知道如何在弹出对话框中编辑它。请帮帮我。摘录中的网格示例。我不知道如何将数据从网格传递到对话框。编辑并保存。

阅读此处的编辑单元格https://dojotoolkit.org/reference-guide/1.10/dojox/grid/DataGrid.html#editing-单元格
在这里https://dojotoolkit.org/documentation/tutorials/1.10/working_grid/

相关内容

最新更新

热门标签：