chaliezhou
2011-10-13 23:34 阅读 500

ExtJS3.2,如何为Checkbox的未选中状态赋值?

昨天的问题依然没有得到解决……

大家都知道,ExtJS的Checkbox在未选中状态是没有任何值可以传递的,只有在选中状态时后台才可以获得一个"on"的值。
我这两天尝试使用hidden域来为checkbox的未选中状态赋予一个false值以便传递到后台来进行逻辑处理,但是后台依然报“未将实例引用设置到对象实例”的错误。

请教大家是如何处理checkbox未选中状态赋值问题的?

我的错误代码如下:

[code="js"]
{ xtype: 'hidden', name: 'splSKUCheckbox', inputValue: "false" },
{ xtype: 'checkbox', id: 'splSKUCheckbox', name: 'splSKUCheckbox', fieldLabel: '*装箱',
listeners: {
check: function(obj, checked) {
if (checked) {
Ext.getCmp('skulength').setDisabled(false);
Ext.getCmp('skuwidth').setDisabled(false);
Ext.getCmp('skuheight').setDisabled(false);
}
else {
Ext.getCmp('skulength').setDisabled(true);
Ext.getCmp('skuwidth').setDisabled(true);
Ext.getCmp('skuheight').setDisabled(true);
}
}
}
},
{ xtype: 'numberfield', id: 'skulength', name: 'splSKULength', disabled: true, fieldLabel: '长度', emptyText: '000.000' },
{ xtype: 'numberfield', id: 'skuwidth', name: 'splSKUWidth', disabled: true, fieldLabel: '宽度', emptyText: '000.000' },
{ xtype: 'numberfield', id: 'skuheight', name: 'splSKUHeight', disabled: true, fieldLabel: '高度', emptyText: '000.000' }
[/code]

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享

3条回答 默认 最新

  • 已采纳
    weixin_42467478 weixin_42467478 2011-10-14 11:07

    不需要用隐藏域 可以在提交表单的时候 获取值var splSKUCheckbox=form.findField("splSKUCheckbox").getValue();

    然后提交参数增加params:{splSKUCheckbox:splSKUCheckbox},

    点赞 评论 复制链接分享
  • cyrilluce cyrilluce 2011-10-14 11:40

    呵呵,Ext的表单提交还是用的仿html形式,遍历form元素的子节点,找出表单元素,取值生成参数串。这个操作是在Ext.lib.Ajax.serializeForm中做的,所以只能暴力修改(Ext3.2.0):

    [code="js"]
    Ext.override(Ext.lib.Ajax, {
    serializeForm : function(form) {
    var fElements = form.elements || (document.forms[form] || Ext.getDom(form)).elements,
    hasSubmit = false,
    encoder = encodeURIComponent,
    element,
    options,
    name,
    val,
    data = '',
    type;

        Ext.each(fElements, function(element) {
            name = element.name;
            type = element.type;
    
            if (!element.disabled && name){
                if(/select-(one|multiple)/i.test(type)) {
                    Ext.each(element.options, function(opt) {
                        if (opt.selected) {
                            data += String.format("{0}={1}&", encoder(name), encoder((opt.hasAttribute ? opt.hasAttribute('value') : opt.getAttribute('value') !== null) ? opt.value : opt.text));
                        }
                    });
                } else if(!/file|undefined|reset|button/i.test(type)) {
                        // 去掉radio、checkbox未选的过滤
                        if(/*!(/radio|checkbox/i.test(type) && !element.checked) && */!(type == 'submit' && hasSubmit)){
    
                            data += encoder(name) + '=' + encoder(element.value) + '&';
                            hasSubmit = /submit/i.test(type);
                        }
                }
            }
        });
        return data.substr(0, data.length - 1);
    }
    

    });
    [/code]

    这样改后,未选的值是空串。
    当然你也可以改为自己的值:

    [code="js"]
    // 去掉radio、checkbox未选的过滤
    if(/*!(/radio|checkbox/i.test(type) && !element.checked) && */!(type == 'submit' && hasSubmit)){

                            data += encoder(name) + '=' + encoder(element.value) + '&';
                            hasSubmit = /submit/i.test(type);
                        }else if(/radio|checkbox/i.test(type) && !element.checked){
                            data += encoder(name) + '=false&';
                        }
    

    [/code]

    点赞 评论 复制链接分享
  • cyrilluce cyrilluce 2011-10-14 11:44

    哦。。。上面的第二段代码有些问题,应该调整下顺序:
    [code="js"]
    // 去掉radio、checkbox未选的过滤
    if(/radio|checkbox/i.test(type) && !element.checked){
    data += encoder(name) + '=false&';
    }else if(/*!(/radio|checkbox/i.test(type) && !element.checked) && */!(type == 'submit' && hasSubmit)){

                            data += encoder(name) + '=' + encoder(element.value) + '&';
                            hasSubmit = /submit/i.test(type);
                        }
    

    [/code]

    代码没实测,可能有些问题,应该都好解决

    点赞 评论 复制链接分享

相关推荐