Dojox grid having problem with Contentpane
- by ice
the grid appears properly on template's first loading. But when you click the paging button to load flooders.php thru list_result1() only the paging buttons will appear. I already tested the flooders.php outside the template and it works properly.
what seems to be the problem? and what are the tools that i can use to see if the javascript is loading properly because i think the error console of ff browser which i use to track errors won't give you that much info when you are working with contentpane.
thanks!
ice
note: below are the codes...
** from contentpane js
function list_result1(){
args="";
uri = "flooders.php" + args;
dojo.xhrGet( {
url: uri,
handleAs: "text",
timeout: 500, // Time in milliseconds
load: function(response, ioArgs) { //alert(response);
dojo.byId("flooders_table").innerHTML = response;
return response;
},
// The ERROR function will be called in an error case.
error: function(response, ioArgs) {
console.error("HTTP status code: ", ioArgs.xhr.status);
return response;
}
}); //end of dojo.xhrGet
}
**flooders.php starts here***
@import "js/dojo-0.9.0/dojo/resources/dojo.css";
@import "js/dojo-0.9.0/dijit/themes/tundra/tundra.css";
@import "js/dojo-0.9.0/dijit/themes/tundra/tundra_rtl.css";
@import "css/ash.css";
@import "js/dojo-0.9.0/dojox/grid/resources/Grid.css";
@import "js/dojo-0.9.0/dojox/grid/resources/tundraGrid.css";
@import "js/dojo-0.9.0/dojo/resources/dojo.css";
@import "js/dojo-0.9.0/dijit/tests/css/dijitTests.css";
.dojoxGridRowEditing td {
background-color: #F4FFF4;
}
.dojoxGrid input, .dojoxGrid select, .dojoxGrid textarea {
margin: 0;
padding: 0;
border-style: none;
width: 100%;
font-size: 100%;
font-family: inherit;
}
.dojoxGrid input { }
.dojoxGrid select { }
.dojoxGrid textarea { }
#controls {
padding: 0px 0;
}
#controls button {
margin-left: 10px;
}
.myGrid {
width: 550px;
height: 230px;
margin-left: 20px;
/* border: 1px solid silver; */
}
echo " // it has script heading here
(function(){
// some sample data
// global var 'data'
data = {
identifier: 'id',
label: 'id',
items: []
};
data_list = [
$banlist
];
var rows = $listnum ;
var x=1;
for(var i=0, l=data_list.length; i
// global var 'test_store'
test_store = new dojo.data.ItemFileWriteStore({data: data});
})();
// it has ending here
"; ?
--
here's the javascript
dojo.require("dijit.TitlePane");
dojo.require("dijit.dijit");
dojo.require("dojox.grid.DataGrid");
dojo.require("dojo.data.ItemFileWriteStore");
dojo.require("dojo.parser"); // scan page for widgets and instantiate them
dojo.require("dijit.layout.LayoutContainer");
dojo.require("dijit.layout.AccordionContainer");
dojo.require("dijit.layout.ContentPane");
dojo.require("dijit.layout.TabContainer");
dojo.require("dijit.Editor");
dojo.require("dijit._editor.plugins.AlwaysShowToolbar");
dojo.require("dijit._editor.plugins.LinkDialog");
//this must be inlcuded below function()
selectCell = {
styles: 'text-align: center;',
type: dojox.grid.cells.Select
};
gridLayout = {
defaultCell: { width: 5, styles: 'text-align: right;' },
rows: [
[
{ name: 'Mark', width: 3, field: 'col1', editable: true, styles: 'text-align: center;', type: dojox.grid.cells.Bool },
{ name: 'Id', width: 3, field: 'id' , editable: false },
{ name: 'Username', field: 'col2', editable: false, styles: '', width: '70%' },
{ name: 'Reason', field: 'col3', editable: false , styles: '', width: '100%' },
{ name: 'Date Banned', field: 'col4', editable: false , styles: '', width: '70%' }
]
]
};
