您好，我在再次选择 DOJO 中的下拉菜单时遇到错误
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"
%>
<!DOCTYPE html>
<html>
<head>
<script>
function onReportTypesSelect()
{
if(getDijitValue('data_types') != 'Select')
{
if(getDijitValue('data_types') == 'class_level')
{
require([
"dojo/store/JsonRest",
"dojo/store/Memory",
"dojo/store/Cache",
"dojox/grid/DataGrid",
"dojo/data/ObjectStore",
"dojo/query",
"dojo/domReady!"
], function(JsonRest, Memory, Cache, DataGrid, ObjectStore, query){
var userStore, dataStore, grid;
userStore = new Cache(JsonRest({target: "<%=request.getContextPath()%>" + "/data/classServlet"}), new Memory());
grid = new DataGrid({
id:"class_level_grid",
store: dataStore = new ObjectStore({objectStore: userStore}),
structure: [
{name: 'Roll Number', field: 'roll', width: 'auto', defaultValue: ""},
{name: 'Name', field: 'name', width: '100px', defaultValue: ""},
{name: 'Class', field: 'class', width: '75px', defaultValue: ""}
],
style:"font-family: calibri, Garamond, Comic Sans; font-size: 10;",
selectionMode:'single',
autoHeight: 10,
rowsPerPage:40,
rowSelector:'20px',
selectable: true
}
, "class_level_grid_div"); // make sure you have a target HTML element with this id
grid.startup();
});
}
if(getDijitValue('data_types') == 'class_level2')
{
require([
"dojo/store/JsonRest",
"dojo/store/Memory",
"dojo/store/Cache",
"dojox/grid/DataGrid",
"dojo/data/ObjectStore",
"dojo/query",
"dojo/domReady!"
], function(JsonRest, Memory, Cache, DataGrid, ObjectStore, query){
var userStore, dataStore, grid;
userStore = new Cache(JsonRest({target: "<%=request.getContextPath()%>" + "/data/class2Servlet"}), new Memory());
grid = new DataGrid({
id:"class_level2_grid",
store: dataStore = new ObjectStore({objectStore: userStore}),
structure: [
{name: 'Roll Number', field: 'roll', width: 'auto', defaultValue: ""},
{name: 'Name', field: 'name', width: '100px', defaultValue: ""},
{name: 'Class', field: 'class', width: '75px', defaultValue: ""}
],
style:"font-family: calibri, Garamond, Comic Sans; font-size: 10;",
selectionMode:'single',
autoHeight: 10,
rowsPerPage:40,
rowSelector:'20px',
selectable: true
}
, "class_level2_grid_div"); // make sure you have a target HTML element with this id
grid.startup();
});
}
}
}
</script>
</head>`enter code here`
<body>
<div id="data_types" data-dojo-type="dijit/form/Select" style="width: 200px;" onchange="onReportTypesSelect()">
<span data-dojo-value="Select"><b>Select</b></span>
<span data-dojo-value="class_level"><b>class Level</b></span>
<span data-dojo-value="class_level2"><b>class Level</b></span>
</div>
<div id="class_level_grid_div" style="width: 95%; height: 90%;"> </div>
</div>
<div id="class_level2_grid_div" style="width: 95%; height: 90%;"> </div>
</div>
</body>
</html>
出现错误，错误:尝试使用 id==class_level_grid 注册小部件，但该 id 已注册。 当再次选择下拉列表时，请帮助我。
最佳答案
如果不破坏您创建的第一个网格，就无法将网格填充到另一个网格之上。
因此，如果您将 id=MyGrid 的网格放置在 div 中，则该 div 将被删除，并且网格将替换它。
所以你必须使用两个方法:placeAt和grid.destroyRecursive(true);
下面的代码应该可以正常工作。
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"
%>
<!DOCTYPE html>
<html>
<head>
<script>
function onReportTypesSelect()
{
if(getDijitValue('data_types') != 'Select')
{
if(getDijitValue('data_types') == 'class_level')
{
require([
"dojo/store/JsonRest",
"dojo/store/Memory",
"dojo/store/Cache",
"dojox/grid/DataGrid",
"dojo/data/ObjectStore",
"dojo/query",
"dijit/registry",
"dojo/domReady!"
], function(JsonRest, Memory, Cache, DataGrid, ObjectStore, query,registry){
//we are checking here if the grid with that ID already exists and if yes destroy it
if(typeof registry.byId("class_level_grid_div") != "undefined"){
registry.byId("class_level_grid_div").destroyRecursive();
}
var userStore, dataStore, grid;
userStore = new Cache(JsonRest({target: "<%=request.getContextPath()%>" + "/data/classServlet"}), new Memory());
grid = new DataGrid({
id:"class_level_grid",
store: dataStore = new ObjectStore({objectStore: userStore}),
structure: [
{name: 'Roll Number', field: 'roll', width: 'auto', defaultValue: ""},
{name: 'Name', field: 'name', width: '100px', defaultValue: ""},
{name: 'Class', field: 'class', width: '75px', defaultValue: ""}
],
style:"font-family: calibri, Garamond, Comic Sans; font-size: 10;",
selectionMode:'single',
autoHeight: 10,
rowsPerPage:40,
rowSelector:'20px',
selectable: true
}).placeAt("class_level_grid_div"); // use the placeAt so you don't replace the dom
grid.startup();
});
}
if(getDijitValue('data_types') == 'class_level2')
{
require([
"dojo/store/JsonRest",
"dojo/store/Memory",
"dojo/store/Cache",
"dojox/grid/DataGrid",
"dojo/data/ObjectStore",
"dojo/query",
"dijit/registry",
"dojo/domReady!"
], function(JsonRest, Memory, Cache, DataGrid, ObjectStore, query,registry){
var userStore, dataStore, grid;
if(typeof registry.byId("class_level2_grid_div") != "undefined"){
registry.byId("class_level2_grid_div").destroyRecursive();
}
userStore = new Cache(JsonRest({target: "<%=request.getContextPath()%>" + "/data/class2Servlet"}), new Memory());
grid = new DataGrid({
id:"class_level2_grid",
store: dataStore = new ObjectStore({objectStore: userStore}),
structure: [
{name: 'Roll Number', field: 'roll', width: 'auto', defaultValue: ""},
{name: 'Name', field: 'name', width: '100px', defaultValue: ""},
{name: 'Class', field: 'class', width: '75px', defaultValue: ""}
],
style:"font-family: calibri, Garamond, Comic Sans; font-size: 10;",
selectionMode:'single',
autoHeight: 10,
rowsPerPage:40,
rowSelector:'20px',
selectable: true
}).placeAt("class_level2_grid_div"); // make sure you have a target HTML element with this id
grid.startup();
});
}
}
}
</script>
</head>`enter code here`
<body>
<div id="data_types" data-dojo-type="dijit/form/Select" style="width: 200px;" onchange="onReportTypesSelect()">
<span data-dojo-value="Select"><b>Select</b></span>
<span data-dojo-value="class_level"><b>class Level</b></span>
<span data-dojo-value="class_level2"><b>class Level</b></span>
</div>
<div id="class_level_grid_div" style="width: 95%; height: 90%;"> </div>
</div>
<div id="class_level2_grid_div" style="width: 95%; height: 90%;"> </div>
</div>
</body>
</html>
关于javascript - 错误: Tried to register widget with id==class_level_grid but that id is already registered in DOJO，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27821020/