jquery和bootstrap的示例

2025-01-09 技术教程

//A、展示产品参数值：（1）请求数据

//A、展示产品参数值：（1）请求数据functiondisplayProdcutParameterValue(productData){$.ajax({type:"POST",url:"medProductParameterValueAction!list",data:productData,dataType:"json",success:displayMyProdcutParameterValue,error:function(){admin.tipsPanel({titleText:'提示',contentText:'AJAX通信失败！'});}});}

//A、展示产品参数值：（2）对请求返回的参数进行处理

//A、展示产品参数值：（2）对请求返回的参数进行处理functiondisplayMyProdcutParameterValue(result){varboxBodyObject=$('#tab_medProductParameterValue.box-body');boxBodyObject.empty();vartableObject=$('<tableclass="tabletable-bordered"></table>');boxBodyObject.append(tableObject);if(result!=null&&result.total!=null&&result.total>0){varrows=result.rows;varparentId=-1;varisCategory=false;for(vari=0;i<rows.length;i++){varcurrentParam=rows[i];varparentParamId=currentParam.parentParameterId;varparentParamName=currentParam.parentParameterName;varparamName=currentParam.parameterName;varparamValue=currentParam.parameterValue;if(parentId!=parentParamId){isCategory=true;parentId=parentParamId;}else{isCategory=false;}if(isCategory==true){addTrIntoTable(tableObject,parentParamName,paramName,paramValue,isCategory);}addTrIntoTable(tableObject,parentParamName,paramName,paramValue,false);}}//else{//admin.tipsPanel({//titleText:'提示',//contentText:'当前产品似乎未添加任何参数！'//});//}}

//A、展示产品参数值：（3）处理DOM操作，即动态添加<tr>到<table>当中

functionaddTrIntoTable(tableObject,parentParamName,paramName,paramValue,isCategory){vartrObject=$('<tr'+(isCategory?'class="active"':'')+'></tr>');tableObject.append(trObject);if(isCategory==true){varthObject=$('<thcolspan="2">'+parentParamName+'</th>');trObject.append(thObject);}else{vartdObjects=$('<td>'+paramName+'</td><td>'+paramValue+'</td>');trObject.append(tdObjects);}}

//B、编辑产品参数值：（1）请求“参数项”数据

//B、编辑产品参数值：（1）请求“参数项”数据functionrequestAndDisplayProdcutParameter(productData){$.ajax({type:"POST",url:"medProductParameterAction!list",data:productData,dataType:"json",success:displayMyProdcutParameter,error:function(){admin.tipsPanel({titleText:'提示',contentText:'AJAX通信失败！'});}});}

//B、编辑产品参数值：（2）处理“参数项”返回数据和（3）请求“参数值”数据

//B、编辑产品参数值：（2）处理“参数项”返回数据和（3）请求“参数值”数据functiondisplayMyProdcutParameter(result){debugger;varboxBodyObject=$('#medProductParameterForm.box-body');varaccordionObject=$('<divclass="panel-group"id="accordion"></div>');boxBodyObject.append(accordionObject);if(result!=null&&result.total!=null&&result.total>0){varrows=result.rows;for(vari=0;i<rows.length;i++){varparentParam=rows[i];varparentParamId=parentParam.parameterId;varparentParamName=parentParam.parameterName;varparentParamSortId=parentParam.sortId;varchildParams=parentParam.parameters;varisFirst=(i==0)?true:false;addPanelIntoAccordion(accordionObject,parentParamId,parentParamName,parentParamSortId,childParams,isFirst);}varproductData={};productData.queryJson=JSON.stringify({"productId":selectMedProductId,"sortType":"1","isValid":"1"});productData.page=1;productData.rows=999;$.ajax({type:"POST",url:"medProductParameterValueAction!list",data:productData,dataType:"json",success:echoMyProdcutParameterValue,error:function(){admin.tipsPanel({titleText:'提示',contentText:'AJAX通信失败！'});}});$("#medProductParameterModel").modal();}else{admin.tipsPanel({titleText:'提示',contentText:'当前产品似乎未选择产品大类！'});}}

