在具有相同 id 的多个选择标签中捕获选择标签的选定项

Capturing the selected item of select tag in multiple select tags with same id

本文关键字：选择 标签 id      更新时间：2023-09-26

>我正在使用一个 django 框架，其中，我通过渲染从 python 后端发送列表以响应 html 页面，因此根据列表中的条件创建多个选择标签。我的问题是，我想在单击这些下拉列表前面的保存按钮时获取或捕获该下拉列表的选定值，但是每当我选择该值时，我都会获得第一个下拉列表的值。下面是我的一段代码。

    <select style="padding:5px; width:102%;"  onchange="savestate({{result.0}});" 
    class="select11" id="status8" name="status8" title="Choose Status" >
    <option id="status8"  name="status8" >{{result.1}}</option>

    {% if result.1 == "HR_Interview" %}
    <option id="status8"  name="status8">COL</option>

    {% elif result.1 == "Internal_Interview" %}
    <option id="status8"  name="status8">HR_Interview</option>
    <option id="status8"  name="status8">COL</option>

    {% elif result.1 == "COL" %}
    <option id="status8"  name="status8">CS</option>

    {% elif result.1 == "CI" %}
    <option id="status8"  name="status8">CIS</option>

    {% elif result.1 == "CIS" %}
    <option id="status8"  name="status8">Joining</option>

    {% elif result.1 == "CS" %}
    <option id="status8"  name="status8">CI</option>

    {% elif result.1 == "Line_up" %}
    <option id="status8"  name="status8">Internal_Interview</option>
    <option id="status8"  name="status8">HR_Interview</option>
    <option id="status8"  name="status8">COL</option>
    {% else %}   

    {% endif %}
    </select> 
    <input class="css_save1" type="submit" name="save" value="Save" onclick = "function9({{result.1}});"> 
    <input type="hidden" id="name" name="name" value={{name}}>
<script>
    function function9(resume1)
    {
    console.log("input_string:::",resume1);
alert("Hello! I am an alert box!!",resume1);
         <!-- var opt1=document.getElementById("status8").value();  -->
        <!-- console.log("input_string:::",opt1); -->
            <!-- var e = document.getElementById("status8"); -->
            <!-- var input_string = e.options[e.selectedIndex].text;  -->
         if (resume1 == "COL") 
        <!--if (var input_string.equals("COL"))-->
                {
                var r=confirm("Are you sure?");
                    if (r == true) 
                    {
                    document.getElementById("listOfSearch{{result.0}}").submit();
                    } 
                    else 
                    {
                    document.getElementById("listOfSearch{{result.0}}").submit();
                    }
                }
        else
                {
                document.getElementById("listOfSearch{{result.0}}").submit();
                }
        return response;
     }
</script>

因此，创建的选择标记位于 for 循环中请帮我解决这个问题

您需要阅读有关表单的更多信息，选择并提交

  • ID 必须是唯一的！选项不需要 ID 或名称。
  • 切勿在提交按钮的点击事件中提交表单。而是使用表单的提交事件并返回 true 以允许提交，返回 false 以停止它

从选项中删除所有ID和名称后尝试此操作

window.onload=function() {
  document.getElementById("listOfSearch{{result.0}}").onsubmit=function() {
    var sel = document.getElementById("status8");
    var val = sel.options[sel.selectedIndex].text; 
    if (val=="COL") return confirm("Are you sure?"); // submit only if confirmed
    return true; // submit anyway if val is not COL
  }
}

功能函数9（x） { var id = $（x）.closest（"tr"）.find（'td：eq（1）'）.find（"#status8 option：selected"）.text（）; console.log（"fetched value>>>"，id）;}

相关文章：