如何从单选按钮动态获取价值

Question

我正在使用id或email创建一个用于搜索客户的表格，两者均设置为唯一。在 Codeignitor 上进行的应用。

1. 我创建了一个带有两个单选按钮的表单，一个用于使用ID搜索，另一个用于使用mail + dob搜索。
2. 取决于所选的单选按钮，显示相应的输入字段。
3. 在控制器中，它根据单选按钮值选择模型功能。

这是我编写的代码，我需要将单选按钮的值传递给Controller.php文件

表单（仅包含单选按钮）

$(document).ready(function() {
  $("#usingdob").hide();
  $("#usingmail").hide();
  $("input:radio").click(function() {
    if ($(this).val() == "id") {
      $("#usingId").show();
      $("#usingdob").hide();
      $("#usingmail").hide();



    } else {
      $("#usingId").hide();
      $("#usingdob").show();
      $("#usingmail").show();
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-md-4">
  <label class="radio-inline">
<input  type="radio" name="optradio" value="id" checked>Using ID </label></div>
<div class="col-md-4">
  <label class="radio-inline">
<input  type="radio" name="optradio" value="mail">Using DOB</label>
</div>

我希望正确获取单选按钮的值enter image description here

Answer 1

JS：

$('input[name="optradio"]').click(function(){
    var optradio = $(this).val();
    //or
    var optradio = $("input[name='optradio']:checked").val();
    if(optradio == 'id'){
      //do your hide/show stuff
    }else{
      //do your hide/show stuff
    }
});
//on search button press call this function
function passToController(){
   var optradio = $("input[name='optradio']:checked").val();
   $.ajax({
    beforeSend: function () {
    },
    complete: function () {
    },
    type: "POST",
    url: "<?php echo site_url('controller/cmethod'); ?>",
    data: ({optradio : optradio}),
    success: function (data) {

    }
   });
}

Answer 2

尝试一下

<script type="text/javascript">

$( document ).ready(function() {
$("#usingdob, #usingmail").hide();

$('input[name="radio"]').click(function() {

    if($(this).val() == "id") {
      $("#usingId").show();
      $("#usingdob, #usingmail").hide();
    } else {
      $("#usingId").hide();
      $("#usingdob, #usingmail").show();
    }
  });
});

</script>

Answer 3

我注意到的一件事是，在DOB选项中您具有“邮件”作为值。另一个是似乎有3个选项，但您只有2个收音机？

我将邮件值调整为dob并创建了虚拟div以测试代码。似乎可行。

table routes  column route_id
table trips column trip_id 
table stop_times column stop_id

$(document).ready(function() {
  $("#usingdob").hide();
  $("#usingmail").hide();
  $("input:radio").click(function() {
    console.log($(this).val());
    if ($(this).val() == "id") {
      $("#usingId").show();
      $("#usingdob").hide();
      $("#usingmail").hide();
    } else {
      $("#usingId").hide();
      $("#usingdob").show();
      $("#usingmail").show();
    }
  });
});

就将值传递给控制器​​而言，理想情况下，输入应采用某种形式。提交表单时，所选值可以传递给php。

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-md-4">
  <label class="radio-inline">
<input  type="radio" name="optradio" value="id" checked>Using ID </label></div>
<div class="col-md-4">
  <label class="radio-inline">
<input  type="radio" name="optradio" value="dob">Using DOB</label>
</div>

<div id="usingId">
  Using Id div
</div>

<div id="usingdob">
  Using dob div
</div>

<div id="usingmail">
  Using mail div
</div>

Answer 4

如果要获取当前选中的单选按钮值，请尝试在下面的行中返回当前单选按钮的值

var radioValue = $("input[name='gender']:checked").val();
if(radioValue)
{
alert("Your are a - " + radioValue); 
}