提交2个带有链式下拉菜单和单个提交按钮的表单

时间:2014-08-07 08:32:30

标签: javascript html forms

我在金融系统工作,目前我正在开发一个查询面板来比较不同年份的项目。

我的问题是如何创建包含链式值的2个表单并使用单个提交按钮提交数据?

这就是它的样子:

http://oi60.tinypic.com/2e31gk4.jpg

我试图使用这篇文章的答案(Submit two forms with one button)但对我不起作用。

到目前为止,这是代码:

<body>
<form name="doublecombo">
<p><select name="category" size="1" onChange="redirect(this.options.selectedIndex)">
<option>Group_1</option>
<option>Group_2</option>
<option>Group_3</option>
</select>
<select name="type_item" size="1">
<option value="value1">Subitem 1 Group_1</option>
<option value="value2">Subitem 2 Group_1</option>
<option value="value3">Subitem 3 Group_1</option>
</select>
<input type="submit" name="submit" value="Get Data"
onClick="go()">
</p>

  <script>
var groups=document.doublecombo.category.options.length
var group=new Array(groups)
for (i=0; i<groups; i++)
group[i]=new Array()

group[0][0]=new Option("Subitem 1 Group_1","value1")
group[0][1]=new Option("Subitem 2 Group_1","value2")
group[0][2]=new Option("Subitem 3 Group_1","value3")

group[1][0]=new Option("Subitem 1 Group_2","value1")
group[1][1]=new Option("Subitem 2 Group_2","value2")

group[2][0]=new Option("Subitem 1 Group_3","value1")
group[2][1]=new Option("Subitem 2 Group_3","value2")
group[2][2]=new Option("Subitem 3 Group_3","value3")
group[2][3]=new Option("Subitem 4 Group_3","value4")

var temp=document.doublecombo.type_item

function redirect(x){
for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null
for (i=0;i<group[x].length;i++){
temp.options[i]=new Option(group[x][i].text,group[x][i].value)
}
temp.options[0].selected=true
}

function go(){
location=temp.options[temp.selectedIndex].value
}
//-->
  </script>


</form><!-- -->

任何帮助都会非常感激,我会坚持这个功能。

1 个答案:

答案 0 :(得分:0)

在go方法中,您应该更改表单的动作attr并提交它。

function go(event){
  var combo = document.doublecombo.type_item;
  document.doublecombo.action = combo.options[combo.selectedIndex].value;
  //u can manually submit, but you should prevent default action
  document.doublecombo.submit();
  event.preventDefault();
  //or just leave it, because clicking to submit input will automatically submit the form
}

和输入

    <input type="submit" name="submit" value="Get Data" onClick="go(event);">