您的位置：首页 > 产品设计 > UI/UE

EasyUI中的combogrid

2017-08-02 14:19 381 查看
<script>

 $(function(){

  $("#cc").combogrid({

   panelWidth:400,

   value:'safds',//缺省值

   idField:"code",

   textField:"name",

   url:"datagrid_data.json",

   columns:[[ 

         {field:'code',title:'Code',width:60}, 

         {field:'name',title:'Name',width:100}, 

         {field:'addr',title:'Address',width:120}, 

         {field:'col4',title:'Col41',width:100} 

      ]]

  });

 });

 //重新加载数据源

 function reload(){

  $('#cc').combogrid('grid').datagrid('reload'); 

 }

 

 //设置select中的值

 function setValue(){

  $("#cc").combogrid("setValue","003");

 }

 //获取下拉列表中选择的值

 function getValue(){

  var val = $('#cc').combogrid('getValue');

  alert(val);

 }

 //禁用组件

 function disable(){

  $('#cc').combogrid('disable');

 }

 //启用组件

 function enable(){

  $('#cc').combogrid('enable');

 }

 //获取选中的表格的数据

 function getGridValue(){

  var grid=$("#cc").combogrid("grid");//获取表格对象

  var row = grid.datagrid('getSelected');//获取行数据

  alert("选择的grid中的数据如下：code:"+row.code+" name:"+row.name+" addr:"+row.addr+" col4:"+row.col4);

 }

 function clear(){

  $("#cc").combogrid("clear"); 

 }

</script>

</head>

<body>

 <h3>combogrid</h3>

    <div style="margin:10px 0;">

  <a href="#" class="easyui-linkbutton" onclick="reload()">Reload</a>

  <a href="#" class="easyui-linkbutton" onclick="setValue()">SetValue</a>

  <a href="#" class="easyui-linkbutton" onclick="getValue()">GetValue</a>

        <a href="#" class="easyui-linkbutton" onclick="getGridValue()">GetGridValue</a>

  <a href="#" class="easyui-linkbutton" onclick="disable()">Disable</a>

  <a href="#" class="easyui-linkbutton" onclick="enable()">Enable</a>

        <a href="#" class="easyui-linkbutton" onclick="clear()">clear</a>

 </div>

 <select id="cc" class="easyui-combogrid"  style="width:250px;"></select>

</body>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航