demo

<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=Shift_JIS">
<title>ビジネスプロセスマネージャー</title>
 <style type="text/css">
  .DataRowsSample {
        background-color: #FFFFFF;
       }
 </style>
<script type=text/javascript>
  function revDetail(){
              this.check = '';
        this.year = '';
           this.month = '';
           this.revenue = '';
           this.stocking = '';
           this.gainingsPrice = '';
     }


 function changePageData(flagId,tableId){ 
   var arrayOfpageData =new Array();
   var yearArray =document.getElementsByName("sales_year");
   var monthArray =document.getElementsByName("sales_month");
      for(var i=0;i<yearArray.length;i++)
       {       
            if(flagId == i){ continue; }
               var pageObj = new revDetail();
            var cheboxValue = eval("document.myform.checkbox_"+i);
         if(cheboxValue.checked){
           pageObj.check = cheboxValue.value;
         }else{
             pageObj.check ='0';
         }     
         pageObj.year = yearArray[i].value;
         pageObj.month = monthArray[i].value;        
      var revenueObj = eval("document.myform.myform_revenue_price_"+i+"_id");
      pageObj.revenue = revenueObj.value;
        var stockingObj = eval("document.myform.myform_stocking_price_"+i+"_id");
      pageObj.stocking = stockingObj.value;     
          var gainingsObj = document.getElementById("gainings_"+i);
          pageObj.gainingsPrice = gainingsObj.innerText;         
            arrayOfpageData[i] = pageObj;         
      }    
         sortData(arrayOfpageData);   
         if(flagId !=-1){
         delChildRow(tableId);
   }else{
         addRevDetailOptionChildItem(tableId,arrayOfpageData);       
      }      
       var yearArray =document.getElementsByName("sales_year");            
    for(var i=0;i<yearArray.length;i++){   
   /*      if(flagId==-1 && yearArray.length-1 ==i){          
          var lastDataIndex = arrayOfpageData.length-1;
        var newPage = arrayOfpageData[lastDataIndex];
        if(newPage.month == 12){
             newPage.year = newPage.year +1;
          newPage.month =1;          
        }
         setValueToWidget(i,newPage); 
       }
       else
       {
          var pageObject = arrayOfpageData[i];      
        setValueToWidget(i,pageObject);  
          }
         */ 
      var pageObject = arrayOfpageData[i];      
   setValueToWidget(i,pageObject);          
    } 
 }

  function compare(p1,p2) { 
      var returnValue = p1.year - p2.year;
   if(returnValue == 0) {
    returnValue = p1.month - p2.month;
   }
   return returnValue;  
  }
   
 function sortData(arrayOfpageData){
  arrayOfpageData.sort(compare);
 }

 function delChildRow(tableId){
    var src= event.srcElement;
    while(src!=null)
    {
     //alert(tableId.rows.length-1);
       if(src.nodeName=="TR"){  
        eval(tableId).deleteRow(tableId.rows.length-1);
        return;
    }
    src=src.parentElement;
    }
 }
  
 function setValueToWidget(i,pageObject){
     var cheboxValue = eval("document.myform.checkbox_"+i);
     cheboxValue.value = pageObject.check;
     var yearArray =document.getElementsByName("sales_year");        
     var monthArray =document.getElementsByName("sales_month");      
  for(var k=0;k<yearArray[i].options.length;k++){
       if(yearArray[i].options(k).value == pageObject.year){
         yearArray[i].options(k).selected =true;         
       }else
       {
         yearArray[i].options(k).selected =false;
       }
  }
  for(var o=0;o<monthArray[i].options.length;o++){
        if(monthArray[i].options(o).value == pageObject.month){
         monthArray[i].options(o).selected =true;
        }else
        {
         monthArray[i].options(o).selected =false;
        }
  }         
  var revenueObj = eval("document.myform.myform_revenue_price_"+i+"_id");
  revenueObj.value = pageObject.revenue;
  var stockingObj = eval("document.myform.myform_stocking_price_"+i+"_id");
  stockingObj.value = pageObject.stocking; 
  var gainingsObj = document.getElementById("gainings_"+i);
   gainingsObj.innerText =  pageObject.gainingsPrice;
   var delObj = document.getElementById("del_"+i);         
   }

   function addRevDetailOptionChildItem(table1,arrayOfpageData){ 
       var row = table1.insertRow(table1.rows.length);
     var index = row.rowIndex;    
  row.className="DataRowsSample";   
  var lastDataIndex = arrayOfpageData.length-1;                
  var newPage = arrayOfpageData[lastDataIndex];     
  if(newPage.month == 12){
   newPage.year = newPage.year +1;
   newPage.month =1;          
  } 
     var col=document.createElement("TD");//検収
  col.align="center";
     col.width ="2%";
  col.innerHTML='<font size="2"><input type=checkbox id='+ index +' name=checkbox_' + index +' value='+newPage.check+' onclick=""></font>';
  row.appendChild(col);
     var col=document.createElement("TD");//売上年
        var fontObj = document.createElement("font");                             
     var mySelect = document.createElement("select");
     var str = "";
     for (var i = 2004; i <= 2010; i++) {     
        var opt = document.createElement("option");            
        opt.value=i+"";      
        opt.text=i+"";
        mySelect.add(opt);
     }
     for (var i = 0; i <mySelect.options.length; i++) {
        var opt = mySelect.options(i);
        if(parseInt(opt.value)==newPage.year){
          opt.selected=true;
        }
    }         
    var monthObj = document.createElement("select");//売上月
    for(var i = 1; i <= 12; i++) {           
        var opt = new  Option(i,i);
        opt.value=i+"";
        opt.text=i+"";
        monthObj.add(opt);     
    } 
    for(var i=0;i<monthObj.options.length;i++){
       var opt = monthObj.options(i);
       if(parseInt(opt.value)==newPage.month){
          opt.selected = true;
       }
    }
    var spanYearObj = document.createElement("span");
    var spanMonthObj = document.createElement("span");          
           fontObj.size ="2";              
           mySelect.style.cssText ="width:58px";
           mySelect.name = "sales_year";
           mySelect.id = index;
           mySelect.onmouseover="";
           mySelect.onchange="";
           mySelect.onkeydown="";
          
           monthObj.style.cssText ="width:43px";
           monthObj.name = "sales_month";
           monthObj.id = index;
           monthObj.onmouseover="";
           monthObj.onchange="";
           monthObj.onkeydown="";
          
           spanYearObj.innerHTML="年";
           spanMonthObj.innerHTML="月";
           col.appendChild(fontObj);
        
     fontObj.appendChild(mySelect);
    
     fontObj.appendChild(spanYearObj);
      fontObj.appendChild(monthObj);
      fontObj.appendChild(spanMonthObj);         
        col.align="center";   
        col.width ="20%"; 
        if(1==2){ return;  }                           
        row.appendChild(col); 
          
      var col=document.createElement("TD");//売上金額
      col.innerHTML='<input type="hidden" name="revenue_price_"'+index+'  value="'+newPage.revenue+'"> ';
      col.innerHTML='<font size="2"><input type="text" id="myform_revenue_price_"'+index+'_id"  maxLength="19" size="20" value="'+newPage.revenue+'" onkeypress=" " onkeyup=" " onblur=""  style="text-align:right;ime-mode:disabled" >  円</font>';
   col.align='right'; 
   row.appendChild(col);
      var col=document.createElement("TD");//仕入CMS
      col.innerHTML='<input type="hidden" name="stocking_price_"'+index+'  value="'+newPage.stocking+'"> ';
      col.innerHTML='<font size="2"><input type="text" id="myform_stocking_price_"'+index+'_id"  maxLength="19" size="20" value="'+newPage.stocking+'" onkeypress=" " onkeyup=" " onblur=""  style="text-align:right;ime-mode:disabled" >  円</font>';
   col.align='right'; 
   row.appendChild(col); 
      var col=document.createElement("TD");//粗利
   col.innerHTML='<font size="2"><span ID=gainings_'+newPage.gainingsPrice+'></span>円</font>';
   col.align='right';
   row.appendChild(col);     
      var col=document.createElement("TD");
      col.innerHTML='<a href="#" id="del_" '+index+'><font size=2>削除</font></a>';
   col.align='center';
   col.width='5%';
   row.appendChild(col); 
   // alert("3");
 }
 function reloadSoft(){ 
   var arrayOfpageData =new Array();
   var yearArray =document.getElementsByName("sales_year");
   var monthArray =document.getElementsByName("sales_month");
      for(var i=0;i<yearArray.length;i++){                    
          var pageObj = new revDetail();
       var cheboxValue = eval("document.myform.checkbox_"+i);
       if(cheboxValue.checked){
       pageObj.check = cheboxValue.value;
       }else{
       pageObj.check ='0';
       }     
       pageObj.year = yearArray[i].value;
       pageObj.month = monthArray[i].value;        
       var revenueObj = eval("document.myform.myform_revenue_price_"+i+"_id");
       pageObj.revenue = revenueObj.value;
       var stockingObj = eval("document.myform.myform_stocking_price_"+i+"_id");
       pageObj.stocking = stockingObj.value;     
        var gainingsObj = document.getElementById("gainings_"+i);
        pageObj.gainingsPrice = gainingsObj.innerText;         
          arrayOfpageData[i] = pageObj;         
      }    
     sortData(arrayOfpageData); 
   }
 </script>
</head>

<body onload="reloadSoft()">
<FORM  name=myform  METHOD="POST"  ACTION="/equuleus/servlet/jp.co.softbrain.wes.sfa.MainServlet">
<table id="revDetailOptionInfoTable" cellspacing=1 cellpadding=1 width="90%" bgcolor="#666666" border=0 align="center" >
<tr>
 <td  height=22 nowrap align="left" valign="bottom" bgcolor="#ffffff" colspan="10">
 <font size="2">【売上金額】</font>
 <INPUT TYPE="button" NAME="sales_price_add_button" VALUE="追加" onclick="changePageData(-1,document.all.revDetailOptionInfoTable)" style="background:#ffffff;font-size:10pt;color:#3300cc;">
 </td>
</tr>
<tr>
 <th align="center" nowrap bgcolor=#ccffcc >
 <font size="2">検収</font>
 </th>
 <th align="center" bgcolor="#ccffcc" nowrap >
 <font size="2">売上年月</font>
 </th>
 <th align="center" nowrap bgcolor="#ccffcc"  >
 <font size="2">売上金額</font>
 </th>
 <th align="center" nowrap bgcolor="#ccffcc" >
 <font size="2">仕入</font>
 </th>
 <th align="center" nowrap bgcolor="#ccffcc"  >
 <font size="2">粗利</font>
 </th>
 <th align="center" nowrap bgcolor="#ccffcc"  >
 <font size="2">削除</font>
 </th>
