jQuery&JSON~~
js:
$(function () {
$.ajax({
type: 'GET',
url: 'GetJson.ashx',
dataType: 'json',
success: function (data) {
//$.each(data.menus, function (idx, item) {
// alert(idx);
// alert(item.street);
//});
var menulist = "";
//alert(data);
$.each(data.menus, function (i, n) {
menulist += '<div title="' + n.menuname + '" icon="' + n.icon + '" style="overflow:auto;">';
menulist += '<ul>';
$.each(n.menus, function (j, o) {
menulist += '<li><div><a target="mainFrame" href="' + o.url + '" ><span class="icon ' + o.icon + '" ></span>' + o.menuname + '</a></div></li> ';
})
menulist += '</ul></div>';
})
$(".easyui-accordion").append(menulist);
$('.easyui-accordion li a').click(function (){
var tabTitle = $(this).text();
var url = $(this).attr("href");
addTab(tabTitle, url);
$('.easyui-accordion li div').removeClass("selected");
$(this).parent().addClass("selected");
}).hover(function () {
$(this).parent().addClass("hover");
}, function () {
$(this).parent().removeClass("hover");
});
$(".easyui-accordion").accordion();
},
error: function (msg) {
alert(msg.responseText);
}
});
})
.ashx:
<%@ WebHandler Language="C#" Class="VSSCodeHandler" %>
using System;
using System.Web;
using YJC.Toolkit.Sys;
using YJC.Toolkit.Data;
using YJC.Toolkit.Utility;
using System.Data;
public class VSSCodeHandler : IHttpHandler{
DbContext context = GlobalVariable.DefaultDbContextConfig.CreateDbContext();
public void ProcessRequest (HttpContext context) {
context.Response.ClearContent();
string sql = @"SELECT FN_ID,FN_PARENT_ID,FN_TREE_LAYER,FN_NAME,FN_URL,'iconCls' as iconCls, FN_REVERSE1 FROM SYS_FUNCTION";
DataSet ds = new DataSet("Tooklit");
SqlSelector seletor = new SqlSelector(this.context, ds);
seletor.Select("SYS_FUNCTION", sql);
DataTable vTable = ds.Tables["SYS_FUNCTION"];
string strResult = "{\"menus\":["+"\r\n";
if (vTable.Rows.Count > 0)
{
DataRow[] dr = vTable.Select("fn_parent_id='-1'");
strResult = DtTreeToJson(vTable, strResult, dr);
}
strResult += "\r\n";
strResult += "]}";
context.Response.ContentType = "text/plain";
context.Response.AddHeader("Content-Type", "application/json; charset=gb2312");
context.Response.Write(strResult.ToString());
}
private static string DtTreeToJson(DataTable dt, string strResult, DataRow[] dr)
{
if (dr.Length > 0)
{
for (int i = 0; i < dr.Length; i++)
{
strResult += "{\"menuid\":\"" + dr[i]["fn_id"] + "\",";
strResult += "\"icon\":\"icon-sys\",";
strResult += "\"menuname\":\"" + dr[i]["FN_NAME"] + "\"," + "\r\n";
DataRow[] drChild = dt.Select("fn_parent_id='" + dr[i]["fn_id"] + "'");
if (drChild.Length > 0)
{
strResult += "\"menus\":[";
for (int j = 0; j < drChild.Length; j++)
{
strResult += "{\"menuname\":\"" + drChild[j]["FN_NAME"] + "\",";
strResult += "\"icon\":\"icon-nav\",";
strResult += "\"url\":\"" + drChild[j]["fn_url"] + "\"}";
strResult += "\r\n";
if (j != drChild.Length - 1)
strResult += ",";
}
strResult += "]"+"\r\n";
}
strResult += "}" + "\r\n";
if (i != dr.Length - 1)
strResult += ",";
}
}
return strResult;
}
public bool IsReusable {
get {
return false;
}
}
}
呵呵，博客园现在还不支持搜狐博客直接搬家功能，只好把之前的搜狐博客日志一个一个Copy过来，和大家一起分享了，这篇是我10年的一个测试实例：
方法1:
using System.IO;
using System.Data.SqlClient;
using System.Data.Common;
using Microsoft.Practices.EnterpriseLibrary.Common;
using Microsoft.Practices.EnterpriseLibrary.Data;
using System.Text;
using System.Reflection;
后台代码:
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
string sql = @"SELECT top 10 [Materialcode]
,[MaterialName]
,[MaterialSpec]
,[HelpCode]
FROM [aritime].[dbo].[Material_Info_t]";
DbCommand dbcmd = null;
dbcmd = DB.GetSqlStringCommand(sql);
DataSet dataset = null;
dataset = DB.ExecuteDataSet(dbcmd);
DataTable dt = dataset.Tables[0];
Materialcode_List = CreateJsonParameters(dt).ToString().Trim();
//Response.Write(Materialcode_List.ToString());
OnStart();
}
}
public static string CreateJsonParameters(DataTable dt)
{
StringBuilder JsonString = new StringBuilder();
JsonString.Clear();
//Exception Handling
if (dt != null && dt.Rows.Count > 0)
{
////JsonString.Append("{ ");
//JsonString.Append(" var MaterialNameLists = [");
JsonString.Append("[");
for (int i = 0; i < dt.Rows.Count; i++)
{
JsonString.Append("{ ");
for (int j = 0; j < dt.Columns.Count; j++)
{
if (j < dt.Columns.Count - 1)
{
JsonString.Append("" + dt.Columns[j].ColumnName.ToString().Trim() + ":" + "\"" + dt.Rows[i][j].ToString().Trim() + "\",");
}
else if (j == dt.Columns.Count - 1)
{
JsonString.Append("" + dt.Columns[j].ColumnName.ToString().Trim() + ":" + "\"" + dt.Rows[i][j].ToString().Trim() + "\"");
}
}
/**/
/**/
/**/
/*end Of String*/
if (i == dt.Rows.Count - 1)
{
JsonString.Append("} ");
}
else
{
JsonString.Append("}, ");
}
}
JsonString.Append("]");
return JsonString.ToString().Trim();
}
else
{
return null;
}
}
/// <summary>
/// 将一个数据表转换成一个JSON字符串，在客户端可以直接转换成二维数组。
/// </summary>
/// <param name="source">需要转换的表。</param>
/// <returns></returns>
public static string DataTableToJson(DataTable source)
{
if (source.Rows.Count == 0)
return "";
StringBuilder sb = new StringBuilder("[");
foreach (DataRow row in source.Rows)
{
sb.Append("[");
for (int i = 0; i < source.Columns.Count; i++)
{
sb.Append('"' + row[i].ToString() + "\",");
}
sb.Remove(sb.Length - 1, 1);
sb.Append("],");
}
sb.Remove(sb.Length - 1, 1);
sb.Append("]");
return sb.ToString();
}
// public void Atest()
// {
// string path = Server.MapPath("http://www.cnblogs.com/js/localdata.js");
// if (File.Exists(path))
// {
// File.Delete(path);
// }
// string sql = @"SELECT [Materialcode]
// ,[MaterialName]
// ,[MaterialSpec]
// ,[HelpCode]
// FROM [aritime].[dbo].[Material_Info_t]";
// DbCommand dbcmd = null;
// dbcmd = DB.GetSqlStringCommand(sql);
// DataSet dataset = null;
// dataset = DB.ExecuteDataSet(dbcmd);
// //创建JS文件.
// StreamWriter sr = File.CreateText(path);
// sr.WriteLine("//初始化所有国内机场城市");
// sr.WriteLine(" var MaterialNameLists = [" + "\r\n");
// // 这里是JS中的内容
// for (int i = 0; i < dataset.Tables[0].Rows.Count - 1; i++)
// {
// sr.WriteLine("{ Materialcode: \"" + dataset.Tables[0].Rows[i]["Materialcode"].ToString().Trim() + "\",MaterialName: \"" + dataset.Tables[0].Rows[i]["MaterialName"].ToString().Trim() + "\",MaterialSpec: \"" + dataset.Tables[0].Rows[i]["MaterialSpec"].ToString().Trim() + "\",HelpCode:\"" + dataset.Tables[0].Rows[i]["HelpCode"].ToString().Trim() + "\"}," + "\r\n");
// }
// sr.WriteLine("{ Materialcode: \"" + dataset.Tables[0].Rows[dataset.Tables[0].Rows.Count - 1]["Materialcode"].ToString().Trim() + "\",MaterialName: \"" + dataset.Tables[0].Rows[dataset.Tables[0].Rows.Count - 1]["MaterialName"].ToString().Trim() + "\",MaterialSpec: \"" + dataset.Tables[0].Rows[dataset.Tables[0].Rows.Count - 1]["MaterialSpec"].ToString().Trim() + "\",HelpCode:\"" + dataset.Tables[0].Rows[dataset.Tables[0].Rows.Count - 1]["HelpCode"].ToString().Trim() + "\"}" + "\r\n");
// sr.WriteLine("];" + "\r\n");
// sr.WriteLine("var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];");
// sr.WriteLine("var cities = ['Aberdeen', 'Ada','Akron','Yorkshire', 'Yorkville'];");
// sr.Close();
// }
前台代码:
<input type="text" id="suggest13" />
<script type="text/javascript" src="http://www.cnblogs.com/js/jquery.js"></script>
<%-- <script type="text/javascript" src="http://www.cnblogs.com/js/json.js"></script>--%>
<script type='text/javascript' src='http://www.cnblogs.com/js/jquery.autocomplete.js'></script>
<%-- <script type='text/javascript' src='http://www.cnblogs.com/js/localdata.js'></script>--%>
<link rel="stylesheet" type="text/css" href="http://www.cnblogs.com/js/jquery.autocomplete.css" />
<script type="text/javascript">
$().ready(function () {
function log(event, data, formatted) {
$("<li>").html(!data ? "No match!" : "Selected: " + formatted).appendTo("#result");
}
function formatItem(row) {
return row[0] + " (<strong>id: " + row[1] + "</strong>)";
}
function formatResult(row) {
return row[0].replace(/(<.+?>)/gi, '');
}
var MaterialNameLists = '<%=Materialcode_List%>';
////method 1：eval来转换JSON字符到Object//////
var arr = eval('(' + MaterialNameLists + ')')
alert(arr);
////method 2：parseJSON来转换JSON字符到Object//////
// var obj = MaterialNameLists.parseJSON();
// alert(obj.toJSONString());
// var testlist = [{ Materialcode: "WXCL200400001", MaterialName: "螺栓松动剂", MaterialSpec: "", HelpCode: "LSSDJ" }, { Materialcode: "WXCL200400002", MaterialName: "煤油", MaterialSpec: "", HelpCode: "MY" }, { Materialcode: "WXCL200400003", MaterialName: "铁刷", MaterialSpec: "", HelpCode: "TS" }, { Materialcode: "WXCL200400004", MaterialName: "螺丝", MaterialSpec: "M16*100", HelpCode: "LS" }, { Materialcode: "WXCL200400005", MaterialName: "螺丝", MaterialSpec: "M8*50", HelpCode: "LS" }, { Materialcode: "WXCL200400006", MaterialName: "一字螺丝刀", MaterialSpec: "小", HelpCode: "YZLSD" }, { Materialcode: "WXCL200400007", MaterialName: "十字螺丝刀", MaterialSpec: "小", HelpCode: "SZLSD" }, { Materialcode: "WXCL200400008", MaterialName: "电工皮带", MaterialSpec: "", HelpCode: "DGPD" }, { Materialcode: "WXCL200400009", MaterialName: "工具套", MaterialSpec: "", HelpCode: "GJT" }, { Materialcode: "WXCL200400010", MaterialName: "电工刀", MaterialSpec: "", HelpCode: "DGD"}];
// var aad = [{ Materialcode: "WXCL200400001", MaterialName: "螺栓松动剂", MaterialSpec: "", HelpCode: "LSSDJ" }, { Materialcode: "WXCL200400002", MaterialName: "煤油", MaterialSpec: "", HelpCode: "MY" }, { Materialcode: "WXCL200400003", MaterialName: "铁刷", MaterialSpec: "", HelpCode: "TS" }, { Materialcode: "WXCL200400004", MaterialName: "螺丝", MaterialSpec: "M16*100", HelpCode: "LS" }, { Materialcode: "WXCL200400005", MaterialName: "螺丝", MaterialSpec: "M8*50", HelpCode: "LS" }, { Materialcode: "WXCL200400006", MaterialName: "一字螺丝刀", MaterialSpec: "小", HelpCode: "YZLSD" }, { Materialcode: "WXCL200400007", MaterialName: "十字螺丝刀", MaterialSpec: "小", HelpCode: "SZLSD" }, { Materialcode: "WXCL200400008", MaterialName: "电工皮带", MaterialSpec: "", HelpCode: "DGPD" }, { Materialcode: "WXCL200400009", MaterialName: "工具套", MaterialSpec: "", HelpCode: "GJT" }, { Materialcode: "WXCL200400010", MaterialName: "电工刀", MaterialSpec: "", HelpCode: "DGD"}];
// alert(aad.toString());
// alert(arr);
$("#suggest13").autocomplete(arr, {
max: 15, //列表里的条目数
minChars: 0, //自动完成激活之前填入的最小字符
width: 400, //提示的宽度，溢出隐藏
scrollHeight: 400, //提示的高度，溢出显示滚动条
matchContains: true, //包含匹配，就是data参数里的数据，是否只要包含文本框里的数据就显示
autoFill: false, //自动填充
formatItem: function (row, i, max) {
return i + "/" + max + ": \"" + row.HelpCode + "\" [" + row.Materialcode + "][" + row.MaterialName + "][" + row.MaterialSpec + "]";
},
formatMatch: function (row, i, max) {
return row.HelpCode + " " + row.Materialcode + " " + row.MaterialName + " " + row.MaterialSpec;
},
formatResult: function (row) {
return row.MaterialName;
}
}).result(function (event, row, formatted) {
// var txt = '<%=memo_Input.ClientID%>';
// document.getElementById(txt).value = row.MaterialName;
// document.getElementById('<%=memo_Input.ClientID%>').value = row.MaterialName;
});
});
</script>
方法2:
后台代码:
public void Atest()
{
string path = Server.MapPath("http://www.cnblogs.com/js/localdata.js");
if (File.Exists(path))
{
File.Delete(path);
}
string sql = @"SELECT [Materialcode]
,[MaterialName]
,[MaterialSpec]
,[HelpCode]
FROM [aritime].[dbo].[Material_Info_t]";
DbCommand dbcmd = null;
dbcmd = DB.GetSqlStringCommand(sql);
DataSet dataset = null;
dataset = DB.ExecuteDataSet(dbcmd);
//创建JS文件.
StreamWriter sr = File.CreateText(path);
sr.WriteLine("//初始化所有国内机场城市");
sr.WriteLine(" var MaterialNameLists = [" + "\r\n");
// 这里是JS中的内容
for (int i = 0; i < dataset.Tables[0].Rows.Count - 1; i++)
{
sr.WriteLine("{ Materialcode: \"" + dataset.Tables[0].Rows[i]["Materialcode"].ToString().Trim() + "\",MaterialName: \"" + dataset.Tables[0].Rows[i]["MaterialName"].ToString().Trim() + "\",MaterialSpec: \"" + dataset.Tables[0].Rows[i]["MaterialSpec"].ToString().Trim() + "\",HelpCode:\"" + dataset.Tables[0].Rows[i]["HelpCode"].ToString().Trim() + "\"}," + "\r\n");
}
sr.WriteLine("{ Materialcode: \"" + dataset.Tables[0].Rows[dataset.Tables[0].Rows.Count - 1]["Materialcode"].ToString().Trim() + "\",MaterialName: \"" + dataset.Tables[0].Rows[dataset.Tables[0].Rows.Count - 1]["MaterialName"].ToString().Trim() + "\",MaterialSpec: \"" + dataset.Tables[0].Rows[dataset.Tables[0].Rows.Count - 1]["MaterialSpec"].ToString().Trim() + "\",HelpCode:\"" + dataset.Tables[0].Rows[dataset.Tables[0].Rows.Count - 1]["HelpCode"].ToString().Trim() + "\"}" + "\r\n");
sr.WriteLine("];" + "\r\n");
sr.WriteLine("var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];");
sr.WriteLine("var cities = ['Aberdeen', 'Ada','Akron','Yorkshire', 'Yorkville'];");
sr.Close();
}
前台代码:
<script type="text/javascript" src="http://www.cnblogs.com/js/jquery.js"></script>
<script type='text/javascript' src='http://www.cnblogs.com/js/jquery.autocomplete.js'></script>
<script type='text/javascript' src='http://www.cnblogs.com/js/localdata.js'></script>
<link rel="stylesheet" type="text/css" href="http://www.cnblogs.com/js/jquery.autocomplete.css" />
<script type="text/javascript">
$().ready(function () {
function log(event, data, formatted) {
$("<li>").html(!data ? "No match!" : "Selected: " + formatted).appendTo("#result");
}
function formatItem(row) {
return row[0] + " (<strong>id: " + row[1] + "</strong>)";
}
function formatResult(row) {
return row[0].replace(/(<.+?>)/gi, '');
}
$("#suggest13").autocomplete(MaterialNameLists, {
max: 15, //列表里的条目数
minChars: 0, //自动完成激活之前填入的最小字符
width: 400, //提示的宽度，溢出隐藏
scrollHeight: 400, //提示的高度，溢出显示滚动条
matchContains: true, //包含匹配，就是data参数里的数据，是否只要包含文本框里的数据就显示
autoFill: false, //自动填充
formatItem: function (row, i, max) {
return i + "/" + max + ": \"" + row.HelpCode + "\" [" + row.Materialcode + "][" + row.MaterialName + "][" + row.MaterialSpec + "]";
},
formatMatch: function (row, i, max) {
return row.HelpCode + " " + row.Materialcode + " " + row.MaterialName + " " + row.MaterialSpec;
},
formatResult: function (row) {
return row.MaterialName;
}
}).result(function (event, row, formatted) {
var txt = '<%=inplace_Input.ClientID%>';
document.getElementById(txt).value = row.MaterialName;
document.getElementById('<%=inplace_Input.ClientID%>').value = row.MaterialName;
});
});
</script>
如何给文本框赋值:
var txt = '<%=inplace_Input.ClientID%>';
alert(txt.toString());
document.getElementById(txt).value = row.MaterialName;
document.getElementById('<%=inplace_Input.ClientID%>').value = row.MaterialName;
将json字符串转换为json 对象:
var MaterialNameLists = '<%=Materialcode_List%>';
////method 1：eval来转换JSON字符到Object//////
var arr = eval('(' + MaterialNameLists + ')')
