Jquery自动填充提交表单

时间:2012-03-21 14:19:33

标签: php jquery input

我正在转换旧的双下拉框搜索表单。使用旧方法,使用以下方法在每个用户选择上提交表单:

<form name="navTwo">
<select name="item" id="item" onChange="document.location.href=document.navTwo.game.options[document.navTwo.game.selectedIndex].value">  

旧方法的问题在于用户被迫通过包含越来越多选项的第二个下拉列表来查看。

我选择使用一个自动提交下拉列表和一个新的jquery类型提前搜索字段进行新搜索(感谢Jamie McConnell,jamie @ blue44.com)。未来的类型一切都很好。但是,一旦用户选择提前输入项目,我无法弄清楚如何提交新表单。理想情况下,我想强制用户在选择第二项后点击提交。

我已经尝试携带第二个搜索项的id并将其放在隐藏的输入中,但我无法将变量设置为id。这是我到目前为止所尝试的,但没有成功;

//页面名称为dash3.php
//如果list = 1,它将添加记录
// jquery的东西工作正常,它将值添加到输入字段,我需要它来获取该记录的id,而不仅仅是标题。 $ vid是空的,不知道如何设置它 //下面的代码缺少提交按钮,我尝试添加一个链接,以便我可以看到变量。

<form name="nav">
 <div>
   Start typing the name of the item, select the correct title when it appears:<br />
   <input type="text" size="30" value="" id="inputString" onkeyup="lookup(this.value);" onblur="fill();" />
   <input type="hidden" value="?list=1&ptfm_ctrl=1&vid=<?=$vid?>" />
 </div>

 <div class="suggestionsBox" id="suggestions" style="display: none;">
 <img src="upArrow.png" style="position: relative; top: -12px; left: 30px;" alt="upArrow" />
 <div class="suggestionList" id="autoSuggestionsList">&nbsp;
 </div>
 </div>
<a href="dash3.php?list=1&hid=<?=$hid?>&vid=<?=$vid?>"><strong>+</strong></a>
</form>

所以,让我的问题更清楚;

如何通过jquery自动完成脚本获取放置在输入字段中的预先记录类型的id,并将带有此id的自引用表单添加到同一页面?

非常感谢!

1 个答案:

答案 0 :(得分:0)

自动填充文档中的此示例可能会有所帮助:http://jqueryui.com/demos/autocomplete/#custom-data

我们的想法是,您使用足够的数据填充自动填充框,以便用户选择正确的选项,然后提供id并挂钩success事件。

select: function( event, ui ) { ... }

这可能有助于您入门:http://jsfiddle.net/shanabus/HGF59/

执行类似更新表单操作的操作,而不是触发第二个下拉列表选项的警报:

$("#myForm").attr("action", $("#myForm").attr("action") + "/" + ui.item.id);

然后根据需要提交。希望这有帮助!

相关问题