当前位置: 代码迷 >> Web前端 >> 处置同类多个checkbox是否选中
  详细解决方案

处置同类多个checkbox是否选中

热度:131   发布时间:2012-12-25 16:18:28.0
处理同类多个checkbox是否选中

该方法是采用2的幂相求和的方式,用该整数结果来记录同一个类的多个checkbox的选中状态,读取信息,再分解该整数,从而得出哪个checkbox是否选中了!

?

前台js:

?

Ext.onReady(function(){

var win = new Ext.Window({

title:'testForm',

heigth:400,

width:550,

buttonAlign:'center'

});

var hobby1 = new Ext.form.Checkbox({

boxLabel:'足球',

name:'hobby1'

});

var hobby2 = new Ext.form.Checkbox({

boxLabel:'互联网',

name:'hobby2'

});

?

var hobby3 = new Ext.form.Checkbox({

boxLabel:'hobby3',

name:'hobby3'

});

var hobby4 = new Ext.form.Checkbox({

boxLabel:'hobby4',

name:'hobby4'

});

var hobby5 = new Ext.form.Checkbox({

boxLabel:'hobby5',

name:'hobby5'

});

var hobby6 = new Ext.form.Checkbox({

boxLabel:'hobby6',

name:'hobby6'

});

var hobby = new Ext.form.CheckboxGroup({

fieldLabel:'爱好',

items:[hobby1,hobby2,hobby3,hobby4,hobby5,hobby6]

});

var sex = new Ext.form.RadioGroup({

id:'sex',

fieldLabel:'性别',

items:[

{boxLabel:'男',name:'sex',inputValue:'1'},

{boxLabel:'女',name:'sex',inputValue:'2'}

]

})

var formPanel = new Ext.form.FormPanel({

heigth:400,

width:550,

items:[hobby,sex],

labelAlign:'right',

labelWidth:'30'

});

win.add(formPanel);

win.addButton(new Ext.Button({

text:'保存',

handler:function(){

formPanel.getForm().submit({

url:'heminghui.htm?act=insertBaseInfor',

params:{},

success:function(obj,data){

alert('成功');

}

})

}

}));

win.on('afterrender',function(){

Ext.Ajax.request({

url:'heminghui.htm?act=getBaseInfor',

success:function(response){

var data = Ext.decode(response.responseText);

//从data中读取出多个checkbox的状态

for(var i=1;i<=6;i++){

data['hobby'+i] = ((parseInt(data.hobby)&Math.pow(2,i-1))== Math.pow(2,i-1));

}

formPanel.getForm().setValues(data);

}

});

});

win.show();

})

?

?

后台:

信息保存方法:

?

public void insertBaseInfor(HttpServletRequest request,HttpServletResponse response) throws IOException{

String sex = request.getParameter("sex");

int hobby = 0 ;

for(int i=1;i<=6;i++){

//采用2的幂求和的方式记录多个checkbox的选中状态

if("on".equals(request.getParameter("hobby"+i))){

hobby+=Math.pow(2, i-1);

};

}

Map<String,Object> param = new HashMap<String,Object>();

param.put("id", 2);

param.put("sex", sex);

param.put("hobby", hobby);

dao.insertUser(param);

response.getOutputStream().write("{'success':true,'msg':'success'}".getBytes());

}

?

?

信息读取方法:

?

public void getBaseInfor(HttpServletRequest request,HttpServletResponse response) throws IOException{

Map<String,Object> params = new HashMap<String,Object>();

params.put("id", 2);

Map<String,String> list = dao.queryUser(params);

JSONObject obj = JSONObject.fromObject(list);//返回

response.getOutputStream().write(obj.toString().getBytes());

}

?

?

?

?

  相关解决方案