2011-06-24 9 views
1

目標:
計算の値をhtmlページに表示します。計算値を表示できません

問題:あなたが提出 ボタンをクリックした後

、計算が 始まりとなります。その後、ページ が "window.onload"を実行して再度読み込みを開始しました。このコンスは、 計算結果を見ることができません。

私は「window.onload」を一度読み込んでから、ページ全体を再度読み込まずに、送信ボタンを押してデータを追加したいと思っています。送信ボタンを押すと、そのデータが表示されます。 // fullmetalboy


<script type ="text/javascript" charset="utf-8" src="scripts/data.js"></script> 
</head> 
<body> 
    <div id ="container"> 
     <div id ="header"> 

     </div> 
     <div id ="content"> 

      <table id ="pricetable"> 
       <thead> 
        <tr> 
         <th>Articlenumber</th> 
         <th>Product</th> 
         <th>Name</th> 
         <th>Price</th> 
         <th>Quantity</th> 
        </tr> 
       </thead> 
       <tbody> 
        <tr> 
         <td>223</td> 
         <td>a</td> 
         <td>a</td> 
         <td>250</td> 
         <td><input type ="text" size ="3" value ="1"/></td> 
        </tr> 
        <tr> 
         <td>223</td> 
         <td>a</td> 
         <td>a</td> 
         <td>250</td> 
         <td><input type ="text" size ="3" value ="1"/></td> 
        </tr> 
        <tr> 
         <td>223</td> 
         <td>a</td> 
         <td>a</td> 
         <td>250</td> 
         <td><input type ="text" size ="3" value ="1"/></td> 
        </tr> 
        <tr> 
         <td>223</td> 
         <td>a</td> 
         <td>a</td> 
         <td>250</td> 
         <td><input type ="text" size ="3" value ="1"/></td> 
        </tr> 
       </tbody> 
      </table> 





     </div> 
    </div> 
</body> 


window.onload = init; 




function init() 
{ 
    createForm(); 
    addColumn(); 
    addRow(); 
} 



function addColumn() 
{ 

    var tabellHead = document.getElementById("pricetable").tHead; 

    for (var a=0; a<tabellHead.rows.length; a++) 
    { 
     var nyTH = document.createElement('th'); 
     tabellHead.rows[a].appendChild(nyTH); 
     nyTH.innerHTML = "Summa"; 
    } 


    var tabellBody = document.getElementById("pricetable"); 

    for (var b=1; b<tabellBody.rows.length; b++) 
    { 
     var nyTD = document.createElement('td'); 
     tabellBody.rows[b].appendChild(nyTD); 
     nyTD.innerHTML = ""; 
    } 

} 



function addRow() 
{ 
    var newRow = document.createElement('tr'); 
    newRow.setAttribute('id', "sumrow"); 



    var ca1 = document.createElement('td'); 
    var ca2 = document.createElement('td'); 
    var ca3 = document.createElement('td'); 
    var ca4 = document.createElement('td'); 
    var ca5 = document.createElement('td'); 
    var ca6 = document.createElement('td'); 

    var text = document.createTextNode("asdf"); 


    var font = document.createElement('font'); 
    font.setAttribute('color', 'white'); 
    font.appendChild(text); 



    ca6.appendChild(font); 

    newRow.appendChild(ca1); 
    newRow.appendChild(ca2); 
    newRow.appendChild(ca3); 
    newRow.appendChild(ca4);   
    newRow.appendChild(ca5);  
    newRow.appendChild(ca6);  

    var t = document.getElementById('pricetable'); 

    t.appendChild(newRow); 
} 



function createForm() 
{ 
    var t = document.getElementById('content'); 

    var a = "<form><input onclick='tttest();' value='Rensa' type='submit'></form>"; 

    t.innerHTML += a; 
} 




function calc() 
{ 



     var lass = document.getElementById("pricetable"); 

     var tabellBody = asss.getElementsByTagName("tr"); 


     for (var b=1; b<tabellBody.length; b++) 
     { 
      var godis = tabellBody[b].cells[4].childNodes[0]; 
      var godia = tabellBody[b].cells[3]; 

      var a = godia.innerHTML * godis.value; 

      var text = document.createTextNode(a); 


      //tabellBody.rows[b].cells[5].innerHTML = a; 

      var celler = tabellBody[b].getElementsByTagName("td"); 

      var medelelement = celler[celler.length - 1]; 

      medelelement.appendChild(text); 

     } 


} 

答えて

0

0送信ボタンを通常のボタンに変更するだけですか?

var a = "<form><input onclick='tttest();' value='Rensa' type='button' /></form>"; 
1

はちょうどあなたがいるこの

onsubmit = "calc(); return false;" 
1

を提出からフォームを防ぐ必要があり、送信ボタンからのonclickハンドラでfalseを返しますあなたのページは明らかにリロードされます。

あなたは

a)のフォームが結果を提出し、計算防止するかがあります。

b)ページをリロードせずにフォームを送信するには、AJAXを使用します。

0

のように、それはfalseを返す必要があります送信ボタンを

$('input[type=submit]').click(function() { 
    /*do my calc stuff*/ 
    return false; 
}); 
関連する問題