HTML单选按钮会导致JavaScript表单功能崩溃

时间:2016-08-04 14:16:28

标签: javascript php html forms

我正在处理提交到服务器以转换为文本文件的表单视图。视线需要将数据发布到服务器端php。它还需要在URL中添加“?PART_NO = part & frm = MF001”来命名每个文本文件。

如果表单包含多个单选按钮,则会导致JavaScript崩溃。这可能是因为我试图访问表单元素的方式。我只需要访问名为“Part_No”的文本字段。

<!DOCTYPE html>
<html>
<body>

<form id="test" method="post" action="http://10.0.0.252/test.php" onsubmit="process()">
<input type="checkbox"  tabindex="40"  id="form67_1" data-objref="458 0 R" name="box_brown" imageName="1/form/416 0 R" images="110100"/>
<input type="radio"  tabindex="32"  id="form68_1" data-objref="495 0 R" name="rc-50" value="yes"  imageName="1/form/497 0 R" images="110100" checked="checked"/>
<input type="radio"  tabindex="31"  id="form69_1" data-objref="494 0 R" name="a2262at" value="no"  imageName="1/form/494 0 R" images="110100"/>
<input type="radio"  tabindex="17"  id="form70_1" data-objref="509 0 R" name="process" value="no"  imageName="1/form/509 0 R" images="110100"/>
<input type="radio"  tabindex="11"  id="form71_1" data-objref="503 0 R" name="master_glass" value="no"  imageName="1/form/503 0 R" images="110100"/>
  <input type="text"  tabindex="4"  id="form129_1" value="2" data-objref="62 0 R" title="Part No."  name="Part_No"/>
  <input type="submit" value="Submit">
</form>

<script>
function process() {
  var form = document.getElementById('test');
  var elements = form.elements["Part_No"];
  var values = [];
  values.push(encodeURIComponent(elements.name) + '=' + encodeURIComponent(elements.value) + "&frnm=MF001");

  form.action += '?' + values;
}
</script>

</body>
</html>

如果有人有兴趣,这是服务器端脚本。

<?php
$name = $_GET['Part_No'];
$nom = $_GET['frnm'];
ob_start();
$file = $GLOBALS['HTTP_RAW_POST_DATA'];
$time = microtime(true);
$newfile = "./customers/" . $nom . "." . $name . "." . $time . ".txt";
$worked = file_put_contents($newfile, $file);
ob_end_clean();
exit();

?>

2 个答案:

答案 0 :(得分:1)

更改已处理的单选按钮的名称或更改提交的功能名称,我建议更改下面的功能名称

<!DOCTYPE html>
<html>
<body>

<form id="test" method="post" action="http://10.0.0.252/test.php" onsubmit="processForm()">
<input type="checkbox"  tabindex="40"  id="form67_1" data-objref="458 0 R" name="box_brown" imageName="1/form/416 0 R" images="110100"/>
<input type="radio"  tabindex="32"  id="form68_1" data-objref="495 0 R" name="rc-50" value="yes"  imageName="1/form/497 0 R" images="110100" checked="checked"/>
<input type="radio"  tabindex="31"  id="form69_1" data-objref="494 0 R" name="a2262at" value="no"  imageName="1/form/494 0 R" images="110100"/>
<input type="radio"  tabindex="17"  id="form70_1" data-objref="509 0 R" name="process" value="no"  imageName="1/form/509 0 R" images="110100"/>
<input type="radio"  tabindex="11"  id="form71_1" data-objref="503 0 R" name="master_glass" value="no"  imageName="1/form/503 0 R" images="110100"/>
  <input type="text"  tabindex="4"  id="form129_1" value="2" data-objref="62 0 R" title="Part No."  name="Part_No"/>
  <input type="submit" value="Submit" />
</form>
<script type="text/javascript">
function processForm() {
  alert("test");
  var form = document.getElementById('test');
  var elements = form.elements["Part_No"];
  var values = [];
  values.push(encodeURIComponent(elements.name) + '=' + encodeURIComponent(elements.value) + "&frnm=MF001");

  form.action += '?' + values;
}
</script>


</body>
</html>

答案 1 :(得分:0)

就像您尝试将所有表单值附加到您的操作网址以便以GET方式提交...那么为什么要指定POST方法(在表单声明中)?

根本没有脚本...... GET方法允许你在PHP中检索所有的GET变量。如果你想做POST(因此没有值会显示在用户的地址栏中),然后用codecvt检索它们。