jQuery MiniUI

标题: 自定义控件能不能被继承 [打印本页]

作者: hk5138 时间: 2014-6-19 11:39:14 标题: 自定义控件能不能被继承

基于TextBoxList扩展了一个自定义的selectmini.extend(mini.ux.AimSelect, mini.TextBoxList,config);
能不能再
mini.extend(mini.ux.AimUserSelect, mini.ux.AimSelect,config);
试了一下貌似管用,但又没有AimSelect的全部功能

作者: felt 时间: 2014-6-19 13:15:47

应该可以的，自己检查一下代码

作者: hk5138 时间: 2014-6-19 14:34:26

本帖最后由 hk5138 于 2014-6-19 14:36 编辑

felt 发表于 2014-6-19 13:15
应该可以的，自己检查一下代码

///-------------Aim AimSelect begin------
mini.ux.AimSelect = function (config) {
mini.ux.AimSelect.superclass.constructor.call(this);
this.initComponents(config);
this.initEvent();
}

mini.extend(mini.ux.AimSelect, mini.TextBoxList, {
uiCls: 'aim-select',
initComponents: function (config) {
      config = config || {};
      //拼音查询,提交路径
      config.url = config.url;

      config.valueField = config.valueField;
      config.textField = config.textField;
      //扩展单选多选属性,目前用valuechanged实现
      config.multiSelect = config.multiSelect == true;

      /*
      *弹出窗口部分配置
      */
      //默认显示小人按钮
      config.showSelBtn = !(config.showSelBtn == false);
      //弹出窗口的按钮的样式
      config.selBtnClass = config.selBtnClass;
      //弹出页面路径
      config.popUrl = config.popUrl;
      //弹出窗口标题
      config.popTitle = config.popTitle || "请选择";
      //弹出窗口宽度
      config.popWidth = config.popWidth || 950;
      //弹出窗口高度
      config.popHeight = config.popHeight || 550;

      //选择及返回类型,预留字段
      config.rtnType = config.rtntype || "array";
      config.selType = config.multiSelect == true ? "multi" : "single";

      //关联字段,
      config.nameField = config.nameField;
      //保留字段
      config.fieldParam = config.fieldParam;

      if (config.showSelBtn) {
         var boxList = this;
         var ul = this.ulEl;
         var jUserBtn = $('<div></div>').addClass(config.selBtnClass);
         jUserBtn.bind("click", function () {
            var url = config.popUrl;
            url = $.combineQueryUrl(url, { rtntype: config.rtnType, seltype: config.selType });
            mini.open({
                  url: url,
                  title: config.popTitle,
                  width: config.popWidth,
                  height: config.popHeight,
                  ondestroy: function (action) {
                     if (action == "ok") {
                        var iframe = this.getIFrameEl();
                        //获取选中、编辑的结果

                        //弹出选择页面必须包含getContentData()供调用
                        var data = iframe.contentWindow.getUsrData();
                        data = mini.clone(data); //必须。克隆数据。
                        if (config.selType == "multi") {
                              var vals = boxList.getValue();
                              var texts = boxList.getText(); //
                              $.each(data, function () {
                                 if (vals.indexOf(this[boxList.valueField]) < 0) {
                                    //筛选已选择的记录
                                    if (vals) {
                                          vals += ",";
                                          texts += ",";
                                    }
                                    vals += this[boxList.valueField];
                                    texts += this[boxList.textField];
                                 }
                              });
                              boxList.setValue(vals);
                              boxList.setText(texts);
                        } else { //单选
                              if (data && data.length > 0) {
                                 boxList.setValue(data[0][boxList.valueField]);
                                 boxList.setText(data[0][boxList.textField]);
                              }
                        }
                     } else if (action == "clear") {
                        boxList.setValue("");
                        boxList.setText("");
                     }
                  }
            });
         });

         $(ul).css("marginRight", "16px").parent().append(jUserBtn);
      }
      this.set(config);

},
initEvent: function () {
      this.on("valuechanged", function (e) {
         var uselect = e.sender;
         var vals = uselect.getValue();
         var texts = uselect.getText();//
         if (!this.multiSelect && vals.indexOf(",") > 0) {
            //控件单选且有多个值
            vals = vals.substr(vals.lastIndexOf(",") + 1);
            texts = texts.substr(texts.lastIndexOf(",") + 1);
            uselect.setValue(vals);
            uselect.setText(texts);
         }
         if (this.nameField && typeof this.nameField == "string") {
            $("#" + this.nameField).val(texts);
         }
         if (this.fieldParam && typeof this.nameField == "string") {
            //
         }
         if (this.afterSelect && typeof this.afterSelect == "function") {
            //扩展选中后的回调函数
            var rtns = new Object();
            rtns.value = vals;
            rtns.text = texts;
            rtns.data = uselect.data;
            this.afterSelect(rtns);
         }

      });
}
});
mini.regClass(mini.ux.AimSelect, "aimselect");
///-------------Aim AimSelect end------

///-------------Aim UserSelect begin-----

mini.ux.AimUserSelect = function (config) {
mini.ux.AimUserSelect.superclass.constructor.call(this);
this.initComponents(config);
}

mini.extend(mini.ux.AimUserSelect, mini.ux.AimSelect, {
uiCls: 'aim-user',
initComponents: function (config) {
      var config = config || {};
      //拼音查询,提交路径
      config.url = config.url || "/commonpages/miniui/data/userdataora.aspx";

      config.valueField = config.valueField || "UserID";
      config.textField = config.textField || "Name";

      config.selBtnClass = config.selBtnClass || "mini-aimuser-btns aimuser-btn-expand";
      //弹出页面路径
      config.popUrl = config.popUrl || "/CommonPages/MiniUI/Select/UsrSelect/UsrSelect.aspx";
      config.popTitle = config.popTitle || "人员选择";
      this.set(config);
}
});
mini.regClass(mini.ux.AimUserSelect, "aimuserselect");

还是不行啊  AimSelect 单独用时可以的,总感觉哪里不对了,

作者: felt 时间: 2014-6-19 15:05:52

hk5138 发表于 2014-6-19 14:34
///-------------Aim AimSelect begin------
mini.ux.AimSelect = function (config) {
mini.ux.AimSe ...

你感觉哪里不对。。。。到底是什么问题

作者: hk5138 时间: 2014-6-19 15:48:36

felt 发表于 2014-6-19 15:05
你感觉哪里不对。。。。到底是什么问题

调试发现压根没有进AimSelect的initComponents(),
是不是不能这么调用啊

作者: felt 时间: 2014-6-19 15:58:14

hk5138 发表于 2014-6-19 15:48
调试发现压根没有进AimSelect的initComponents(),
是不是不能这么调用啊

你不是重写了AimUserSelect的initComponts

欢迎光临 jQuery MiniUI (http://miniui.com/discuss/)