项目需求:
一、 调整原有“补货费用余额”字段调整为“补货费用余额(SBU)”,新增“补货费用余额(总部)”字段 备注:字段展示金额为总金额,后台按表单号对应金额 创建补货订单后,必须勾选费用池 才能添加产品 只能单选
实现:利用checkbox实现单选功能,不选择状态,隐藏添加产品按钮即可:
前台展示部分代码:
<#if position.org?? && orderForm.orderTypeCode == "CUST" && (!orderForm.giftType?? || orderForm.giftType == "1")> <tr> <td class="right" width="120px;">补货费用余额(SBU):</td> <td class="left"> ${bfee!'0'} 元 </td> <td class="right" width="120px;">补货费用余额(总部):</td> <td class="left"> ${bfee!'0'} 元 </td> </tr> </table> <div style="height:2px;line-height:2px;"> </div> <!-- 产品信息 --> <div> <div class="right" id="addProduct" style="margin-bottom: 5px;"> <#if bFlag=="N"> <input type="button" class="m-btn" id="selectProduct" value=" 添加产品 " /> </#if> </div> <table id='Products'></table> </div> <div style="height:20px;line-height:20px;"> </div> <#else> <tr> <td class="right" width="120px;">补货费用余额(SBU):</td> <td class="left"> ${bfee!'0'} 元 <input type="checkbox" class="cbox" id="bfee_sbu" value="${bfee!''}" name="bfee_sbu" /> </td> <td class="right" width="120px;">补货费用余额(总部):</td> <td class="left"> ${bfee!'0'} 元 <input type="checkbox" class="cbox" id="bfee_zb" value="${bfeee!''}" name="bfee_zb"/> </td> </tr> </table> <div> <div class="right" id="addProduct" style="margin-bottom: 5px;display:none;"> <#if bFlag=="N"> <input type="button" class="m-btn" id="selectProduct" value=" 添加产品 " /> </#if> </div> <table id='Products'></table> </div> <div style="height:20px;line-height:20px;"> </div> </#if>JS控制部分:
$(document).ready(function(){ $(".cbox").click(function(){ if($("#bfee_sbu").prop("checked")||$("#bfee_zb").prop("checked")){ document.getElementById('addProduct').style.display="block"; if($(this).prop("checked")) { $(":checkbox[type=checkbox]").removeAttr("checked"); $(this).prop("checked","true"); }else{ $(this).prop("checked","false").siblings().prop("checked","false"); } }else{ document.getElementById('addProduct').style.display="none"; } }); });大致就是这些 主要看js中控制。。。。