如何在提交时向表单添加新的隐藏输入字段 [英] How to add a new hidden input fields to the form on submit

问题描述

我希望在满足某些条件时在请求中传递某些隐藏参数。

I want to pass certain hidden parameters in a request when some conditions are met.

例如，如果此条件为真，我想传递这些参数：

For example I want to pass these if this condition is true:

<script type="text/javascript"> 
 function checkClosureLevel()
 {
    var openLevel = document.getElementById('openLevel');
    var phyCompLevel = document.getElementById('phyCompLevel');
    var finCompLevel = document.getElementById('finCompLevel');

    if (openLevel.checked) { 
      //PASS HIDDEN FORM VARIABLES HERE AND SUBMIT FORM 
    }
 }
</script>

<form action="process.det_details" method="post" name="detParameterForm">
  <fieldset class="det">
    <legend>Closure Level</legend>
    <input type="checkbox" name="openLevel" >Open</input><br/>
    <input type="checkbox" name="phyCompLevel" >Physically Complete</input>
    <br/>
    <input type="checkbox" name="finCompLevel" >Financially Complete</input>
  </fieldset>
</form>

推荐答案

document.forms object是所有< form> 页面中的元素。它有数字索引和命名项。命名项目对应于每个< form> 的名称属性。

The document.forms object is a collection of all <form> elements in the page. It has numeric indexes, and named items. The named items correspond to a name attribute of each <form>.

var theForm = document.forms['detParameterForm'];

为了使附加数据更容易，您可以创建一个为给定表单添加数据的函数。

To make appending data easier, you can create a function which adds data for a given form.

function addHidden(theForm, key, value) {
    // Create a hidden input element, and append it to the form:
    var input = document.createElement('input');
    input.type = 'hidden';
    input.name = key; // 'the key/name of the attribute/field that is sent to the server
    input.value = value;
    theForm.appendChild(input);
}

// Form reference:
var theForm = document.forms['detParameterForm'];

// Add data:
addHidden(theForm, 'key-one', 'value');
addHidden(theForm, 'another', 'meow');
addHidden(theForm, 'foobarz', 'baws');

// Submit the form:
theForm.submit();

这篇关于如何在提交时向表单添加新的隐藏输入字段的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！