ช่วยสอนเรื่อง ajax หน่อยครับ

ช่วยสอนเรื่อง ajax หน่อยครับ
ผมต้องการทำหน้าเวป เป็นประมาณตามรูปที่แนบไว้



คือเมื่อเราคลิกที่กล่องสีน้ำเงิน หรือ ตัวอักษร ที่อยู่ในกล่องนั้น  แล้วต้องการให้มี ข้อความหรือ อาจะเปน radiobox ออกมาข้างล่าง

ที่เป็นส่วนของ สีฟ้า โดยการใช้ ajax ผมต้องทำอย่างไบ้างครับ 



แบบว่าผมมือใหม่เลย ยังเขียนไม่ค่อยเป็นครับ



ขอบมากคุณครับ

05 พ.ย. 2553 เวลา 01:05 น. 10 957

ต้องการให้สอน หรือให้เขียนโค้ดให้ครับ...



ถ้าต้องการให้สอน ลองอ่านบทความ เกี่ยวกับ Ajax บนเว็บดีกว่ามั้ยครับ ถ้าอ่านแล้ว ติด หรือไม่ค่อยเข้าใจตรงไหน ค่อยถามมาเป็นข้อๆ



ถ้าต้องการให้เขียนโค้ดให้ คงต้องรอคนใจบุญมาเขียนให้แล้วครับ โดยส่วนตัวผมไม่นิยมเขียนโค้ดให้ครับ โดยเฉพาะ "มือใหม่" ผมอยากให้อ่านบทความ แล้วทำตามที่บทความเขียนไว้ก่อนดีกว่าครับ ผมว่าถ้าได้อ่านบทความผมก่อน ความต้องการข้างบน จะไม่เกินความสามารถครับ
#1


    ยังไงก็ต้องค่อยๆศึกษาไปก่อนนะครับ

    

    ก็พยายามลองส่งค่าไปๆมาๆบ่อยๆ แล้วก็อ่านในบทความที่มีอยู่มากๆครับ ส่วน Code ด้่านล่างเป็นตัวอย่างนิดหน่อยครับ ลองปรับเปลี่ยนดูครับ แต่ผมไม่ได้ทำำเป็นรูปภาพทำเป็นปุ่ม แทนครับ ลองทดสอบดูครับ

    

    หน้า ส่วน Html และ Javascript  ตั้งชื่อว่า test.php

    

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


    <html xmlns="http://www.w3.org/1999/xhtml">


    <head>


    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />


    <title>Untitled Document</title>


    <script type="text/javascript">


    function uzXmlHttp(){


    var xmlhttp = false;


    try{


    xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");


    }catch(e){


    try{


    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");


    }catch(e){


    xmlhttp = false;


    }


    }


     


    if(!xmlhttp && document.createElement){


    xmlhttp = new XMLHttpRequest();


    }


    return xmlhttp;


    }


     


     


    function show_radio_box()


    {


     


    var url = 'show.php';


     


    xmlhttp=uzXmlHttp();


    xmlhttp.onreadystatechange = function () { 


    //document.getElementById("loading").innerHTML="<img src='images/general/loading.gif'>";//Show image ajax


    if (xmlhttp.readyState==4){


    if (xmlhttp.status==200) {


    //document.getElementById("loading").innerHTML="";


                var ret=xmlhttp.responseText;


     


    document.getElementById("show").innerHTML=ret;


     


     


     


            }


    }


    }


    xmlhttp.open("GET", url);


    xmlhttp.setRequestHeader("If-Modified-Since", ""+ new Date().getTime()+"");


    xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;charset=windows-874');


    xmlhttp.send(null);


      }


      </script>


    </head>


     


    <body>


    <input type="submit" name="button" id="button" value="ตัวอย่าง" onclick="show_radio_box();" />


    <div id="show"></div>


    </body>


    </html>

    

    

    2. หน้า Ajax ตั้งชื่อ show.php เก็บ Path ไว้ที่เดียวกันนะครับ

    

    

        <?

    

         

    

        $now = gmdate('D,d M Y H:i:s') . ' GMT';

    

        header('Expires: ' . $now);

    

        header('Last-Modified: ' . $now);

    

        header('Cache-Control: no-store, no-cache, must-revalidate');

    

        header('Cache-Control: pre-check=0, post-check=0, max-age=0'); 

    

        header('Pragma: no-cache'); 

    

        header('Content-Type: text/html; charset=utf-8');

    

        ?><input name="" type="checkbox" value="" />

    

        โชว์แล้วจ้า

    

         


#2

ขอบคุณครับ
#3

ตอนนี้ถ้าผมอยากทำให้ ทั้งสองเฟรมนั้น สามารถคลิกแล้วทำการโต้ตอบ เปลี่ยนแปลงค่าต่างๆ ของแต่ละเฟรมได้ ต้องทำยังไงครับ



อย่างเช่น ถ้าคลิกข้างบนแล้วข้างล่างก้พิมอะไรออกมาเช่น hello แล้วพอคลิกที่ข้างล่างอีกที ข้างบนก้จะพิม hi ไรประมาณดีครับ

ขอบคุณครับ
#4


    ก็ทำได้เลยครับ

    

    แบบเดิมเลย แต่ขึ้นอยู่กับว่าเราจะต้องการแสดงส่วนไหน ก็นำ <div></div> ไปวางได้เลยครับ

    

    แต่ถ้าต้องการให้หายไป ก็นำ <div>คลุมส่วนที่แสดงไว้ตอนแรกครับ </div>

    

    ลองศึกษาการส่งค่าไปมาบ่อยๆครับ

    

    ถ้าไม่ได้ยังไงก็โพสมานะครับ จะลองส่งตัวอย่างไปให้ดูนะครับ


    

     

#5

ศึกษา Javascript เพิ่มเติม ดีมั้ยครับ หลายๆอย่างที่ต้องการ ใช้แค่ Javascript เท่านั้น ครับ
#6

คือผมมีปัญหาที่ว่า จะกดปุ่มซึ่งปุ่มนี้อยู่คนละไฟล์กับ <div> </div>ที่เราอยากให้มันแสดงอะครับ

เล่นปุ่มอยู่และคำสั่งอยู่ที่ไฟล์ test1.php  แต่เราอยากสั่งให้ข้อความไปแสดงบน <div> </div> ของไฟล์ test2.php ครับ

มันต้องทำยังไง ผมทำยังไงก้ไม่ได้ซักทีครับ
#7

คนละไฟล์ แต่ include มาแสดงหน้าเียวกัน หรือ คนละหน้าเว็บเลยครับ เอาให้ชัด



ถ้ากรณีที่ 2 คงทำยากครับ และ คำถาม ควรจะชัดเจนกว่านี้ครับ
#8

คนละไฟล์ครับ  แต่ดึงมาแสดงบนหน้าเดียวกัน



คือทั้งปุ่มและทั้งหน้าที่แสดง นั้นอยู่ในหน้าเดียวกัน เหมือนรูปข้างบนเลยครับ

ส่วนของปุ่มนั้นอยู่ด้านล่างสีฟ้า ซึ่งต้องคลิกจากข้างบนถึงจะแสดงออกมา  จากนั้นเมื่อไปคลิกปุ่มด้านล่าง ก็จะให้แสดงข้อความบน 

<div>  </div> ข้างบนซึ่งมันอยู่คนละไฟล์กันครับ
#9

#10
ความคิดเห็น
ไฟล์อัปโหลด ชนิด jpg, jpeg ขนาดไฟล์ไม่เกิน 1024
^