PDA

View Full Version : Cannot load data from aspx page to store



hieu79vn
4 Apr 2012, 5:54 AM
Hello


I would like to get data from an aspx page to a store. But I dont know why it doesnot display the content of grid. The json string is correct
I tried to generate it and copy as hard code, the grid is loaded. but if I use url 'TreeLoader.aspx', it doesnt display
Do you know why?
Thank you


var storeGrid = new Ext.data.JsonStore({
// store configs
autoDestroy: true,
url: 'TreeLoader.aspx',
storeId: 'projects',
root: 'projects',
idProperty: 'EmployeeID',
fields: ['EmployeeID', 'EmployeeName', 'IsSuperVisor']
});


Ext.create('Ext.grid.Panel', {
title: 'Test',
store: storeGrid,
columns: [
{ header: 'EmployeeID', dataIndex: 'EmployeeID' },
{ header: 'EmployeeName', dataIndex: 'EmployeeName', flex: 1 },
{ header: 'IsSuperVisor', dataIndex: 'IsSuperVisor' }
],
height: 200,
width: 400,
renderTo: 'divEmployees'
});


TreeLoader.aspx


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TreeLoader.aspx.cs" Inherits="TreeLoader" %>
<asp:Literal ID="Literal1" runat="server"></asp:Literal>


TreeLoader.aspx.cs




protected void Page_Load(object sender, EventArgs e)
{


this.Literal1.Text = GetNodes(1);
}


private string GetNodes(int SupervisorID)
{
System.Text.StringBuilder returnValue = new System.Text.StringBuilder();




String Query =
"SELECT emp.EmployeeID, " +
" emp.FirstName + ' ' + emp.LastName AS EmployeeName, " +
" CAST(CASE WHEN a.Subordinates > 0 THEN 1 ELSE 0 END AS BIT) IsSupervisor " +
"FROM Employee emp WITH(NOLOCK) LEFT JOIN " +
" (SELECT sup.SupervisorID, COUNT(*) Subordinates " +
" FROM Employee sup WITH(NOLOCK) " +
" GROUP BY sup.SupervisorID ) a ON a.SupervisorID = emp.EmployeeID " +
"WHERE IsNull(emp.SupervisorID, 0) =0 ORDER BY IsSupervisor DESC, EmployeeName ASC ";
DataSet myDataSet = new DataSet();
string connectionString = ConfigurationManager.ConnectionStrings["EmployeesDatabase"].ConnectionString;
using (SqlConnection connection = new SqlConnection(connectionString))
{
SqlDataAdapter mySqlDataAdapter = new SqlDataAdapter(Query, connection);
mySqlDataAdapter.Fill(myDataSet);
}


DataTable employees = myDataSet.Tables[0];



string json = "{\"projects\":" + JsonConvert.SerializeObject(employees, Formatting.Indented)+"}";

return json;
}

scottmartin
4 Apr 2012, 7:56 AM
If you change the URL to load a file containing:




{
projects: 3,
data: [
{
"EmployeeID": "id1",
"EmployeeName": "Name1",
"IsSuperVisor": "Yes"
},
{
"EmployeeID": "id2",
"EmployeeName": "Name2",
"IsSuperVisor": "No"
},
{
"EmployeeID": "id3",
"EmployeeName": "Name3",
"IsSuperVisor": "No"
},
]
}


Do you see any data?

Regards,
Scott.

hieu79vn
4 Apr 2012, 11:29 PM
Dear Scott,

Thank you for your answer. I put the string in the page Defaut2.aspx.cs and call this page from Default.aspx but it hasn't loaded the data.

protected void Page_Load(object sender, EventArgs e)
{
this.Literal1.Text = "{projects: 3,data: [{\"EmployeeID\": \"id1\",\"EmployeeName\": \"Name1\",\"IsSuperVisor\": \"Yes\" }, {\"EmployeeID\": \"id2\",\"EmployeeName\": \"Name2\",\"IsSuperVisor\": \"No\"}, {\"EmployeeID\": \"id3\",\"EmployeeName\": \"Name3\",\"IsSuperVisor\": \"No\"},]}";
}

Page Defaut2.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>

<asp:Literal ID="Literal1" runat="server"></asp:Literal>


This is the content of the page Default.aspx which call Defaut2.aspx


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" Namespace="System.Web.UI" TagPrefix="asp" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Organization Chart</title>
<link href="css/ext-all.css" rel="stylesheet" type="text/css" />
<link href="css/example.css" rel="stylesheet" type="text/css" />
<script src="scripts/ext-all-debug.js" type="text/javascript"></script>
</head>
<body>
<div id="div1" > </div>
<div id="divEmployees" style="width: 350px; height: 300px"> </div>
<script language="javascript" type="text/javascript">
var projects = Ext.data.JsonStore({

autoDestroy: true,
storeId: 'projects',

proxy: {
type: 'ajax',
url: 'Default2.aspx',
reader: {
type: 'json',
root: 'projects',
idProperty: 'EmployeeID'
}
},
fields: ['EmployeeID', 'EmployeeName', 'IsSuperVisor']
});

Ext.create('Ext.grid.Panel', {
title: 'Test',
store: projects,
columns: [
{ header: 'EmployeeID', dataIndex: 'EmployeeID' },
{ header: 'EmployeeName', dataIndex: 'EmployeeName', flex: 1 },
{ header: 'IsSuperVisor', dataIndex: 'IsSuperVisor' }
],
height: 200,
width: 400,
renderTo: 'divEmployees'
});
</script>
</body>
</html>

hieu79vn
5 Apr 2012, 12:23 AM
I did it. For people who want the answer.
Thank you Scott.

public partial class Default2 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
this.Literal1.Text = "{\"projects\": [{\"EmployeeID\": \"id1\",\"EmployeeName\": \"Name1\",\"IsSuperVisor\": \"Yes\" }, {\"EmployeeID\": \"id2\",\"EmployeeName\": \"Name2\",\"IsSuperVisor\": \"No\"}, {\"EmployeeID\": \"id3\",\"EmployeeName\": \"Name3\",\"IsSuperVisor\": \"No\"},]}";
}
}

<script language="javascript" type="text/javascript">

Ext.define('User', {
extend: 'Ext.data.Model',
fields: [
{ name: 'EmployeeID', type: 'string' },
{ name: 'EmployeeName', type: 'string' },
{ name: 'IsSuperVisor', type: 'string' }
]
});


var projects = Ext.data.Store({

storeId: 'projects',
model: 'User',
proxy: {
type: 'ajax',
url: 'Default2.aspx',
reader: {
type: 'json',
root: 'projects'
}
},
autoLoad: true
});

Ext.create('Ext.grid.Panel', {
title: 'Test',
store: projects,
columns: [
{ header: 'EmployeeID', dataIndex: 'EmployeeID' },
{ header: 'EmployeeName', dataIndex: 'EmployeeName', flex: 1 },
{ header: 'IsSuperVisor', dataIndex: 'IsSuperVisor' }
],
height: 200,
width: 400,
renderTo: 'divEmployees'
});
</script>