弹出面板支持多选（bug)

chen_m2

期望效果：弹出面板支持多选。
实际效果：出现check按钮，但是不支持多选，如图

代码如下：
<!--用户选择面板-->
    <script src="UsesWindow.js" type="text/javascript"></script>
UsersWindow = function () {
    UsersWindow.superclass.constructor.call(this);
    this.initControls();
    this.initEvents();
}
mini.extend(UsersWindow, mini.Window, {
    url: "",
    keyField: "key",
    multiSelect:true,
    width: 550,
    //height: 305,
    showModal: true,
    title: "选择用户",
    bodyStyle: "padding:0;background:#eee;",
    initControls: function () {
        var bodyEl = this.getBodyEl();
        //顶部搜索
        var topHtml =
            '<div style="padding:5px;text-align:center;">'
                + '<span>姓名：</span>    '
                + '<input name="keyText" class="mini-textbox" style="width:160px;"/> '
                + '<a name="searchBtn" class="mini-button">查找</a>       '
            + '</div>';
        jQuery(bodyEl).append(topHtml);
        //分页表格
        this.grid = new mini.DataGrid();
        this.grid.set({
            style: "width: 100%;height: 200px",
            borderStyle: "border-left:0;border-right:0;",
            columns: [
                { type: "checkcolumn", header: "#", headerAlign: "center" },
                { header: "帐号", field: "UserName" },
                { header: "姓名", field: "UserFullName" }
            ]
        });
        this.grid.setUrl(this.url);
        this.grid.render(bodyEl);
        //底部按钮
        var footerHtml =
            '<div style="padding:8px;text-align:center;">'
                + '<a name="okBtn" class="mini-button" style="width:60px;">确定</a>       '
                + '<a name="cancelBtn" class="mini-button" style="width:60px;margin-left:20px;">取消</a>       '
            + '</div>';
        jQuery(bodyEl).append(footerHtml);
        mini.parse(this.el);
        //组件对象
        this.okBtn = mini.getbyName("okBtn", this);
        this.cancelBtn = mini.getbyName("cancelBtn", this);
        this.searchBtn = mini.getbyName("searchBtn", this);
        this.keyText = mini.getbyName("keyText", this);
    },
    initEvents: function () {
        this.searchBtn.on("click", function (e) {
            var key = this.keyText.getValue();
            this.search(key);
        }, this);
        this.keyText.on("enter", function (e) {
            var key = this.keyText.getValue();
            this.search(key);
        }, this);
        /////////////////////////////////////
        this.okBtn.on("click", function (e) {
            var ret = true;
            if (this.callback) ret = this.callback('ok');
            if (ret !== false) {
                this.hide();
            }
        }, this);
        this.cancelBtn.on("click", function (e) {
            var ret = true;
            if (this.callback) ret = this.callback('cancel');
            if (ret !== false) {
                this.hide();
            }
        }, this);
        this.on("closableclick", function (e) {
            e.cancel = true;
            var ret = true;
            if (this.callback) ret = this.callback('close');
            if (ret !== false) {
                this.hide();
            }
        }, this);
    },
    setUrl: function (value) {
        this.url = value;
        this.grid.setUrl(value);
    },
    setKeyField: function (value) {
        this.keyField = value;
    },
    search: function (key) {
        var args = {};
        args[this.keyField] = key;
        this.grid.load(args);
    },
    setData: function (data, callback) {
        this.callback = callback;
    },
    getData: function () {
        var row = this.grid.getSelected();
        return row;
    }
});

chen_m2

自己顶，原因找到了。multiSelect: true,写错地方了。


