Extjs的combobox使用jsonstore获取asp.net后台数据
日期：2014-05-16 浏览次数：20637 次
Extjs的combobox使用jsonstore获取asp.net后台数据 - Web 开发 / Ajax
js源码
<!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>
<title>更多Extjs表单项</title>
<link rel="Stylesheet" type="text/css" href="Resources/CSS/ext-all.css" />
<script type="text/javascript" src="Extjs/ext-base-debug.js"></script>
<script type="text/javascript" src="Extjs/ext-all-debug.js"></script>
<script type="text/javascript" src="Extjs/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
Ext.onReady(function() {
Ext.BLANK_IMAGE_URL = "Resources/Images/default/s.gif";
/*
var dstore = new Ext.data.JsonStore({
url: "getDepartment.aspx",
fields: ["Name", "Code"],
root: 'rows'
});
dstore.load();
var dateSelect = new Ext.form.FormPanel({
title: "日期选择",
labelSeparator: ':',
labelWidth: 60,
labelAlign: "right",
width: 600,
applyTo: 'dateSelect',
items: [
new Ext.form.DateField({
id: 'dfSelect',
format: 'Y年m月d日',
minValue: '1900-01-01',
maxValue: '3000-01-01',
disabledDaysText: '禁止选择该日期',
fieldLabel: '选择日期',
width: 150,
showToday: true
}),
new Ext.form.ComboBox({
id: "cbDepartment",
fieldLabel: "部门",
triggerAction: "all",
store: dstore,
valueField: "Code",
displayField: "Name",
mode: "local",
forceSection: true,
typeAhead: true,
resizeAble: true
}),
new Ext.form.HtmlEditor({
id: 'htmlContent',
width: 500,
autoHeight: false,
fieldLabel: "HTML编辑"
})
]
});
Ext.MessageBox.alert("Test the return record num", "共获得" + dstore.getCount() + "条数据");
});
</script>
</head>
<body>
<div id="dateSelect"></div>
</body>
</html>
asp.net页面源码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace Web
{
public partial class getDepartment : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
string result = null;
result = "{rows:[{'Name':'开发部', 'Code':'1'}, {'Name':'销售部', 'Code':'2'}, {'Name':'行政部', 'Code':'3'}, {'Name':'质检部', 'Code':'4'}]}";
HttpContext.Current.Response.ContentType = "text/plain";
HttpContext.Current.Response.Write(result);
// Response.Write(result);
}
}
}
下拉框得不到数据，请问这段代码哪里有错误?
------解决方案--------------------
代码应该没有问题 确定store里面有数据吗？
加这句试试看有没有数据返回
dstore.load({callback:function(){
alert("Test the return record num", "共获得" + dstore.getCount() + "条数据");
}});
js源码
<!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>
<title>更多Extjs表单项</title>
<link rel="Stylesheet" type="text/css" href="Resources/CSS/ext-all.css" />
<script type="text/javascript" src="Extjs/ext-base-debug.js"></script>
<script type="text/javascript" src="Extjs/ext-all-debug.js"></script>
<script type="text/javascript" src="Extjs/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
Ext.onReady(function() {
Ext.BLANK_IMAGE_URL = "Resources/Images/default/s.gif";
/*
var dstore = new Ext.data.JsonStore({
url: "getDepartment.aspx",
fields: ["Name", "Code"],
root: 'rows'
});
dstore.load();
var dateSelect = new Ext.form.FormPanel({
title: "日期选择",
labelSeparator: ':',
labelWidth: 60,
labelAlign: "right",
width: 600,
applyTo: 'dateSelect',
items: [
new Ext.form.DateField({
id: 'dfSelect',
format: 'Y年m月d日',
minValue: '1900-01-01',
maxValue: '3000-01-01',
disabledDaysText: '禁止选择该日期',
fieldLabel: '选择日期',
width: 150,
showToday: true
}),
new Ext.form.ComboBox({
id: "cbDepartment",
fieldLabel: "部门",
triggerAction: "all",
store: dstore,
valueField: "Code",
displayField: "Name",
mode: "local",
forceSection: true,
typeAhead: true,
resizeAble: true
}),
new Ext.form.HtmlEditor({
id: 'htmlContent',
width: 500,
autoHeight: false,
fieldLabel: "HTML编辑"
})
]
});
Ext.MessageBox.alert("Test the return record num", "共获得" + dstore.getCount() + "条数据");
});
</script>
</head>
<body>
<div id="dateSelect"></div>
</body>
</html>
asp.net页面源码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace Web
{
public partial class getDepartment : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
string result = null;
result = "{rows:[{'Name':'开发部', 'Code':'1'}, {'Name':'销售部', 'Code':'2'}, {'Name':'行政部', 'Code':'3'}, {'Name':'质检部', 'Code':'4'}]}";
HttpContext.Current.Response.ContentType = "text/plain";
HttpContext.Current.Response.Write(result);
// Response.Write(result);
}
}
}
下拉框得不到数据，请问这段代码哪里有错误?
------解决方案--------------------
代码应该没有问题 确定store里面有数据吗？
加这句试试看有没有数据返回
dstore.load({callback:function(){
alert("Test the return record num", "共获得" + dstore.getCount() + "条数据");
}});
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
