<script>
/**
* 从对象数组中获取属性为objPropery,值为objValue元素的对象
* @param Array arrPerson 数组对象
* @param String objPropery 对象的属性
* @param String objPropery 对象的值
* @return Array 过滤后的数组
*/
function get(arrPerson,objPropery,objValue)
{
return $.grep(arrPerson, function(cur,i){
return cur[objPropery]==objValue;
});
}
var trest =<%=testa %>;
var relations = trest;
var renderReLation = function (value, metadata, record, rowIndex, colIndex, store) {
// 操作对象数组 或数组
// console.log(get(relations,"key",1)[0].desc);
//
// var rel = relations[value];
var rel =get(relations,"key",1)[0];
if (rel) {
return '<a href="#" class="editRela" id="id' + value + '">名称:' + rel.key + '描述' + rel.desc + '</a>';
}
};
$(".editRela").live("click", function () {
var id = this.id.substring(2);
$("#hid").val(id);
App.winEdit.show();
})
</script>
<form id="form1" runat="server">
<ext:ResourceManager runat="server" />
<ext:GridPanel ID="GridPanel1" runat="server" Title="Array Grid" Width="600" Height="350">
<Store>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model ID="Model1" runat="server">
<Fields>
<ext:ModelField Name="company" />
<ext:ModelField Name="price" Type="Float" />
<ext:ModelField Name="change" Type="Float" />
<ext:ModelField Name="lastChange" Type="Date" DateFormat="M/d hh:mmtt" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column ID="Column1" runat="server" Text="Company" DataIndex="company" Flex="1" />
<ext:Column ID="Column2" runat="server" Text="Price" Width="75" DataIndex="price">
<Renderer Fn="renderReLation" />
</ext:Column>
<ext:Column ID="Column3" runat="server" Text="Change" Width="75" DataIndex="change" />
</Columns>
</ColumnModel>
<%-- <SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" Mode="Single" />
</SelectionModel>
<View>
<ext:GridView ID="GridView1" runat="server" StripeRows="true" TrackOver="true" />
</View>--%>
</ext:GridPanel>
<ext:Hidden runat="server" ID="hid">
</ext:Hidden>
<ext:Window Width="300" Height="300" Title="dfd" ID="winEdit" runat="server" Hidden="true">
<Items>
<ext:Button Text="dfs" OnDirectClick="btnSave">
</ext:Button>
</Items>
</ext:Window>
</form>
后 台
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Ext.Net;
using Newtonsoft.Json.Linq;
using Newtonsoft.Json;
namespace ExtNet2_52014314
{
public partial class TemplateColumn : System.Web.UI.Page
{
public string testa = "{ 1: { key: \"key\", desc:\"desc\" }, 2: { key: \"key2\", desc: \"desc2\"} }";
public string testa1;
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest){
List< re> h = new List<re>();
h.Add(new re { key = "1", desc="desc1",emplo = new emplo() { desc = "desc", key = "key" } });
testa1= h.ToString();
System.Web.Script.Serialization.JavaScriptSerializer jSearializer =
new System.Web.Script.Serialization.JavaScriptSerializer();
testa = jSearializer.Serialize(h);
X.Msg.Alert("d", testa1).Show();
BindData();
// Column c=new Column();
//c.Text="tem";
// c.Renderer.Handler=""
// this.GridPanel1.AddColumn=;
}
}
private void BindData()
{
this.Store1.DataSource = this.Data;
this.Store1.DataBind();
}
private object Data
{
get
{
return new List<object>
{
new { company = "3m Co", price =1, change = 1, pctChange = 0.03, lastChange = "9/1 12:00am" },
new { company = "3m Co", price =2, change = 2, pctChange = 0.03, lastChange = "9/1 12:00am" },
};
}
}
public class emplo
{
public string key { get; set; }
public string desc { get; set; }
}
public class re
{
public string key { get; set; }
public string desc { get; set; }
public emplo emplo { get; set; }
}
protected void btnSave(object o,DirectEventArgs e)
{
X.Msg.Alert("a",this.hid.Text).Show();
}
}
}