UsersWindow = function () {
    UsersWindow.superclass.constructor.call(this);
    this.initControls();
    this.initEvents();
}
mini.extend(UsersWindow, mini.Window, {
    url: "",
    keyField: "key",
   
    width: 550,
    //height: 305,
    showModal: true,
    title: "选择用户",
    bodyStyle: "padding:0;background:#eee;",
    initControls: function () {
        var bodyEl = this.getBodyEl();

        //顶部搜索
        var topHtml =
            '<div style="padding:5px;text-align:center;">'
                + '<span>姓名：</span>    '
                + '<input name="keyText" class="mini-textbox" style="width:160px;"/> '
                + '<a name="searchBtn" class="mini-button">查找</a>       '
            + '</div>';
        jQuery(bodyEl).append(topHtml);

        //分页表格
        this.grid = new mini.DataGrid();
        this.grid.set({
            style: "width: 100%;height: 200px",
            borderStyle: "border-left:0;border-right:0;",
            multiSelect: true,
            columns: [
                { type: "checkcolumn", header: "#", headerAlign: "center" },
                { header: "帐号", field: "UserName" },
                { header: "姓名", field: "UserFullName" }
            ]
        });
        this.grid.setUrl(this.url);
        this.grid.render(bodyEl);

        //底部按钮
        var footerHtml =
            '<div style="padding:8px;text-align:center;">'
                + '<a name="okBtn" class="mini-button" style="width:60px;">确定</a>       '
                + '<a name="cancelBtn" class="mini-button" style="width:60px;margin-left:20px;">取消</a>       '
            + '</div>';
        jQuery(bodyEl).append(footerHtml);

        mini.parse(this.el);

        //组件对象
        this.okBtn = mini.getbyName("okBtn", this);
        this.cancelBtn = mini.getbyName("cancelBtn", this);
        this.searchBtn = mini.getbyName("searchBtn", this);
        this.keyText = mini.getbyName("keyText", this);
    },
    initEvents: function () {
        this.searchBtn.on("click", function (e) {
            var key = this.keyText.getValue();
            this.search(key);
        }, this);
        this.keyText.on("enter", function (e) {
            var key = this.keyText.getValue();
            this.search(key);
        }, this);

        /////////////////////////////////////
        this.okBtn.on("click", function (e) {
            var ret = true;
            if (this.callback) ret = this.callback('ok');
            if (ret !== false) {
                this.hide();
            }
        }, this);
        this.cancelBtn.on("click", function (e) {
            var ret = true;
            if (this.callback) ret = this.callback('cancel');
            if (ret !== false) {
                this.hide();
            }
        }, this);
        this.on("closableclick", function (e) {
            e.cancel = true;
            var ret = true;
            if (this.callback) ret = this.callback('close');
            if (ret !== false) {
                this.hide();
            }
        }, this);
    },
    setUrl: function (value) {
        this.url = value;
        this.grid.setUrl(value);
    },
    setKeyField: function (value) {
        this.keyField = value;
    },
    search: function (key) {
        var args = {};
        args[this.keyField] = key;
        this.grid.load(args);
    },
    setData: function (data, callback) {
        this.callback = callback;
    },
    getData: function () {
        var row = this.grid.getSelected();
        return row;
    }
});

fcrong

不错。

969844859

你好
      请问：
  
       ①、UsersWindow = function () {   
               }

       ②、UsersWindow.superclass.constructor.call(this);

       ③、mini.extend();

       ④、search: function (key) {}

       这四个各是什么意思啊？

969844859

fcrong 发表于 2012-3-6 10:31
不错。

弹出面板必须用 js写么？能否用html构建，然后显示弹出？

xiwa

想问下楼主，Gird编辑的时候ButtonEdit怎么显示值的？

factory

xiwa 发表于 2012-4-9 15:51
想问下楼主，Gird编辑的时候ButtonEdit怎么显示值的？

你可以通过ButtonEdit的setValue来设置值,通过setText来设置文本内容

fcrong

969844859 发表于 2012-4-9 15:27
弹出面板必须用 js写么？能否用html构建，然后显示弹出？

弹出面板可以用HTML来写，也可以用单独页面。
具体可以参考：
HTML实现方式：http://miniui.com/demo/#src=datagrid/popupeditform.html
子页面弹出方式：http://miniui.com/demo/#src=buttonedit/openpage.html

969844859

fcrong 发表于 2012-4-9 22:23
弹出面板可以用HTML来写，也可以用单独页面。
具体可以参考：
HTML实现方式：http://miniui.com/demo/#sr ...

恩 好的 谢谢。