Ajax五级联动篇

 // 单行替换  页面增加行
  function addPurchaseDetailTiHuan(parameter,index,id) { 

    var xiugaibutton=document.getElementById("xiugaibuttona"+index).value;
    var tuihuibutton=document.getElementById("tuihuibuttona"+index).value;
    var tongguobutton=document.getElementById("tongguobuttona"+index).value;
    var zigoubutton=document.getElementById("zigoubuttona"+index).value;
     
       if(document.getElementById("tihuanbuttona"+index).value==0){
        if(xiugaibutton==1 || tuihuibutton==1 || tongguobutton==1 || zigoubutton==1){
         return;
        }
     <@compress single_line = true>
      var purchaseTrHtml =
      '
       <tr id="first'+index+'" bgcolor= "#FFCCCC">
       
        <th>
           一级分类:<select id="first0'+index+'"   name="midbusinessParameterList[0].prdt_first_type"  class="formText optionText midbusinessParameterListOptionText"   style="width:95px;">
              </select>
        </th>
        <th>
          二级分类: <select id="second0'+index+'"   name="midbusinessParameterList[0].prdt_second_type"   class="formText optionText midbusinessParameterListOptionText"  style="width:95px;">
              </select>
        </th>
        <th>
          三级分类: <select id="third0'+index+'" name="midbusinessParameterList[0].prdt_third_type"   class="formText optionText midbusinessParameterListOptionText"  style="width:95px;">
              </select> 
        </th>
        <th>
          商品: <select id="fourth0'+index+'" name="midbusinessParameterList[0].prdt_fourth_type"   class="formText optionText midbusinessParameterListOptionText"  style="width:95px;">
              </select> 
        </th>
        
        <th>
          货品: <select id="fifth0'+index+'" name="midbusinessParameterList[0].prdt_fourth_type"   class="formText optionText midbusinessParameterListOptionText"  style="width:95px;">
              </select> 
        </th>
       
       </tr>
      <tr id="secod'+index+'" bgcolor= "#FFCCCC">  

        <th colspan=1>
         <span>审批状态:</span>
         <input type="text" readonly="readonly" id="interim_sts'+index+'" name="" value="替换"   style="width:70px;"/>
        </th>
        <th colspan=1>
         <span>商品编号:</span>
         <input  readonly="readonly" type="text"  name="" οnclick="goodSnx(this.value,'+index+')"  id="ls_goodsSn'+index+'" class="formText goodsAttributeListOrderList"     style="width:50px;"/>
        </th>
        <th colspan=1>
         <span>商品货号:</span>
         <input readonly="readonly"  type="text" disabled="true" name=""  id="ls_productSn'+index+'" class="formText goodsAttributeListOrderList"  style="width:50px;"/>
        </th>
        <th colspan=1>
         <span>修改价格:</span>
         <input type="checkbox"  name="" id="heBing'+index+'" class="formText goodsAttributeListOrderList"  value="0" οnclick="buHeBing('+index+')"   style="width:30px;"/>
        </th>
        <th colspan=1>
         <span>单价(元):</span>
         <input type="text" name="" id="ls_price'+index+'" onChange="quanys(this,'+index+')" class="formText goodsAttributeListOrderList" style="width:50px;" disabled/>
        </th>
        <th colspan=1>
         <span>附加费(元):</span>
         <input type="text" name="" disabled="true" id="ls_cost'+index+'" class="formText goodsAttributeListOrderList" style="width:50px;"/>
        </th>  
        <th colspan=1>
         <span>数量:</span>
         <input type="text" name="" id="ls_quantity'+index+'" class="formText goodsAttributeListOrderList" onChange="quanyym(this,'+index+')" style="width:110px;"/>
        </th>     
        <th colspan=2>
         <span >原因:</span>
         <input type="text" name="" id="reason'+index+'" class="formText goodsAttributeListOrderList" style="width:150px;" />
        </th>
        <th colspan=1>
         <input  type="button" id="queren'+index+'" class="formButton" οnclick="purchaseDetailTiHuan(this,'+index+')" value="确定" hidefocus style="width:90px;" />
         <input type="button" class="formButton" οnclick="fanhuit(this,'+index+')" value="返回" hidefocus style="width:90px;" />
        </th>
       </tr>
       
       ';
     </@compress>
     $(parameter).parent().parent().after(purchaseTrHtml);
     //显示默认的价格
     $('#ls_price'+index).val($('#price'+index).val());
     $('#ls_cost'+index).val($('#cost'+index).val());
     $('#ls_quantity'+index).val($('#quantity'+index).val());
     var midbusinessParameterIndex = index;
     
     //disabledTrue(index);
     var lscost;
     //获取商品id
     var goodsid;
     var yijiid = "";
    var erjiid = "";
    var sanjiid = "";
    var yijiindex;
          var erjiindex;
          var sanjiindex;
     <#list pager.list as list>
       if(${list_index}==index){
       lscost="${list.cost}";
       goodsid="${list.goodsId}";
       }
     </#list>
       //获取分类ID
     var categoryid="";
     $.ajax({
     url: "${ctx}/goodsCategory/getGoodsCategoryId",
     data: {'goodsid': goodsid},
     type: "POST",
     dataType: "json",
     async: false,
     cache: false,
     beforeSend: function() {
     },
     success: function(data) {
      categoryid=data.categoryid;
      yijiid=data.yijiid;
        erjiid=data.erjiid;
     sanjiid=data.sanjiid;
     yijiindex=data.yijiindex+1;
           erjiindex=data.erjiindex+1;
           sanjiindex=data.sanjiindex+1;
     },
     complete: function() {
     },
     error:function(XMLHttpRequest, textStatus, errorThrown){alert("数据访问失败")}
     });
     var fourthdata;
     //填充默认商品
     $.ajax({
     url: "${ctx}/goods/getGoodsList",
     data: {'id': categoryid},
     type: "POST",
     dataType: "json",
     async: false,
     cache: false,
     beforeSend: function() {
     },
     success: function(data) {
      fourthdata=data;
     },
     complete: function() {
     },
     error:function(){alert("数据访问失败")}
     });
         initSelect2($('#fourth0'+index), fourthdata); 
     //填充结束
     addEventData(midbusinessParameterIndex);
     //添加三级联动
     function addEventData(a){
     var goods;
     var goods1;
        var goods2;
     var secondsgoods;
     var thirdgoods;
     var datagoods;
     var fifthdata;
     var indexs=index;
     var midbusinessParameterIndex=a;
     $.ajax({
     data: {'goodsid': erjiid},
        url: "${ctx}/goodsCategory/getFirstGoodsCategory",
     type: "POST",
     dataType: "json",
     async: false,
     cache: false,
     beforeSend: function() {
     },
     success: function(data) {
     initSelect($('#second0'+midbusinessParameterIndex), data);
      secondsgoods=data;
     },
     complete: function() {
     },
     error:function(){alert("数据访问失败")}
     }  );
     $.ajax({
          data: {'goodsid': sanjiid},
    url: "${ctx}/goodsCategory/getFirstGoodsCategory",
    type: "POST",
    dataType: "json",
    async: false,
    cache: false,
    beforeSend: function() {
    },
    success: function(data) {
    initSelect($('#third0'+midbusinessParameterIndex), data);
    },
    complete: function() {
    },
    error:function(){alert("数据访问失败")}
    });
    
    
    $.ajax({
          data: {'goodsid': yijiid},
    url: "${ctx}/goodsCategory/getFirstGoodsCategory",
    type: "POST",
    dataType: "json",
    async: false,
    cache: false,
    beforeSend: function() {
    },
    success: function(data) {
    initSelect($('#first0'+midbusinessParameterIndex), data);
     goods=data;
    },
    complete: function() {
    },
    error:function(){alert("数据访问失败")}
    });
    //默认选中
    $('#first0'+midbusinessParameterIndex).get(0).options[yijiindex].selected=true;
    $('#second0'+midbusinessParameterIndex).get(0).options[erjiindex].selected=true;
    $('#third0'+midbusinessParameterIndex).get(0).options[sanjiindex].selected=true;
    
     $('#first0'+midbusinessParameterIndex).change(function() {  
     if($('#first0'+midbusinessParameterIndex).get(0).selectedIndex=="0"){
     return;
     }
     var sltId = $(this).val();  
     var idVal = $(this).attr("id");
     var checkIndex=$('#first0'+midbusinessParameterIndex).get(0).selectedIndex; 
     var idValArray = idVal.split("first0");
     initSelect($('#second0'+idValArray[1]), goods[checkIndex-1].children);
     secondsgoods=goods[checkIndex-1].children;
     $('#third0'+index).empty();  
     $('#fourth0'+index).empty();
     $('#fifth0'+index).empty();
    });
     $('#second0'+midbusinessParameterIndex).change(function() { 
     if($('#second0'+midbusinessParameterIndex).get(0).selectedIndex=="0"){
        return;
          }
     var sltId = $(this).val(); 
     var idVal = $(this).attr("id");
     var idValArray = idVal.split("second0");
     var checkIndex2=$('#second0'+midbusinessParameterIndex).get(0).selectedIndex;
        initSelect($('#third0'+index), secondsgoods[checkIndex2-1].children);
        thirdgoods=secondsgoods[checkIndex2-1].children;
        $('#fourth0'+index).empty();
         $('#fifth0'+index).empty();   
      });
     $('#third0'+midbusinessParameterIndex).change(function() {
     if($('#third0'+midbusinessParameterIndex).get(0).selectedIndex=="0"){
        return;
          }
     var sltId = $(this).val(); 
     var idVal = $(this).attr("id");
     var idValArray = idVal.split("third0");
     var checkIndex3=$('#third0'+midbusinessParameterIndex).get(0).selectedIndex-1;
       $.ajax({
     url: "${ctx}/goods/getGoodsList",
     data: {'id': sltId},
     type: "POST",
     dataType: "json",
     async: false,
     cache: false,
     beforeSend: function() {
     },
     success: function(data) {
      fourthdata=data;
     },
     complete: function() {
     },
     error:function(){alert("数据访问失败")}
     });
       $('#fourth0'+index).empty();
           initSelect2($('#fourth0'+index), fourthdata); 
            $('#fifth0'+index).empty();
         
      });
     //第四级级联
     $('#fourth0'+midbusinessParameterIndex).change(function() {
     if($('#fourth0'+midbusinessParameterIndex).get(0).selectedIndex=="0"){
        return;
          }
     var sltId = $(this).val(); 
     var idVal = $(this).attr("id");
     var idValArray = idVal.split("fourth0");
     var checkIndex4=$('#fourth0'+midbusinessParameterIndex).get(0).selectedIndex-1;
      $.ajax({
     url: "${ctx}/product/getProductsByid",
     data: {'id': sltId},
     type: "POST",
     dataType: "json",
     async: false,
     cache: false,
     beforeSend: function() {
     },
     success: function(data) {
      initSelect3($('#fifth0'+index), data);
      fifthdata=data;
     },
     complete: function() {
     },
     error:function(){alert("数据访问失败")}
     });
     //显示商品编号、价格
     var lsbl="ls_goodsSn"+indexs
     var lsprice = "ls_price"+indexs
     document.getElementById(lsbl).value=fourthdata[checkIndex4].goodsSn;
     document.getElementById(lsprice).value=fourthdata[checkIndex4].price;
     if(sltId!='' || sltId!=null){
     document.getElementById("goodsIda").value=sltId;}
     
     });
    
    
    //第五级级联
    $('#fifth0'+midbusinessParameterIndex).change(function() {
     if($('#fifth0'+midbusinessParameterIndex).get(0).selectedIndex=="0"){
        return;
          }
     var sltId = $(this).val(); 
     var idVal = $(this).attr("id");
     var idValArray = idVal.split("fourth0");
     var checkIndex4=$('#fifth0'+midbusinessParameterIndex).get(0).selectedIndex-1;
     //显示商品编号
     var lsbl="ls_productSn"+indexs
     document.getElementById(lsbl).value=fifthdata[checkIndex4].productSn
        });
      };
       function initSelect(category, data) {   
     category.empty(); 
     category.append("<option value=''>请选择....</option>");
     for(var i in data){
      
      category.append("<option value='"+ data[i].id +"'>"+ data[i].text +"</option>");
     }
     
     };
    
    
     function initSelect2(category, data) {   
     category.empty(); 
     category.append("<option value=''>请选择....</option>");
     for(var i in data){
      
      category.append("<option value='"+ data[i].id +"'>"+ data[i].name +"</option>");
     }
     
    };
    
     function initSelect3(category, data) {   
     category.empty(); 
     category.append("<option value=''>请选择....</option>");
     for(var i in data){
      category.append("<option value='"+ data[i].id +"'>"+ data[i].productSn +"</option>");
     }
     
    };
     
    //添加三级联动结束
    document.getElementById("tihuanbuttona"+index).value=1;
       } 
   
   };