最近在用 easyUI ,实现高级查询的功能 !简单介绍下功能, 高级查询面板中如下字段 : 参数名称 : 表中所有显示字段的 字段名 
 文字比较 : checkbox 选中,则表示是 String类型 ,如果没选中 ,则是 int 类型 
 比较符号 : 有 包含,大于,小于,等于 
 比较值:    用户输入的值 
 关系 :     这条记录的条件跟下一条的关系 ( or , and )
需求 :      当我点击 文字比较项的 checkbox 的时候(字符比较) ,选中 则比较符号中的select 只有 ( 包含,不包含,等于,不等于)。 如果 checkbox 没有选中(数字比较),则 比较符号项的select 中 显示(大于 ,小于 ,等于 ,大于等于,小于等于)
问题:   页面加载的时候执行 compareFormatter, 将初始化的数据载入 select 中,但是后面 checkbox 的点击事件,无法将 select的数据进行更改 ,请问我如何动态改变 select 中的值 ?
部分代码 ://初始化 
var compares = [
{compareId:'eq',compareName:'等于'},
{compareId:'noteq',compareName:'不等于'},
{compareId:'includes',compareName:'包含'},
{compareId:'notincludes',compareName:'不包含'}

];function compareFormatter(value){
for(var i=0; i<compares.length; i++){
if (compares[i].compareId == value) return compares[i].compareName;
}
return value;
}if($("#ckbox").attr("checked")==true){
compares = new Array();
//字符比较
compares.push({id:'eq',text:'等于'});
compares.push({id:'noteq',text:'不等于'});
compares.push({id:'includes',text:'包含'});
compares.push({id:'notincludes',text:'不包含'});}else{
compares = new Array();
//数字比较
compares.push({id:'eq',text:'等于'});
compares.push({id:'noteq',text:'不等于'});
compares.push({id:'gt',text:'大于'});
compares.push({id:'gtandeq',text:'大于等于'});
compares.push({id:'lt',text:'小于'});
compares.push({id:'ltandeq',text:'小于等于'});}
jsp 页面部分内容 :<table id="tt" style="width:650px;height:250px" iconCls="icon-edit" singleSelect="true" url="">
<thead>
<tr>
<th field="paramName" width="100" align="center" formatter="columnsFormatter" editor="{type:'combobox',options:{valueField:'id',textField:'name',data:columns,required:true}}">参数名称</th>
<th field="status" width="60" align="center" editor="{id:'statusId',type:'checkbox',options:{on:'文字',off:'数字'}}">文字比较</th>
<th field="compareMark" width="80" align="center" formatter="compareFormatter" editor="{type:'combobox',options:{valueField:'compareId',textField:'compareName',data:compares,required:true}}">比较符</th>
<th field="compareValue" width="100" align="center" editor="text">比较值</th>
<th field="relation" width="80"  align="center" formatter="relationFormatter" editor="{type:'combobox',options:{valueField:'relationId',textField:'relationName',data:relations,required:true}}">关系</th>
</tr>
</thead>
</table>
页面效果:

解决方案 »

  1. 更改一处 :if($("#ckbox").attr("checked")==true){
        compares = new Array();
        //字符比较
        compares.push({compareId :'eq',compareName:'等于'});
        compares.push({compareId :'noteq',compareName:'不等于'});
        compares.push({compareId :'includes',compareName:'包含'});
        compares.push({compareId :'notincludes',compareName:'不包含'});}else{
        compares = new Array();
        //数字比较
        compares.push({compareId :'eq',compareName:'等于'});
        compares.push({compareId :'noteq',compareName:'不等于'});
        compares.push({compareId :'gt',compareName:'大于'});
        compares.push({compareId :'gtandeq',compareName:'大于等于'});
        compares.push({compareId :'lt',compareName:'小于'});
        compares.push({compareId :'ltandeq',compareName:'小于等于'});}
      


  2.  你新增后一行后
    获取getChanges修改、新增的记录
    然后你在对他们进行解析
      

  3. 是用jquery么?
    在checkbox的onchange事件中(我不知道这个事件名对不对,忘记了)
    直接控制那个下拉列表中的显示数据
    把不用的移除
    或者你初始化的时候直接初始化两个不同的array
    选中的时候用一个
    不选的时候用一个
    onchange事件来回切换这两个array
      


  4.   使用 easyUI 实现   页面加载的时候,select 的值通过 compareFormatter 加载, 如果我定义 2 个 Array  ,如何将 select的值予以绑定 ?
      


  5.     var compares1 = new Array();
        compares.push({id:'eq',text:'等于'});
        compares.push({id:'noteq',text:'不等于'});
        compares.push({id:'includes',text:'包含'});
        compares.push({id:'notincludes',text:'不包含'});
        
        var compares2 = new Array();
        //数字比较
        compares.push({id:'eq',text:'等于'});
        compares.push({id:'noteq',text:'不等于'});
        compares.push({id:'gt',text:'大于'});
        compares.push({id:'gtandeq',text:'大于等于'});
        compares.push({id:'lt',text:'小于'});
        compares.push({id:'ltandeq',text:'小于等于'});
    关键在下面的代码
    onClickRow:function(rowIndex){

    //........

    var chk = $(".datagrid-row-editing td[field=status] input[type=checkbox]")
    var slt = $(".datagrid-row-editing td[field=compareMark] input")
    if(chk.attr('checked')){
    $(slt).combobox("loadData",compares1);
    }else{
    $(slt).combobox("loadData",compares2);
    }


    }在datagird的onClickRow事件中,找到compareMark的下拉框,根据的状态来设置可选择的数据
      

  6. 你怎么添加的行啊?你用的是 table?
    如果是:
    直接遍历  table.rows 就可以了撒
      


  7. 通过 easyUI  中的 appendRow()方法 添加行 
      

类似问题 »