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

问题描述 投票:1回答:4

我正在创建一个搜索客户端的表单,使用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 enter image description here

ajax codeigniter codeigniter-3
4个回答
0
投票

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) {

    }
   });
}

0
投票

试试这个

<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>

0
投票

我注意到的一件事是你在DOB选项中将'mail'作为值。另一个是,似乎有3个选项,但你只有2个收音机?

我将邮件值调整为dob并创建了虚拟div来测试代码。它似乎工作。

$(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();
    }
  });
});
<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>

只要将值传递给控制器​​,理想情况下输入应该是一种形式。提交表单时,可以将选定的值传递给php。

<?php
if (isset($_POST['submit'])) {
    if(isset($_POST['optradio']))
    {
       Radio selection is :".$_POST['optradio'];  // Radio selection 
    }
?>

0
投票

如果你想获得当前检查的单选按钮值,请尝试下面的行,它将返回当前的单选按钮值

var radioValue = $("input[name='gender']:checked").val();
if(radioValue)
{
alert("Your are a - " + radioValue); 
}
© www.soinside.com 2019 - 2024. All rights reserved.