My Grid By click on link is not showing
I have this index.html Please read the complete question before answering .
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Reseller DashBoard</title>
<!-- ** CSS ** -->
<!-- base library -->
<link rel="stylesheet" type="text/css" href="css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="css/xtheme-gray.css" />
<!-- overrides to base library -->
<!-- ** Javascript ** -->
<!-- ExtJS library: base/adapter -->
<script type="text/javascript" src="lib/ext-base-debug.js"></script>
<!-- ExtJS library: all widgets -->
<script type="text/javascript" src="lib/ext-all-debug.js"></script>
<!-- overrides to base library -->
<!-- page specific -->
<script type="text/javascript" src="lib/dashboard.js"></script>
<script type="text/javascript" src="lib/jsfunction.js"></script>
<script type="text/javascript" src="lib/reseller.js"></script>
</head>
<body>
<div id="dashboard">
</div>
</body>
</html>
This is my dashboard.js In this i have a rendere function on which generate the hyper link on the click of this hyperlink i want to open the another grid which is in the reseller.js. and the onlclick function is in jsfunction.js.
/**
* this file has the reseller dashboard grid
*
*/
Ext.onReady(function(){
/**
* function for rendering the link
**/
function linkRenderer(data, cell, record, rowIndex, columnIndex, store) {
if (data != null) {
return '<a href="javascript:void(0)" onclick="resellerwindow(\'' +record.data.cityname+'\')">'+ data +'</a>';
}
return data;
}
// create the data store
var store = new Ext.data.JsonStore({
// store configs
autoDestroy: true,
autoLoad :true,
url: 'api/index.php?_command=getresellerscount',
storeId: 'getresellerscount',
// reader configs
root: 'cityarray',
idProperty: 'cityname',
fields: [
{name: 'cityname'},
{name: 'totfollowup'},
{name: 'totcallback'},
{name: 'totnotintrested'},
{name: 'totdealsclosed'},
{name: 'totcallsreceived'},
{name: 'totcallsentered'},
{name: 'totresellerregistered'},
{name: 'countiro'},
{name: 'irotransferred'},
{name: 'irodeferred'}
]
});
// create the Grid
var grid = new Ext.grid.GridPanel({
store: store,
columns: [
{
id :'cityname',
header : 'City Name',
width : 120,
sortable : true,
dataIndex: 'cityname'
},
{
id :'countiro',
header : ' Total Prospect',
width : 100,
sortable : true,
dataIndex: 'countiro'
},
{
id :'irotransferred',
header : 'Calls Transfered By IRO',
height : 50,
width : 100,
sortable : true,
dataIndex: 'irotransferred'
},
{
id :'irodeferred',
header : ' Calls Deferred By IRO',
width : 100,
sortable : true,
dataIndex: 'irodeferred'
},
{
id :'totcallsentered',
header : ' Total Calls Entered',
width : 100,
sortable : true,
dataIndex : 'totcallsentered',
renderer : linkRenderer
},
{
id :'totfollowup',
header : ' Follow Up',
width : 100,
sortable : true,
dataIndex: 'totfollowup'
},
{
id :'totcallback',
header : ' Call Backs',
width : 100,
sortable : true,
dataIndex: 'totcallback'
},
{
id :'totnotintrested',
header : ' Not Interested',
width : 100,
sortable : true,
dataIndex: 'totnotintrested'
},
{
id :'totdealsclosed',
header : ' Deals Closed',
width : 100,
sortable : true,
dataIndex: 'totdealsclosed'
},
{
id :'totresellerregistered',
header : ' Reseller Registered',
width : 100,
sortable : true,
dataIndex: 'totresellerregistered'
}
],
height: 350,
width: 1060,
title: 'Reseller Dashboard',
// config options for stateful behavior
});
// render the grid to the specified div in the page
grid.render('dashboard');
});
Here is my jsfunction.js , is it the right place to place the code of the link click handler or should i place it any where else .
/**
* function for opening the window of reseller grid
*
**/
function resellerwindow(cityname) {
alert(cityname);
// render the grid to the specified div in the page
resellergrid.render('dashboard');
}
Here is my reseller.js which has the another grid coding , Please suggest the coding in this file is right or should i change something .
/**
* this file has the reseller grid
*
*/
Ext.onReady(function(){
// create the data store
var store = new Ext.data.JsonStore({
// store configs
autoDestroy: true,
autoLoad :true,
url: 'api/index.php?_command=getresellers',
storeId: 'getresellerscount',
// reader configs
root: 'reseller',
idProperty: 'firstname',
fields: [
{name: 'firstname'},
{name: 'lastname'},
{name: 'mobile'},
{name: 'email'},
{name: 'tmecode'},
{name: 'tmename'},
{name: 'updatedon'},
{name: 'apptype'},
{name: 'alloctype'},
{name: 'empparent'},
{name: 'irodeferred'}
]
});
// create the Grid
var resellergrid = new Ext.grid.GridPanel({
store: store,
columns: [
{
id :'firstname',
header : 'First Name',
width : 120,
开发者_如何学运维 sortable : true,
dataIndex: 'firstname'
},
{
id :'lastname',
header : ' Last Name',
width : 100,
sortable : true,
dataIndex: 'lastname'
},
{
id :'mobile',
header : 'Mobile',
height : 50,
width : 100,
sortable : true,
dataIndex: 'mobile'
},
{
id :'email',
header : 'E-Mail',
width : 100,
sortable : true,
dataIndex: 'email'
},
{
id :'tmecode',
header : ' TME Code',
width : 100,
sortable : true,
dataIndex : 'tmecode'
},
{
id :'updatedon',
header : ' updatedon',
width : 100,
sortable : true,
dataIndex: 'updatedon'
},
{
id :'empparent',
header : ' empparent',
width : 100,
sortable : true,
dataIndex: 'empparent'
}
],
height: 350,
width: 1060,
title: 'Reseller Dashboard',
// config options for stateful behavior
});
});
My Main problem is the why the reseller grid is not showing i am getting this error while click on the link in dashboard grid
resellergrid is not defined
[Break on this error] resellergrid.render('dashboard');
You have two onReady methods. Your application need only one onReady method.
The error is because resellergrid is not define within the scope of the resellerwindow(). You have declared the resellergrid in reseller.js. But is not accessible for the resellerwindow.
加载中,请稍侯......
精彩评论