การร้องขอข้อมูลจากการเลือก checkbox ด้วย AJAX ต้องแก้ตรงไหนหรือต้องใส่อะไรเพิ่มใครพอบอกได้บ้างครับ

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา การร้องขอข้อมูลจากการเลือก checkbox ด้วย AJAX ต้องแก้ตรงไหนหรือต้องใส่อะไรเพิ่มใครพอบอกได้บ้างครับ

การร้องขอข้อมูลจากการเลือก checkbox ด้วย AJAX ต้องแก้ตรงไหนหรือต้องใส่อะไรเพิ่มใครพอบอกได้บ้างครับ
get_chkarray2.php
<script type="text/javascript">
// วนลูป input ทุกตัวในฟอร์ม
forEach($E('check_form').getElementsByTagName('input'), function(item){
    // เลือกเฉพาะรายการที่มี class = chkarray ตามที่กำหนดในฟอร์ม
    if(item.className == 'chkarray'){
        // กำหนด event เมื่อ click ให้กับ checkbox แต่ละตัว
        $G(item).addEvent('click', doCheckClick)
    };
});
</script>
<script type="text/javascript">
var doCheckClick = function(event){
    var req = new GAjax();
    req.send('chkarray.php' ,req.getRequestBody('check_form') ,function(xhr) {
        $E('chk_result').value = xhr.responseText;
    });

};
</script>
<form id="main_form" method="post" action="get_chkarray2.php">
<p><input type="text" id="chk_result" /></p>
</form>
<form id="check_form">
<?php
    for($i = 0 ; $i < 10 ;$i++){
        echo "<p><input type="checkbox" class="chkarray" name="check[]" value="$i" />$i</p> ";
    }
?>
</form>

///////////////////////
chkarray.php
<?php
    $r = 0;
    if(isset($_POST[check])) foreach($_POST[check] AS $item){
        $r = $r + $item;
    }
    echo $r;
?>


Icenokoto 171.4.251.xxx 28-10-2014 01:26:32

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
  • เปลี่ยน


    ( หรือ เข้าใช้งานผ่าน Social Login )

 ความคิดเห็นที่ 1

โค้ดแนวนี้ เหมือนเคยเห็นจากเว็บ goragod 

ลองสอบถามเขาดู น่าจะเป็นรูปแบบเฉพาะของเขา

http://www.goragod.com/#module=forum&1414468730186

หรือถ้าแค่บวกกันใช้ javascript ก็ได้ โดยใช้งาน jquery จะง่ายกว่า

0
1
2
3
4
5
6
7
8
9

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
   
<form id="main_form" method="post" action="">
<p><input type="text" id="chk_result" /></p>
</form>
<form id="check_form">
<?php
for($i = 0 ; $i < 10 ;$i++){
?>        
<input type="checkbox" class="chkarray" name="check[]" value="<?=$i?>" /><?=$i?> <br>
<?php } ?>    
</form>    

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>   
<script type="text/javascript">
$(function(){
    var data_total=0;
    $(".chkarray").on("click",function(){
       var i_check=$(this).prop("checked"); 
        var i_value=parseInt($(this).val());
        if(i_check==true){
            data_total+=i_value;
        }else{
            data_total-=i_value;
        }
        $("#chk_result").val(data_total);
    });
      
});
</script>  
</body>
</html>




หรือถ้าใช้ ajax ก็ลองประยุกต์ได้

get_chkarray2.php
 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
   
<form id="main_form" method="post" action="">
<p><input type="text" id="chk_result" /></p>
</form>
<form id="check_form">
<?php
for($i = 0 ; $i < 10 ;$i++){
?>        
<input type="checkbox" class="chkarray" name="check[]" value="<?=$i?>" /><?=$i?> <br>
<?php } ?>    
</form>    

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>   
<script type="text/javascript">
$(function(){

    $(".chkarray").on("click",function(){
        var str=$("#check_form").serialize();
        $.post("chkarray.php",str,function(data){
            $("#chk_result").val(data);
        });
    });    
    
});
</script>  
</body>
</html>



chkarray.php
 

<?php
header("Content-type:text/html; charset=UTF-8");            
header("Cache-Control: no-store, no-cache, must-revalidate");           
header("Cache-Control: post-check=0, pre-check=0", false);  
if(count($_POST['check'])){
    $r = 0;
    if(isset($_POST[check])) foreach($_POST[check] AS $item){
        $r = $r + $item;
    }
    echo $r;    
}
?>





 



ninenik 124.120.5.xxx 28-10-2014







สนับสนุนเว็บไซต์เรา จ่ายด้วย Truemoney Wallet
หรือ
Terms of Service | Privacy Policy
Author
2024 © Copyright ninenik.com. All rights reserved.
เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