A-AA+then

เฉลยแบบฝึกหัด ... AJAX ให้ด้วยครับ

1,946

กำลังเรื่มศึกษา Ajax ครับ 

..ผมลองทำแบบฝึกหัดง่ายๆเกี่ยวกับการเรียกใช้ JavaScrip ฝั่ง Server ครับ

โจทย์คือ สั่ง
Hidden Form โดยการกดปุ่ม 'Hidden by AJAX'  ...แต่ลองทำแล้วไม่มีผลอะไรเลยครับ

ปัญหาคือ Content-Type  text/javascript ที่ถูกเรียกจากฝั่ง Server ไม่ทำงานคับ ลอง Check ajax.status = 500

ในขณะที่ลองสั่ง Javasript ดูตรงๆก็ทำงานปกติ ปุ่ม 'Hidden by Function'

 

กรุณาแนะนำด้วยครับ




//******ไฟล์ aj_logon.html

<html>
<head>
<script>
  var ajax = null;
  if (window.ActiveXObject){
    ajax = new ActiveXObject("Microsoft.XMLHTTP"); }
  else if (window.XLMHttpRequest){
    ajax = new XMLHttpRquest();  }
 
  function ajaxLoad(method, URL, data, displayId){
    ajax.open(method, URL);
    ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
       
    ajax.onreadystatechange = function(){
      alert (ajax.status);
      if(ajax.readyState==4 && ajax.status==200){         // <--ตรงนี้ทำไม่ได้ ajax.status = 500
        var ctype = ajax.getResponseHeader("Content-Type");
        ctype = ctype.toLowerCase();
                    
        if (ctype.match("text/javascript")){
          eval(ajax.responseText);
        }
      }  
    }   
    ajax.send(data);
  }
 
  function ajaxCall(){
    var URL = "aj_Logn_ss.php" + "?rand=" + Math.random();  
    ajaxLoad("post", URL, "DAT", "msg");      
  }
 
  function Hidden_Frm(){
    var f = document.getElementById('frm');
    f.style.display = 'none';
  }
 
</script>

</head>
<body>
  <div style = "width:300px;text-align:right">
  <form id='frm'> 
    <h3>Login Page</h3>
    Login: <input id="login" type="text"><br> 
    Password: <input id="pass" type="password"><br>
  </form>
     
  <button onclick="ajaxCall()">Hidden by AJAX</button> 
  <button onclick="Hidden_Frm()">Hidden by function</button>

</body>
</html>


//******ไฟล์ aj_logon_ss.php
<?php
  header("Content-Type: text/javascript; charset=tis-620");
 
  $msg = <<< JS
    var f = document.getElementById('frm');
    f.style.display = 'none';
  JS;
   
  echo $msg;        
?>


 

4 ความคิดเห็น

555+++

กลับไปทบทวนบทความเกี่ยวกับ Ajax ใหม่ดีมั้ยครับ จะได้เข้าใจ
1

โปรดอธิบายเพิ่มเติมให้ด้วยได้มั้ยครับ ไม่เข้าใจจริงๆครับ

2

อ่านแล้วลองทำตามบทความให้เข้าใจอีกทีไงครับ เริ่มต้น ตามขั้นตอน ถึงจะเข้าใจครับ

ถ้าให้ผมอธิบายมากกว่านี้ ผมก็ต้องอธิบายตามบทความที่เขียนมาแล้วเหมือนกัน

ผมไม่รู้ว่าได้ต้นฉบับ วิธีการแบบนี้มาจากไหน ถ้าต้นฉบับมันทำงานได้ ก็คงต้องสอบถามตามต้นฉบับแล้วครับ เพราะตามที่ผมใช้อยู่ วิธีนี้มันไม่ถูกต้องๆ

คำตอบของคำถมนี้ มีอยู่บนเว็บครับ ถ้าจะกรุณาอ่าน

ตัวอย่าง login บนเว็บก็มี ถ้าจะกรุณาหา
3

ขอบคุณสำหรับความกรุณาครับคุณgOragod

4
^