//B、编辑产品参数值：（2-1）处理“参数项”DOM操作

//B、编辑产品参数值：（2-1）处理“参数项”DOM操作functionaddPanelIntoAccordion(accordionObject,parentParamId,parentParamName,parentParamSortId,childParams,isFirst){//varpanelObject=$('<divclass="panelpanel-default"myid="'+parentParamId+'"myname="'+parentParamName+'"mysort="'+parentParamSortId+'"></div>');varpanelHeadingObject=$('<divclass="panel-heading"><h5class="panel-title"><adata-toggle="collapse"data-parent="#accordion"href="#collapse'+parentParamId+'">'+parentParamName+'</a></h5></div>');varpanelCollapseObject=$('<divid="collapse'+parentParamId+'"class="panel-collapsecollapse'+(isFirst?'in':'')+'"></div>');varpanelBodyObject=$('<divclass="panel-body"></div>');accordionObject.append(panelObject);panelObject.append(panelHeadingObject);panelObject.append(panelCollapseObject);panelCollapseObject.append(panelBodyObject);addParamIntoPanelBody(panelBodyObject,childParams);}

//B、编辑产品参数值：（2-2）处理“参数项”DOM操作细节【完结】

functionaddParamIntoPanelBody(panelBodyObject,childParams){if(childParams==undefined||childParams==null||childParams.length<1)return;for(vari=0;i<childParams.length;i++){varcurrentParam=childParams[i];varchildParamId=currentParam.parameterId;varchildParamName=currentParam.parameterName;varchildParamIsSelectable=currentParam.isSelectable;varchildParamSortId=currentParam.sortId;varchildParamValue=currentParam.parameterValue;varoptions={};if(childParamIsSelectable!=0){options=childParamValue.split('|');}varformGroupObject=$('<divclass="form-group"id="formGroup_'+childParamId+'"myid="'+childParamId+'"myname="'+childParamName+'"isselectable="'+childParamIsSelectable+'"mysort="'+childParamSortId+'"></div>');varlableObject=$('<labelclass="col-sm-2control-label">'+childParamName+'</label>');panelBodyObject.append(formGroupObject);formGroupObject.append(lableObject);if(childParamIsSelectable==0){varcontentObject=$('<divclass="col-sm-10"><inputtype="text"class="form-control"name="productName"id="xxxxxx001"/></div>');formGroupObject.append(contentObject);}else{varcheckBoxDivObject=$('<divclass="col-sm-10"></div>');varcheckBoxObject;for(varj=0;j<options.length;j++){//checkBoxObject=$('<span><inputtype="checkbox"value="'+options[j]+j+'"name="youname"id="myid'+j+'"/><labelfor="myid'+j+'">'+options[j]+i+'  '+'</label></span>');checkBoxObject=$('<labelclass="checkbox-inline"><inputtype="checkbox"id="inlineCheckbox1"value="'+options[j]+'">'+options[j]+'</label>');checkBoxDivObject.append(checkBoxObject);}formGroupObject.append(checkBoxDivObject);}}}

//B、编辑产品参数值：（3-1）处理“参数值”返回数据【完结】

//B、编辑产品参数值：（3-1）处理“参数值”返回数据【完结】functionechoMyProdcutParameterValue(result){if(result!=null&&result.total!=null&&result.total>0){varrows=result.rows;for(vari=0;i<rows.length;i++){varcurrentParam=rows[i];varparamId=currentParam.parameterId;varparamValue=currentParam.parameterValue;//FIXME继续处理数据回显debugger;varcurrentGroup=$('#formGroup_'+paramId);//判断：如果没有找到相应的formGroup，则continue。if(currentGroup==undefined||currentGroup==null||currentGroup.size()<1){continue;}varisSelectable=currentGroup.attr('isselectable');if(isSelectable==0){//文本框$('.col-sm-10:text:first',currentGroup).val(paramValue);}elseif(isSelectable==1){//复选框//varcks=$('.col-sm-10:checkbox',currentGroup);//varcheckboxArray=[];//cks.each(function(k,v){//checkboxArray[checkboxArray.length]=$(v);//});////varoptions={};//options=paramValue.split('|');//if(options.length>0&&checkboxArray.length>0){//for(vari=0;i<checkboxArray.length;i++){//varcheckBoxObject=checkboxArray[i];//varcheckValue=checkBoxObject.val();//for(varj=0;j<options.length;j++){//varoptionValue=options[j]//if(checkValue==optionValue){//checkBoxObject.prop("checked",true);//break;//}//}//}////}varoptions={};options=paramValue.split('|');if(options.length>0){for(varj=0;j<options.length;j++){varoptionValue=options[j]varcheckboxObject=$('.col-sm-10:checkbox[value='+optionValue+']',currentGroup);if(checkboxObject==undefined||checkboxObject==null||checkboxObject.size()<1){continue;}checkboxObject.prop("checked",true);}}}else{continue;}}}}

//C、保存产品参数值：

//C、保存产品参数值：functionsaveProductParameterValue(){vardataInit={};varcontentJson="";//1、通过Id为accordion的div找到其内部的所有Paneldebugger;varpanelObjects=$('#accordion.panel-default');varpanelArray=[];panelObjects.each(function(k,v){panelArray[panelArray.length]=$(v);});//2、通过遍历所有Panel获取用户的输入参数，保存于contentJson内for(varpanelIndex=0;panelIndex<panelArray.length;panelIndex++){varcurrentPanel=panelArray[panelIndex];varparentParamId=currentPanel.attr('myid');varparentParamName=currentPanel.attr('myname');varparentParamSort=currentPanel.attr('mysort');console.log(parentParamId+"=="+parentParamName+"=="+parentParamSort);vargroupObjects=$('.form-group',currentPanel);vargroupArray=[];groupObjects.each(function(k,v){groupArray[groupArray.length]=$(v);});for(vargroupIndex=0;groupIndex<groupArray.length;groupIndex++){varcurrentGroup=groupArray[groupIndex];varchildParamId=currentGroup.attr('myid');varchildParamName=currentGroup.attr('myname');varchildParamSort=currentGroup.attr('mysort');varisSelectable=currentGroup.attr('isselectable');varchildParamValue="";if(isSelectable==0){//文本框vartextObject=$('.col-sm-10:text:first',currentGroup);childParamValue=textObject.val();}elseif(isSelectable==1){//复选框varcks=$('.col-sm-10:checkbox:checked',currentGroup);vararr=[];cks.each(function(k,v){arr[arr.length]=$(v).val();//记录选中的value值});if(arr.length>0){for(vari=0;i<arr.length-1;i++){childParamValue+=arr[i]+"|";}childParamValue+=arr[arr.length-1];}}else{continue;//出现这种情况，那就continue吧（略过）}if(childParamValue!=undefined&&childParamValue!=null&&childParamValue!=""){console.log("=="+childParamId+"=="+childParamName+"=="+childParamSort+"=="+isSelectable+"=="+childParamValue);varparamValueJson=JSON.stringify({"productId":selectMedProductId,"parameterId":childParamId,"parameterName":childParamName,"parameterValue":childParamValue,"sortId":childParamSort,"parentParameterId":parentParamId,"parentParameterName":parentParamName,"parentSortId":parentParamSort});contentJson+=paramValueJson+"#@#";}}}//3、将contentJson进一步封闭到dataInit内dataInit.queryJson=JSON.stringify({"productId":selectMedProductId,"contentJson":contentJson});//4、向服务器发送请求，保存数据$.ajax({type:"POST",url:"medProductParameterValueAction!save",data:dataInit,cache:false,success:function(data){if(data=='success'){admin.tipsPanel({titleText:'提示',contentText:'操作成功！'});}else{admin.tipsPanel({titleText:'提示',contentText:'操作失败！'});}$('#medProductParameterForm')[0].reset();$("#medProductParameterModel").modal("hide");},error:function(){admin.tipsPanel({titleText:'提示',contentText:'AJAX请求失败！'});}});}