<script language=Javascript> function Inint_AJAX() { try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) {} //IE try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) {} //IE try { return new XMLHttpRequest(); } catch(e) {} //Native Javascript alert("XMLHttpRequest not supported"); return null; }; function dochange(src, val) { var req = Inint_AJAX(); req.onreadystatechange = function () { if (req.readyState==4) { if (req.status==200) { document.getElementById(src).innerHTML=req.responseText; //รับค่ากลับมา } } }; req.open("GET", "localtion.php?data="+src+"&val="+val); //สร้าง connection req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8"); // set Header req.send(null); //ส่งค่า } window.onLoad=dochange('type', -1); </script>
<script type="text/javascript"> $(function(){ $("#addRow").click(function(){ $(".cssTR:eq(0)").clone(true) .insertAfter($("#myTbl tr.cssTR:last")); $(".css_input:eq(0)").trigger("change");// กำหนดเมื่อโหลด ทำงานหาผลรวมทันที }); $("#removeRow").click(function(){ // // ส่วนสำหรับการลบ if($("#myTbl tr.cssTR").size()>1){ // จะลบรายการได้ อย่างน้อย ต้องมี 1 รายการ $("#myTbl tr.cssTR:last").remove(); // ลบรายการสุดท้าย }else{ // เหลือ 1 รายการลบไม่ได้ alert("ต้องมีรายการข้อมูลอย่างน้อย 1 รายการ"); } }); }); </script>
<table width="87%" class="table table-bordered" id="myTbl"> <tr> <td align="center" class="text-center">หมวดค่าใช้จ่าย</td> <td align="center" class="text-center">รายการค่าใช้จ่าย</td> <td align="center" class="text-center">รายการ</td> <td align="center" class="text-center">จำนวน</td> <td align="center" class="text-center">ราคา/หน่วย</td> <td align="center" class="text-center bg-success">รวม</td> </tr> <tr class="cssTR"> <td width="17%" align="center" class="text-center"> <span id="type"> <select> <option value="0">- เลือกหมวดร่ายจ่าย -</option> </select> </span> </td> <td width="17%" align="center" class="text-center"> <span id="group"> <select > <option value='0'>- เลือกค่าใช้จ่าย-</option> </select> </span> </td> <td width="17%" align="center" class="text-center"> <span id="expenses"> <select> <option value='0'>- เลือกรายการ -</option> </select> </span> </td> <td width="17%" align="center" class="text-center"><input name="expP_amount" type="text" class="text-center css_input css_input1" id="input3" value="" size="5" data-number="0"></td> <td width="17%" align="center" class="text-center"><input name="expP_price" type="text" class="text-center css_input css_input2" id="input2" value="" size="5" data-number="0"></td> <td width="15%" align="center" class="text-center"><input name="expP_sum" type="text" class="text-center css_input3" id="input" value="" size="10" readonly data-number="0.00"></td> </tr> <tr> <td height="68" class="text-center"></td> <td class="text-center"> </td> <td class="text-center"> </td> <td class="text-center"></td> <td align="right" class="text-center">ยอดรวมสุทธิ</td> <td align="center" class="text-center bg-success"><input name="total" type="text" class="text-center" id="total" style="width:100px;" value="" readonly></td> </tr> </table> <!-- ไฟล์ localtion.php ที่ใช้ทำ ดรอปดาวน์ ลิสเมนู --> <?php include "connect.php"; echo $data = $_GET['data']; echo $val = $_GET['val']; if ($data=='type') { echo "<select name='category_name' onChange=\"dochange('group', this.value)\">"; echo "<option value='0'>- เลือกหมวดร่ายจ่าย -</option>\n"; $result=mysql_query("select * from category order by category_name"); while($row = mysql_fetch_array($result)){ echo "<option value='$row[category_id]' >$row[category_name]</option>" ; } } else if ($data=='group') { echo "<select name='cg1_name' onChange=\"dochange('expenses', this.value)\">"; echo "<option value='0'>- เลือกค่าใช้จ่าย -</option>\n"; $result=mysql_query("SELECT * FROM category_group_1 WHERE category_id= '$val' ORDER BY cg1_name"); while($row = mysql_fetch_array($result)){ echo "<option value=\"$row[cg1_id]\" >$row[cg1_name]</option> " ; } } else if ($data=='expenses') { echo "<select name='cg2_name'>\n"; echo "<option value='0'>- เลือกรายการ -</option>\n"; $result=mysql_query("SELECT * FROM category_group_2 WHERE cg1_id= '$val' ORDER BY cg2_name"); while($row = mysql_fetch_array($result)){ echo "<option value=\"$row[cg2_id]\" >$row[cg2_name]</option> \n" ; } } echo "</select>\n"; echo mysql_error(); mysql_close(); ?>
<!DOCTYPE html> <html> <head> <title></title> <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> </head> <body> <?php $data = array("A","B","C"); ?> <script type="text/javascript"> $(document).ready(function(){ $("#btn_add").click(function(){ addRows(); }); }); function addRows() { var tr="<tr><td><select>"; <?php foreach ($data as $key => $value) { ?> tr += "<option value='<?=$key?>'><?=$value?></option>"; <?php } ?> tr += "</select></td>"; tr += "<td><input type='text'></td></tr>"; $("tbody").append(tr); } </script> <table> <thead> <th>COL1</th> <th>COL2</th> <th><button id="btn_add">Add</button></th> </thead> <tbody> </tbody> </table> </body> </html>
เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง