PHP Ionic Angularjs Phonegap AJAX Javascript CSS MySQL jQuery Forum

ถาม? เรื่อง=> ถ้าเลือก Radio ที่ 1 ให้แสดง ถ้าเลือก Radio ที่2 ให้ซ่อนต่อไปนี้-->

ถาม? เรื่อง=> ถ้าเลือก Radio ที่ 1 ให้แสดง ถ้าเลือก Radio ที่2 ให้ซ่อนต่อไปนี้-->
โค้ดตัวอย่างครับ ผมต้องการ ถ้าเลือก "มีงบประมาณ" -->ให้แสดง ปุ่ม select ทั้ง2
                                             ถ้าเลือก "ไมีมีงบประมาณ" --> ให้ ซ่อน ปุ่ม select ทั้ง 2
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<form action="getradio.php" method="post" name="form" id="form">

    <p>
      <input name="sex" type="radio" value="" checked="checked" />
      มีงบประมาณ
    <input name="sex" type="radio" value="เพศหญิง" />ไม่มีงบประมาณ
    <label></label>
    </p>
    <p>
      <select name="budget" id="select">
         <option value="0" > -Select-</option>
        <option value="1">งบมหาลัย</option>
        <option value="2">งบรัฐบาล</option>
     </select>
*เลือกงบประมาณ
      <select name="budget_year" id="select">
         <option value="0" > -Select-</option>
        <option value="1">2557</option>
        <option value="2">2558</option>
     </select>
*เลือกปีงบประมาณ
</form>
</body>
</html>

โดย:  Hasanlebaesa02 IP: 61.19.201.xxx วันที่: 03-11-2014 เวลา: 10:31:19

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

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


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


  • ( หรือ สามารถทำการ สมัครสมาชิก และล็อกอิน ด้วย ปุ่ม Log in with Facebook ด้านล่าง )
 ความคิดเห็นที่ 2
ถามหน่อยครับ??
ผมเป็น Admin แล้ว ตั้งคนหนึ่งเป็นคนเพิ่มลบแก้ไข ทีนี้ผมอยากรู้ว่าเค้ามา เพิ่มลบแก้ไข ไฟล์อะไรบ้าง เวลาไหน? วันที่เท่าไหร่
พอจะมีตัวอย่างไหมห่ะ ประมาณว่า การเก็บ Log หรือ History การใช้งานระบบ การเคลือนไหวของระบบ


โดย:  Hasanlebaesa02 IP: 61.19.201.xxx วันที่: 03-11-2014 เวลา: 15:51:24
 ความคิดเห็นที่ 1
เอาตัวอย่างโค้ดเป็นแนวทาง

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">  
    .mylabel{  
        display: inline-block;  
        width: 150px;  
        margin-bottom: 10px;          
    }  
    </style>      
</head>
<body>
 
<br><br>

<div style="margin:auto;width:800px;">

<form name="myform1" id="myform1" action="" method="post">
    
<span class="mylabel">Radio 1:</span>    
<input type="radio" name="myradio" id="myradio1" value="1" checked="checked"> 
<br>
<span class="mylabel">Radio 2:</span>    
<input type="radio" name="myradio" id="myradio2" value="2"> 
<br>
<div id="place_select">
<span class="mylabel">Select:</span>   
<select name="myselect">
    <option value="">Select</option>
    <option value="1">data 1</option>
    <option value="2">data 2</option>
</select>
<br>
<span class="mylabel">Select 2:</span>   
<select name="myselect2">
    <option value="">Select</option>
    <option value="1">data 1</option>
    <option value="2">data 2</option>
</select>
<br>
</div>
</form>    
    
 </div>
  
    
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>      
<!--<script type="text/javascript" src="js.js"></script>  -->
<script type="text/javascript">
$(function(){

    // เมื่อ radio ชื่อว่า myradio ถูก คลิก
    $(":radio[name='myradio']").on("click",function(){
        var valData=$(this).val(); // เก็บค่า ไว้ในตัวแปร
        if(valData==2){ // เปรียบเทียบค่า
            $("#place_select").hide(); // ซ่อนส่วนที่ต้องการ   
        }else{
            $("#place_select").show();   //แสดงส่วนที่ต้องการ   
        }
    });
    
});
</script>        
</body>
</html>

 
เราจะสร้าง div id เท่ากับ place_select ไว้สำหรับซ่อนหรือแสดง
ส่วนของเนื้อหาที่ต้องการ
โดยอ้างอิงจากค่าของ radio ที่เราเลือก


Radio 1:
Radio 2:
Select:
Select 2:


โดย:  Ninenik IP: 115.87.126.xxx วันที่: 03-11-2014