</tr>
<tr id="200711">
 <td bgcolor="#ffffff" nowrap align="center" width="2%">
 <font size="2">
 <input   type=checkbox id=0 name=checkbox_0 value= onclick="";>
 </font>
 </td>
 <td bgcolor="#ffffff" nowrap align="center"  width="20%">
 <font size="2">
   <select style="width:58px" name="sales_year"   id="0"  onmouseover=""  onchange=""  onkeydown="if(window.event.keyCode != 9) return false;" >
    <option value="2004"  >2004</option>
    <option value="2005"  >2005</option>
    <option value="2006"  >2006</option>
    <option value="2007" selected >2007</option>
    <option value="2008"  >2008</option>
    <option value="2009"  >2009</option>
    <option value="2010"  >2010</option>
    </select>年
    <select style="width:43px" name="sales_month"  id="0"   onmouseover=""  onchange=""  onkeydown="if(window.event.keyCode != 9) return false;" >
    <option value="1" >1</option>
    <option value="2" >2</option>
    <option value="3" >3</option>
    <option value="4" >4</option>
    <option value="5" >5</option>
    <option value="6" >6</option>
    <option value="7" >7</option>
    <option value="8" >8</option>
    <option value="9" >9</option>
    <option value="10" >10</option>
    <option value="11" selected>11</option>
    <option value="12" >12</option>
   </select>月
 </font>
  </td>
