怎么为easyui的easyui datagrid api增加属性

动态改变列的编辑属性
var tt=$('#dg').datagrid('getColumnOption', 'yearContent'); //通过列名获得此列
tt.editor={type:'textarea'}; //设置此列的编辑属性 如果禁用编辑 则设置 tt.editor={}
&新增一行时&yearContent 列可以编辑
function append(){
if (endEditing()){
$('#dg').datagrid('appendRow',{});//新增一行
var tt=$('#dg').datagrid('getColumnOption', 'yearContent');
tt.editor={type:'textarea'};
editIndex = $('#dg').datagrid('getRows').length-1;
$('#dg').datagrid('selectRow', editIndex)
.datagrid('beginEdit', editIndex);
$("textarea").css("height","85px");
点击一行时&yearContent 列不可以编辑
function onClickRow(index,field,value){
if (editIndex != index){
if (endEditing()){
var tt=$('#dg').datagrid('getColumnOption', 'yearContent');
tt.editor={};
$('#dg').datagrid('selectRow', index)
.datagrid('beginEdit', index);
editIndex =
$('#dg').datagrid('selectRow', editIndex);
$("textarea").css("height","85px");
阅读(...) 评论()其他回答(2)
~在JS里面是无法识别的 只能用../../这样的逐个层级的去找
收获园豆:5
园豆:1412
多谢两位的解答,两位的意见是正确的,非常感谢。
另外我上面贴的GetStudentInformation&Action部分的代码有误,不改正的话数据也不能显示,正确的代码是:
public JsonResult GetStudentInformation()
List&CMS_Model.Students& students = new List&CMS_Model.Students&();
students = CMSService.GetAllStudents();
var result = new
taotal = students.Count,
rows = students
return Json(result, JsonRequestBehavior.AllowGet);
谢谢你们。
&&&您需要以后才能回答,未注册用户请先。可选的参数
DataGrid 属性
覆写了 $.fn.datagrid.defaults.
Datagrid面板的标题
在面板上通过一个CSS类显示16x16图标。
设置面板是否具有边框
datagrid面板的宽度
datagrid面板的高度
DataGrid列配置对象
frozenColumns
冻结的列,被现实在左边
设置是否让单元格显示条纹。默认false。
通过该方法类型请求远程数据。默认post。
是否包裹数据,默认为包裹数据显示在一行
标识字段,或者说主键字段
请求数据的URL.
加载数据时显示的信息
Processing, please wait &
pagination
是否显示分页工具栏
rownumbers
DataGrid Columns 是一个数组对象, 数组里的对象也是一个数组,数组里的每一个小对象就是一个列字段,例如:Column 属性
columns:[[
{field:'itemid',title:'Item ID',rowspan:2,width:80,sortable:true},
{field:'productid',title:'Product ID',rowspan:2,width:80,sortable:true},
{title:'Item Details',colspan:4}],[
{field:'listprice',title:'List Price',width:80,align:'right',sortable:true},
{field:'unitcost',title:'Unit Cost',width:80,align:'right',sortable:true},
{field:'attr1',title:'Attribute',width:100},
{field:'status',title:'Status',width:60}]]
名称类型描述默认值
列字段要现实的名称
单元格行数
单元格列数
文本对齐方式,同align属性.
是否可以被排序.
是否具有多选框
Events(事件)
NameParametersDescription
onLoadSuccess
调用远程数据成功是激活
onLoadError
装载错误时激活
onClickRow
rowIndex, rowData
点击一行时激活,参数包括:rowIndex:点击的行数,从0开始rowData: 当前行的数据
onDblClickRow
rowIndex, rowData
双击一行是触发,参数包括:rowIndex:点击的行数,从0开始rowData: 当前行的数据
onSortColumn
sort, order
对一列进行排序时激活,参数包括:sort:排序字段名称order: 排序规则,升序,降序
rowIndex, rowData
选中一行时激活,参数有:rowIndex:选中的行数rowData: 数据
onUnselect
rowIndex, rowData
取消选中时激活,参数:rowIndex:选中的行数rowData: 数据
Methods(方法)
NameParameterDescription
返回所有属性
重置大小布局
重新加载数据
fixColumnSize
调整列的大小
装载数据,以前的数据会被移除
getSelected
返回选中的行,没有则返回空
getSelections
返回所有的行,空则返回空数组
clearSelections
取消所有选中
选中一行,参数为行号
selectRecord
根据主键查询出一条记录
unselectRow
取消选中一行
阅读(...) 评论()jquery&easyui&中&datagrid&动态修改列
最近在做一个学校的项目,用了easyui的前端框架,在毕业审批中有个需求当我选择成绩的时候仅仅显示成绩。
当我点击 毕业流程 的时候显示全部,
这个需求,因为整个页面时ajax加载过来,然后tree也是ajax加载过来,最后是数据加载(即单元格中的数据)
直接贴代码
$(document).ready(function(){
$('#{{$form}}_grid').datagrid({
title:'毕业管理', &
&iconCls:'icon-edit',
& &collapsible:true,
&rownumbers:true,
&fit:true,
&url:'/?t={{'school'|encrypt}}&m={{'graduation'|encrypt}}&a={{'loading'|encrypt}}&deptid='+$('#{{$form}}_pid').val(),
& &frozenColumns:[[
&{field:'id',checkbox:true},
&{field:'sn',title:'学号',width:80,sortable:true},&
&{field:'name',title:'姓名',width:80,sortable:true},
&{field:'gender',title:'性别',width:40,sortable:true},
&{field:'nation_name',title:'民族',width:40,sortable:true},
&{field:'specialty_name',title:'专业名称',width:120,sortable:true},
&{field:'classe_name',title:'班级名称',width:100,sortable:true}
& &columns:[[
& & {{foreach item=data
from=$rsPar key=key}}
{field:{{$key}}+'_note',title:'{{$data}}',width:80,sortable:false},
& & {{/foreach}}
& &pagination:true,
& & toolbar:[{
text:'搜索',
iconCls:'icon-search',
handler:{{$form}}_search
{text:'通过',iconCls:'icon-edit',handler:function(){
{{$form}}_add($('#{{$form}}_pid').val()) }}
& & ,'-',{
text:'导出',
iconCls:'icon-export',
handler:{{$form}}_drop
&onLoadSuccess:function(){
$(this).datagrid('getPanel').find('a.easyui-linkbutton').linkbutton();
var vHeight = $(".datagrid-view").height();
& $(".datagrid-header").height(1154);
& $(".datagrid-body").height(vHeight - 26);
onDblClickRow:function(index,row)
loadTab("学生 ["+row.name+" "+row.sn+"]
信息","?t={{'school'|encrypt}}&m={{'student'|encrypt}}&a={{'detail'|encrypt}}&id="+row.stu_id,'nav_menu_studs','nav_studs','student');
$('#{{$form}}_tree').tree({
&url:'?t={{'school'|encrypt}}&m={{'graduation'|encrypt}}&a={{'tree'|encrypt}}',
& &onClick:function(node){
&$('#{{$form}}_pid').val(node.id);
& &if(node.text == '毕业流程'){
& & var columnsData = [
& & {{foreach item=data
from=$rsPar key=key}}
{field:{{$key}}+'_note',title:'{{$data}}',width:80,sortable:false},
& & {{/foreach}}
& & var columnsData = [
{field:'note',title:node.text,width:200,sortable:false}
&$('#{{$form}}_grid').datagrid({
url:'?t={{'school'|encrypt}}&m={{'graduation'|encrypt}}&a={{'loading'|encrypt}}&deptid='+node.id,
&columns:[columnsData],
& $(window).resize(function(){
$("#{{$form}}searight").css("height",$("#sealeft").height()-45);
$(".easyui-layout").layout('resize');
$('#{{$form}}_grid').datagrid('resize');
$("#{{$form}}searight").css("height",$("#sealeft").height()-45);
已投稿到:
以上网友发言只代表其个人观点,不代表新浪网的观点或立场。2017年8月 总版技术专家分月排行榜第一
2016年2月 总版技术专家分月排行榜第二2014年2月 总版技术专家分月排行榜第二2013年4月 总版技术专家分月排行榜第二
本帖子已过去太久远了,不再提供回复功能。

我要回帖

更多关于 easyui可编辑datagrid 的文章

 

随机推荐