jQuery通过Ajax从后台获取信息来显示在表上,并支持行选择。
背景代码:(这并不重要)
市民ActionResult GetDictTypes()
{
VaR数据从一个dbo.dicttypes
选择新的dicttypelistviewmodel
{
ID =张,
名称=名称,
lastchangeuser = a.lastchangeuser,
lastchangedate = a.lastchangedate,
评论=评论
};
返回的JSON(data.tolist());
}
Page code:
身份证件
标题
简介
Javascript代码:(需要在$(文档)Ready中调用(函数($){ })
函数的ShowDictType(){
$(# dicttypetable)。儿童('tbody)空();
$ ajax({
网址:getdicttypes_url,
类型:'post,
DataType:'json
})
完成(函数(数据){)
VaR tbody = ;
$(数据,函数(索引,EL){)
var;
el.id TR + + + = ;
名称+;
语句+;
=;
tbody = TR;
});
$(# dicttypetable)。儿童('tbody)。追加(把);
(binddicttypetableevent); / /这里是绑定事件
})
失败(函数(){())
警报();
});
}
在生成表单后绑定事件:
函数的BindDictTypeTableEvent(){
$(# dicttypetable tbody. SEL)。儿童(TR)。Click(函数(事件){ {)
$(这),兄弟姐妹(TR)。RemoveClass(主动的); / /删除其他选择的影响
$(这)。AddClass(主动的); / /添加选择的影响
var id = $(this)。儿童('td:情商(0)(文本的) / /身份证);
showdictdata(ID); / /操作代码,这是另一种形式的数据显示
});
}
最后是获取所选项目id的代码:
函数的GetTypeTableSelectId(){
返回$(' # dicttypetable tbody.sel tr.active TD:情商(0)文本());
}