<td bgcolor="#ffffff" nowrap align="right"  width="20%">
<input type="hidden"  name="revenue_price_0" value="1333">
<input type="text" id="myform_revenue_price_0_id"  maxLength="19" size="20" value="1333" onkeypress=" checkDoubleChar(event,0);" onkeyup=" modifyDouble(event,'revenue_price_0', 'myform_revenue_price_0_id',15,0);" onblur=" modifyDoubleByCopy('revenue_price_0', 'myform_revenue_price_0_id',15,0);   calculateGainings(this)  "  disabled  style="text-align:right;ime-mode:disabled" >
<font size="2">

</font>
</td>
<td bgcolor="#ffffff" nowrap align="right"  width="20%" style="word-break: break-all">
<input type="hidden"  name="stocking_price_0" value="555">
<input type="text" id="myform_stocking_price_0_id"  maxLength="19" size="20" value="555" onkeypress=" checkDoubleChar(event,0);" onkeyup=" modifyDouble(event,'stocking_price_0', 'myform_stocking_price_0_id',15,0);" onblur=" modifyDoubleByCopy('stocking_price_0', 'myform_stocking_price_0_id',15,0);   calculateGainings(this)  "  disabled  style="text-align:right;ime-mode:disabled" >
<font size="2">

</font>
</td>
<td bgcolor="#ffffff" nowrap align="right"  width="20%" style="word-break: break-all">
<font size="2">
<span ID=gainings_0></span>円</font>
</td>
<td bgcolor="#ffffff" width="5%" align="center">
<a href="#"  id="del_0" name="del"  onclick="javascript:changePageData(0,document.all.revDetailOptionInfoTable)"><font size=2>削除</font></a>
</td>
</tr>
<tr id="200710">
<td bgcolor="#ffffff" nowrap align="center" width="2%">
<font size="2">
<input   checked   type=checkbox id=1 name=checkbox_1 value= onclick="disableByBoxState(this)";>
</font>
</td>
 <td bgcolor="#ffffff" nowrap align="center"  width="20%">
 <font size="2">
   <select style="width:58px" name="sales_year"   id="1"  onmouseover=""  onchange=""  onkeydown="if(window.event.keyCode != 9) return false;" >
    <option value="2004"  >2004</option>
    <option value="2005"  >2005</option>
    <option value="2006"  >2006</option>
    <option value="2007" selected>2007</option>
    <option value="2008"  >2008</option>
    <option value="2009"  >2009</option>
    <option value="2010"  >2010</option>
    </select>年
    <select style="width:43px" name="sales_month"  id="1"   onmouseover=""  onchange=""  onkeydown="if(window.event.keyCode != 9) return false;" >
    <option value="1" >1</option>
    <option value="2" >2</option>
    <option value="3" >3</option>
    <option value="4" >4</option>
    <option value="5" >5</option>
    <option value="6" >6</option>
    <option value="7" >7</option>
    <option value="8" >8</option>
    <option value="9" >9</option>
    <option value="10" selected>10</option>
    <option value="11" >11</option>
    <option value="12" >12</option>
   </select>月
 </font>
  </td>
<td bgcolor="#ffffff" nowrap align="right"  width="20%">
<input type="hidden"  name="revenue_price_1" value="11">
<input type="text" id="myform_revenue_price_1_id"  maxLength="19" size="20" value="11" onkeypress=" checkDoubleChar(event,0);" onkeyup=" modifyDouble(event,'revenue_price_1', 'myform_revenue_price_1_id',15,0);" onblur=" modifyDoubleByCopy('revenue_price_1', 'myform_revenue_price_1_id',15,0);   calculateGainings(this)  "  disabled  style="text-align:right;ime-mode:disabled" >
<font size="2">

