2 flyinbird flyinbird 于 2015.06.19 22:35 提问

请教Extjs 2.0 扩展控件怎么写才能兼容多浏览器

代码如下,只能在IE里使用,火狐等其他浏览器导致表单其他控件不显示
请教指点,应该怎么完善代码,才能让该扩展控件 兼容多浏览器

//RadioList
/* --使用范例
{
xtype:'radiolist',
fieldLabel: '列表',
anchor:'90%',
id:'ListRadio',
store: new Ext.data.SimpleStore({
fields: ['value', 'text'],
data : [['Female', '女孩'],['Male', '男孩']]
}),
valueField : 'value',
displayField : 'text'
}
*/
Ext.form.RadioList = Ext.extend(Ext.form.TextField, {

defaultAutoCreate : {tag: "input", type: "hidden", size: "0",'readonly':'true', autocomplete: "off"},

initComponent : function()
{
    Ext.form.RadioList.superclass.initComponent.call(this);
    if(!this.store)
    {
        this.store = new Ext.data.SimpleStore({
            'id': 0,
            fields: ['value', 'text'],
            data : []
        });
        this.valueField = 'value';
        this.displayField = 'text';
    }

    if(!this.id)
    {
        this.id = Ext.id();
    }
},
onRender : function(ct, position)
{           
    Ext.form.RadioList.superclass.onRender.call(this, ct, position);

    this.initRadioList();
},  

initRadioList :function()
{ 
    var strCSS = (!Ext.isIE) ? 'margin-top:5px' : '';
    var divObj = this.el.dom.parentNode;

    var sd = this.store.data;
    if(sd && this.valueField && this.displayField)
    {
        for(var i=0;i<sd.length;i++)
        {   
            var strid = Ext.id();
            Ext.DomHelper.append(divObj,{tag: 'input',type: 'radio', id: strid, name:this.id, value:sd.items[i].data[this.valueField],style:strCSS},false);
            Ext.DomHelper.append(divObj,{tag: 'label', 'class': 'x-form-cb-label', 'for': strid, html: sd.items[i].data[this.displayField]}, false);          
        }
        if(this.value){
            this.setValue(this.value);
        }
        //加入事件
        var radioArr = this.el.dom.parentNode.getElementsByTagName("INPUT");
        for(var i=0;i<radioArr.length;i++)
        {
            if(radioArr[i].type == "radio")
            {
                radioArr[i].attachEvent('onclick',function(){
                    this.fireEvent('change', this, null, null);
                }.createDelegate(this));
            }
        }
    }      
},  

getValue : function()
{
    if(this.el == null) return "";
    var radioArr = this.el.dom.parentNode.getElementsByTagName("INPUT");
    if(radioArr == null) return "";
    for(var i=0;i<radioArr.length;i++)
    {
        if(radioArr[i].type == "radio" && radioArr[i].checked)
        {
            this.el.dom.value = radioArr[i].value;
            return radioArr[i].value;
        }
    }
    return "";
},

setValue : function(strValue)
{
    if(strValue == null || this.el == null)return;
    var radioArr = this.el.dom.parentNode.getElementsByTagName("INPUT");
    for(var i=0;i<radioArr.length;i++)
    {
        if(radioArr[i].type == "radio" && radioArr[i].value == strValue)
        {
            radioArr[i].checked = true;
            this.el.dom.value = radioArr[i].value;
            break;
        }
    }        
},

validate : function()
{
    if(!this.allowBlank && this.getValue() == "")
        return false;
    else
        return true;
}

});
Ext.reg('radiolist', Ext.form.RadioList);

3个回答

devmiao
devmiao   Ds   Rxr 2015.06.19 23:16
flyinbird
flyinbird   2015.06.21 21:38

感谢回复,这个链接好像不能解决我说的这个问题,还请有Extjs扩展控件经验的指导一下,多谢多谢

flyinbird
flyinbird   2015.06.22 18:26

在线等高人帮忙解答,跪谢

Csdn user default icon
上传中...
上传图片
插入图片