Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <?php
- $row_num=isset($_POST['row_num'])?$_POST['row_num']:'';
- ?>
- <!DOCTYPE html>
- <html>
- <head>
- <title>Dynamic MultiRow</title>
- <style>
- * {font-family:verdana,arial,sans-serif;font-size:12px;}
- .number {text-align:right}
- .total {text-align:right;font-weight:bold;background-color:#ffc;border:solid 1px #999;}
- .grand_total {text-align:right;font-weight:bold;}
- .config_box {background-color:#eef;width:480px;padding:5px;margin:5px;}
- .formula_box {display:<?php echo empty($row_num)?'none':'block';?>;
- background-color:#eee;width:480px;padding:5px;margin:5px;}
- </style>
- </head>
- <body>
- <div class='container'>
- <div class='config_box'>
- <form method='post'>
- <label>Jumlah Baris</label>
- <input type='text' name='row_num' class='number' value='<?php echo $row_num;?>' />
- <input type='submit'/>
- </form>
- </div>
- <div class='formula_box'>
- <table>
- <tr>
- <th>Nilai 1</th>
- <th>Nilai 2</th>
- <th>Total</th>
- </tr>
- <?php
- if(!empty($row_num))
- {
- for($i=0;$i<$row_num;++$i)
- {
- echo"
- <tr>
- <td><input type='text' name='nilai1[]' class='number' onChange='sum()'/></td>
- <td><input type='text' name='nilai2[]' class='number' onChange='sum()' /></td>
- <td><input type='text' name='total[]' class='total' readonly='readonly' /></td>
- </tr>\n";
- }
- }
- ?>
- <tr>
- <td colspan='2' class='grand_total'>Grand Total</td>
- <td><input type='text' id='grand_total' class='total' readonly='readonly' /></td>
- </tr>
- </table>
- </div>
- </div>
- <script>
- function sum(){
- var nilai1=document.getElementsByName('nilai1[]');
- var nilai2=document.getElementsByName('nilai2[]');
- var total=document.getElementsByName('total[]');
- var grandtotal=0;
- var dummy=0;
- for(i=0;i<nilai1.length;i++)
- {
- dummy=isNaN(parseFloat(nilai1[i].value))?0:parseFloat(nilai1[i].value);
- dummy+=isNaN(parseFloat(nilai2[i].value))?0:parseFloat(nilai2[i].value);
- total[i].setAttribute('value',dummy==0?'':dummy);
- grandtotal+=isNaN(parseFloat(total[i].value))?0:parseFloat(total[i].value);
- }
- document.getElementById('grand_total').setAttribute('value',grandtotal);
- }
- </script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement