Question

我正在开发一个包含搜索功能的项目，目前搜索工作正常，因为我正在使用下拉列表并选择值。这是我使用下拉列表的代码

<div class="form-group form-group-lg form-group-icon-left search"><i class="fa fa-plane input-icon"></i>
  <label>Select an option</label>
  <select class="typeahead form-control" name="search">
  <?php foreach($search_des as $sd) { ?>
             <option value="<?php echo $sd->des_category_id;?>">
             <?php echo $sd->des_category_name;?></option>
  <?php } ?>
  </select>
  <br>
</div>

现在根据我们的客户要求，他们需要使用单选按钮显示所有项目，并且他们还想通过单击收音机来提交页面。我试图使用单选按钮它无法正常工作。这是我用单选按钮的代码。

<div class="form-group">
  <label>Select an option</label>
  <?php foreach($search_des as $sd) { ?>
      <label>
      <input class="form-control" value="<?php echo $sd->des_category_id;?>" type="radio">
     <?php echo $sd->des_category_name;?></label>
  <?php } ?>
  <br>
</div>

使用此项时所有项目都列出正确但所有单选按钮都已选中，我也不知道如何使用单选按钮自动提交表单。

Answer 1

您需要使用Javascript触发点击提交表单。

将事件侦听器添加到单击的单选按钮，然后触发表单以在事件发生时提交。

这样的事情应该有效，只需相应地更改ID。

var form = document.getElementById("form-id");

document.getElementById("radio-id").addEventListener("click", function () {
  form.submit();
});

Answer 2

你没有给出

name

属性输入

<div class="form-group">
   <label>Select an option</label>
         <?php foreach($search_des as $sd) { ?>
    <label>
    <input name="search" class="form-control" value="<?php echo $sd->des_category_id;?>" type="radio"><?php echo $sd->des_category_name;?></label>
                        <?php } ?>
<br>

Answer 3

好的，所以在这个问题上有很多事情需要解决。

首先，如上所述，您需要将名称标签添加到单选按钮。

其次，您需要使用JavaScript在单选按钮的单击事件上提交表单。要设置点击事件，请在单选按钮上添加课程。

在此处发布答案，并附上我的Codepen链接。

<强>代码

<form name="theForm">
  <div class="form-group">
    <label>Select an option</label>
    <?php foreach($search_des as $sd) { ?>
      <label>
        <input class="form-control radioClass" value="<?php echo $sd->des_category_id;?>" type="radio" name="category">
        <?php echo $sd->des_category_name;?></label>
      <?php } ?>
    <br>
  </div>
</form>

<强> JS var classname = document.getElementsByClassName（＆＃34; radioClass＆＃34;）; //我们添加的单选按钮类

var myFunction = function() {
    document.theForm.submit(); //theForm is the name of the form.
};

for (var i = 0; i < classname.length; i++) {
    classname[i].addEventListener('click', myFunction, false);  //Adding listener to the click event.
}

您可以在此链接中使用代码（当然PHP脚本已被虚拟数据替换）：https://codepen.io/akshit_ij/pen/KydVXz

如果有帮助，请告诉我。

codeigniter中的单选按钮错误

3 个答案: