easyui控件的常用属性

来源:互联网 发布:windows画图如何缩小 编辑:程序博客网 时间:2024/05/21 18:40
datagrid (数据表格)


    $("#tg").datagrid({
url:"TaskList",//请求的地址
fit: false, //当true时设置他的大小以适合他的父容器
singleSelect: true, //设置为“True”则只允许选择一行
fitColumns: true,//为“true”则自动 展开/收缩 列的大小,为了自动填充Grid的宽度,防止出现水平滚动条。 false
toolbar:'#tb',//工具条
nowrap : false,//设置为true,当数据长度超出列宽时将会自动截取             
striped : true,//设置为true将交替显示行背景。
collapsible : true,//显示可折叠按钮 
loadMsg : '数据装载中......',            
rownumbers : true,//行数 ,
sortOrder:'asc'//定义列的排序方式 asc(升序)  desc (降序)
  });


var rowData = $('#tg').datagrid('getData').rows[index];//很据唯一值查询datagrid数据


$("#tg").datagrid('reload'); //数据的重新加载




tree(树)
  $('#tree').tree({
url:'taskNameList',//请求的地址
animate:true,//定义当节点展开或折叠时是否显示动画效果
checkbox:true,//显示复选框
cascadeCheck:true,//是否可以级联选择
lines:true,//显示节点前的线
onLoadSuccess:function(){  //数据加载成功的事件
 $('#tree').find('span.tree-checkbox').unbind().click(function(){
      return false;      //禁用复选框
 });
   }
});
 if($('#tree').tree('isLeaf',nodes.target)){}  //判断有没有叶子节点




dialog (对话框)
  $('#dlg').dialog('open').dialog('setTitle','选择人员');  //打开对话框并设置标题


combobox (下拉列表)
$('#cmb').combobox({
url:'queryProceduresList',   //请求的地址
valueField:'id',
textField:'name',
editable:false,         //禁用下拉列表
onLoadSuccess:function(){},  //数据加载成功的事件
   onSelect: function (n,o) {}   //数据被选中的事件
});
 <input class="easyui-combobox" id="type"  style="width:300px;height:25px"/>


ajax (异步请求)


      $.ajax({
 type:"post",         //提交请求的方式 
 dataType:"json",    //数据的类型
 data:{},            // 需要传递的数据
 url:"insertTask",  //提交请求的地址
 async:false,       // false(同步)  true(异步)    默认是true
   success:function(date)
 {
     
 }
      });


linkbutton(按钮)
<a href="javascript:void(0)" id="cancel" class="easyui-linkbutton" onclick="" data-options="iconCls:'icon-cancel',plain:true">取消</a>
<a href="javascript:void(0)" id="save"   class="easyui-linkbutton" onclick="" data-options="iconCls:'icon-ok',plain:true">保存</a>
<a href="javascript:void(0)" id="edit"   class="easyui-linkbutton" onclick="" data-options="iconCls:'icon-ok',plain:true">编辑</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-redo" plain="true" onclick="">撤销</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="">新建</a>


textbox (文本框)
   <input class="easyui-textbox" id="url"  style="width:300px;height:25px"  data-options="icons: [{iconCls:'icon-remove', handler: function(e){ $(e.data.target).textbox('clear'); } }]"/>
0 0
原创粉丝点击