</font>
</td>
<td bgcolor="#ffffff" nowrap align="right"  width="20%" style="word-break: break-all">
<input type="hidden"  name="stocking_price_1" value="">
<input type="text" id="myform_stocking_price_1_id"  maxLength="19" size="20" value="" onkeypress=" checkDoubleChar(event,0);" onkeyup=" modifyDouble(event,'stocking_price_1', 'myform_stocking_price_1_id',15,0);" onblur=" modifyDoubleByCopy('stocking_price_1', 'myform_stocking_price_1_id',15,0);   calculateGainings(this)  "  disabled  style="text-align:right;ime-mode:disabled" >
<font size="2">

</font>
</td>
<td bgcolor="#ffffff" nowrap align="right"  width="20%" style="word-break: break-all">
<font size="2">
<span ID=gainings_1></span>

</font>
</td>
<td bgcolor="#ffffff" width="5%" align="center">
<a href="#"  id="del_1" name="del"  onclick="javascript:changePageData(1,document.all.revDetailOptionInfoTable)"><font size=2>削除</font></a>
</td>
</tr>
<tr id="20077">
<td bgcolor="#ffffff" nowrap align="center" width="2%">
<font size="2">
<input   type=checkbox id=2 name=checkbox_2 value= onclick="disableByBoxState(this)";>
</font>
</td>
 <td bgcolor="#ffffff" nowrap align="center"  width="20%">
 <font size="2">
   <select style="width:58px" name="sales_year"   id="2"  onmouseover=""  onchange=""  onkeydown="if(window.event.keyCode != 9) return false;" >
    <option value="2004"  >2004</option>
    <option value="2005"  >2005</option>
    <option value="2006"  >2006</option>
    <option value="2007" selected>2007</option>
    <option value="2008"  >2008</option>
    <option value="2009"  >2009</option>
    <option value="2010"  >2010</option>
    </select>年
    <select style="width:43px" name="sales_month"  id="2"   onmouseover=""  onchange=""  onkeydown="if(window.event.keyCode != 9) return false;" >
    <option value="1" >1</option>
    <option value="2" >2</option>
    <option value="3" >3</option>
    <option value="4" >4</option>
    <option value="5" >5</option>
    <option value="6" >6</option>
    <option value="7" >7</option>
    <option value="8" >8</option>
    <option value="9" >9</option>
    <option value="10" >10</option>
    <option value="11" >11</option>
    <option value="12" selected>12</option>
   </select>月
 </font>
  </td>
<td bgcolor="#ffffff" nowrap align="right"  width="20%">
<input type="hidden"  name="revenue_price_2" value="213">
<input type="text" id="myform_revenue_price_2_id"  maxLength="19" size="20" value="213" onkeypress=" checkDoubleChar(event,0);" onkeyup=" modifyDouble(event,'revenue_price_2', 'myform_revenue_price_2_id',15,0);" onblur=" modifyDoubleByCopy('revenue_price_2', 'myform_revenue_price_2_id',15,0);   calculateGainings(this)  "  disabled  style="text-align:right;ime-mode:disabled" >
<font size="2">

</font>
</td>
<td bgcolor="#ffffff" nowrap align="right"  width="20%" style="word-break: break-all">
<input type="hidden"  name="stocking_price_2" value="">
<input type="text" id="myform_stocking_price_2_id"  maxLength="19" size="20" value="" onkeypress=" checkDoubleChar(event,0);" onkeyup=" modifyDouble(event,'stocking_price_2', 'myform_stocking_price_2_id',15,0);" onblur=" modifyDoubleByCopy('stocking_price_2', 'myform_stocking_price_2_id',15,0);   calculateGainings(this)  "  disabled  style="text-align:right;ime-mode:disabled" >
<font size="2">

