• 关于EasyUI datagrid editor combogrid搜索框的实现


    首先需要datagrid editor对combogrid的扩展,这个是别人实现的:

    $.extend($.fn.datagrid.defaults.editors, {
    combogrid: {
    init: function (container, options) {
    var input = $('<input type="text" class="datagrid-editable-input">').appendTo(container);
    input.combogrid(options);
    return input;
    },
    destroy: function (target) {
    $(target).combogrid('destroy');
    },
    getValue: function (target) {
    return $(target).combogrid('getValue');
    },
    setValue: function (target, value) {
    $(target).combogrid('setValue', value);
    },
    resize: function (target, width) {
    $(target).combogrid('resize', width);
    }
    }
    });

    然后将搜索框写在div里面

    <div id="Marketer_ID_Member_bar">
    <table cellpadding="0" cellspacing="0" style=" 100%;">
    <tr>
    <td style="text-align: right; padding-right: 15px">
    <input id="userName_Member" placeholder="姓名/用户名" style=" 100px; border: 0;" />
    <input type="button" value="查询" onclick="sy.memberInfo.userSearch_Member();" />
    </td>
    </tr>
    </table>
    </div>

    通过toolbar: "#Marketer_ID_Member_bar"来绑定

    下面肉戏来了,按照我们在别的地方应用combogrid的做法,具体的搜索方法sy.memberInfo.userSearch_Member里面是这样的:

    $('#Marketer_ID_Member').combogrid('grid').datagrid('options').queryParams.Name = $("#userName_Member").val();
    $('#Marketer_ID_Member').combogrid('grid').datagrid('reload');

    然而,在editor里面没有明确的id用来寻找元素,此时第一反应是自己加一个ID行不行,于是我尝试给editor加一个属性“id”,然并卵。

    接下来尝试在combogrid加载完成的时候通过Marketer_ID_Member_bar来关联找到它的父级(思路是它是作为combogrid的toolbar,通过它应该能找到combogrid)并赋值id,结果能赋值成功,但是Marketer_ID_Member_bar的父级并不是combogrid,失败。

    此时想到去看看别的地方使用combogrid的情况,最终发现,如果我通过$('#txtInputID').combogrid({});把一个input转化成combogrid,此input的class会被变成easyui-validatebox combogrid-f combo-f validatebox-text,通过对比,发现在editor使用的时候,该列的输入框的样式是:datagrid-editable-input combogrid-f combo-f,

    这应该就是正主了,同样不方便设置id,于是我们使用样式选择器,所以最终sy.memberInfo.userSearch_Member方法里是这样的:

    $('.combogrid-f').combogrid('grid').datagrid('options').queryParams.Name = $("#userName_Member").val();
    $('.combogrid-f').combogrid('grid').datagrid('reload');

    也是够曲折的,前面开发的时候稍微研究了下没有解决好就没理它,因为还有一个办法可以避过,就是不使用editor,通过弹出框来编辑,也就不是很着急,今天稍微闲一点,又来看看,最终找到个能用的方案。

  • 相关阅读:
    打印机共享为什么老是出现“操作无法完成(错误 0X00000709)。再次检查打印机名称、并确保打印机连接网络
    给UITextField设置头或尾空白
    Objective-C中的关联(objc_setAssociatedObject,objc_getAssociatedObject,objc_removeAssociatedObjects)
    定时器在多线程中的使用
    block知识点
    UIViewController新方法的使用(transitionFromViewController:toViewController:duration:options:animations:completion:)
    NSMutableAttributedString 的使用方法,设置格式
    statusbar的颜色设置
    获取图片的缩略图
    彻底理解position与anchorPoint
  • 原文地址:https://www.cnblogs.com/chimeile/p/EasyUI.html
Copyright © 2020-2023  润新知