制作一个单选按钮选择另一个单选按钮

时间:2017-09-06 19:42:53

标签: javascript html

我正在构建一个带有8个单选按钮的表单,4个用于系统A,4个用于系统B.单选按钮的选项是CF,ISO,ISO-B和NW。我想这样做,以便当客户选择系统A的单选按钮时,在系统B上选择相同的按钮。

如何在系统B的单选按钮中同时选择系统A的单选按钮中选择的内容?

What I am basing it off of

2 个答案:

答案 0 :(得分:1)

您可以使用像ReactJS这样的数据绑定框架来做到这一点,但这里有一个基本的jQuery示例。只需在第一组单选按钮上收听“更改”事件,然后使用jQuery从第二组中选择相应的单选按钮。

<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "viverius_education";

$conn = new mysqli($servername, $username, $password, $dbname);

if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
echo "Connected successfully";

$update_status = $_POST['STATUS'];
$update_st_odprtih_mest = $_POST['st_odprtih_mest'];
$update_ID = $_POST['ID'];

if (empty($update_status) AND empty($update_status)){
    header('Location: viv_settings_tecaji_main.php'); exit;
}

  else{  
$sql = "UPDATE razpisani_tecaji 
SET 
STATUS = IF('$update_status'='',STATUS,'$update_status'),
ST_ODPRTIH_MEST = IF('$update_st_odprtih_mest'='',STATUS,'$update_st_odprtih_mest'),
WHERE ID_TECAJA = $update_ID";
}
if ($conn->query($sql) === TRUE) {
echo "New record created successfully";
header('Location: viv_settings_tecaji_main.php'); exit;
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}$conn->close();

?>
$( function() {

  $("input[name='system-a']").on("change", function(e) {
     var newValue = e.target.value;
     $("input[name='system-b'][value='" + newValue + "']").prop("checked", true);
  });

});

答案 1 :(得分:1)

$("input[type='radio']").on("click",function(){
   var Name= this.name == "SystemA"?"SystemB":"SystemA";
   $("input[name='"+Name+"'][value='"+this.value+"']").prop("checked", true);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span>System A</span>
<br>
<input type="radio" name="SystemA" value="CF"/><lable>CF</lable>&nbsp;
<input type="radio" name="SystemA" value="ISO"/><lable>ISO</lable>&nbsp;
<input type="radio" name="SystemA" value="ISO-B"/><lable>ISO-B</lable>&nbsp;
<input type="radio" name="SystemA" value="NW"/><lable>NW</lable>
<hr>
<span>System B</span>
<br>
<input type="radio" name="SystemB" value="CF"/><lable>CF</lable>&nbsp;
<input type="radio" name="SystemB" value="ISO"/><lable>ISO</lable>&nbsp;
<input type="radio" name="SystemB" value="ISO-B"/><lable>ISO-B</lable>&nbsp;
<input type="radio" name="SystemB" value="NW"/><lable>NW</lable>