</font>
</td>
<td bgcolor="#ffffff" nowrap align="right"  width="20%" style="word-break: break-all">
<font size="2">
<span ID=gainings_2></span>

</font>
</td>
<td bgcolor="#ffffff" width="5%" align="center">
<a href="#"  id="del_2" name="del"  onclick="javascript:changePageData(2,document.all.revDetailOptionInfoTable)"><font size=2>削除</font></a>
</td>
</tr>
<tr id="20076">
<td bgcolor="#ffffff" nowrap align="center" width="2%">
<font size="2">
<input   checked   type=checkbox id=3 name=checkbox_3 value=0 onclick="disableByBoxState(this)";>
</font>
</td>
 <td bgcolor="#ffffff" nowrap align="center"  width="20%">
 <font size="2">
   <select style="width:58px" name="sales_year"   id="3"  onmouseover=""  onchange=""  onkeydown="if(window.event.keyCode != 9) return false;" >
    <option value="2004"  >2004</option>
    <option value="2005"  >2005</option>
    <option value="2006"  >2006</option>
    <option value="2007" selected>2007</option>
    <option value="2008"  >2008</option>
    <option value="2009"  >2009</option>
    <option value="2010"  >2010</option>
    </select>年
    <select style="width:43px" name="sales_month"  id="3"   onmouseover=""  onchange=""  onkeydown="if(window.event.keyCode != 9) return false;" >
    <option value="1" >1</option>
    <option value="2" >2</option>
    <option value="3" >3</option>
    <option value="4" >4</option>
    <option value="5" >5</option>
    <option value="6" selected>6</option>
    <option value="7" >7</option>
    <option value="8" >8</option>
    <option value="9" >9</option>
    <option value="10" >10</option>
    <option value="11" >11</option>
    <option value="12" >12</option>
   </select>月
 </font>
  </td>
<td bgcolor="#ffffff" nowrap align="right"  width="20%">
<input type="hidden"  name="revenue_price_3" value="33">
<input type="text" id="myform_revenue_price_3_id"  maxLength="19" size="20" value="33" onkeypress=" checkDoubleChar(event,0);" onkeyup=" modifyDouble(event,'revenue_price_3', 'myform_revenue_price_3_id',15,0);" onblur=" modifyDoubleByCopy('revenue_price_3', 'myform_revenue_price_3_id',15,0);   calculateGainings(this)  "  disabled  style="text-align:right;ime-mode:disabled" >
<font size="2">

</font>
</td>
<td bgcolor="#ffffff" nowrap align="right"  width="20%" style="word-break: break-all">
<input type="hidden"  name="stocking_price_3" value="">
<input type="text" id="myform_stocking_price_3_id"  maxLength="19" size="20" value="" onkeypress=" checkDoubleChar(event,0);" onkeyup=" modifyDouble(event,'stocking_price_3', 'myform_stocking_price_3_id',15,0);" onblur=" modifyDoubleByCopy('stocking_price_3', 'myform_stocking_price_3_id',15,0);   calculateGainings(this)  "  disabled  style="text-align:right;ime-mode:disabled" >
<font size="2">

</font>
</td>
<td bgcolor="#ffffff" nowrap align="right"  width="20%" style="word-break: break-all">
<font size="2">
<span ID=gainings_3></span>

</font>
</td>
<td bgcolor="#ffffff" width="5%" align="center">
<a href="#"  id="del_3" name="del"  onclick="javascript:changePageData(3,document.all.revDetailOptionInfoTable)"><font size=2>削除</font></a>
</td>
</tr>
</table>
</form>
</body>
</html>

 一.
追加或删除数据的页面上处理
changePageData(要删除记录的ID,tableId)
 1.将画面上除了要删除的记录装入到一个arrayOfpageData数组中
二.
壳上金额升序的方式排序
sortData()
三.
删除画面上一行控件
delChildRow(tableId)
四.
添加一行控件到画面
addRevDetailOptionChildItem(tableId)
五.
生成一条新数据
六.
给画面上控件赋值
setValueToWidget(dataArray)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值