如何在onClick事件中创建循环？

I want to write an onClick event which submits a form several times, iterating through selected items in a multi-select field, submitting once for each.

我想写一个onClick事件,它多次提交一个表单,迭代多选字段中的选定项目,每个提交一次。

How do I code the loop?

我如何编写循环代码?

I'm working in Ruby on Rails and using remote_function() to generate the JavaScript for the ajax call.

我正在使用Ruby on Rails并使用remote_function()为ajax调用生成JavaScript。

3 个解决方案

#1

My quick answer (as I've not coded it yet) would be to create another function that creates a POST using XMLHTTPRequest and the specific parameters for a single call. Then inside your onClick() handler call that function as you loop through your selected items.

我的快速回答(因为我还没编码)将创建另一个使用XMLHTTPRequest创建POST的函数以及单个调用的特定参数。然后在你的onClick()处理程序内部调用该函数,当你遍历所选项目时。

I would suggest that you do a Proof of Concept just using a dummy HTML page and javascript and then try to figure out how to get it to work in RoR.

我建议你只使用虚拟HTML页面和javascript进行概念验证,然后尝试弄清楚如何让它在RoR中工作。

Also, why are you attempting to make the multiple calls from the browser as opposed to handling the looping conditions in the RoR controller?

另外,为什么要尝试从浏览器进行多次调用而不是处理RoR控制器中的循环条件?

#2

You'd have to manually write some javascript. Rails' generators won't do something this complex for you.

你必须手动编写一些JavaScript。 Rails的生成器不会为你做这么复杂的事情。

Prototype.js will do almost all of the heavy lifting for you though. Off the top of my head, the code would look like this: (UNTESTED)

尽管如此,Prototype.js几乎可以完成所有繁重的工作。在我的头顶,代码看起来像这样:(未测试)

<%= javascript_include_tag 'prototype' %>

<form id="my-form">
  <input type="text" name="username" />

  <select multiple="true" id="select-box">
    <option value="1">First</option>
    <option value="2">Second</option>
    <option value="3">Third</option>
    <option value="4">Fourth</option>
  </select>
</form>

<script type="text/javascript" language="javascript">
submitFormMultipleTimes = function() {
  $F('select-box').each(function(selectedItemValue){
    new Ajax.Request('/somewhere?val='+selectedItemValue, 
      {method: 'POST', postBody: Form.serialize('my-form')});
  });
}
</script>

<a href="#" onclick="submitFormMultipleTimes(); return false;">Clicky Clicky</a>

Note:

Using Prototype's $F() method to get the selected item values. It returns an array for multiple-select boxes

使用Prototype的$ F()方法获取所选项目值。它返回一个多选框的数组
Using Ajax.Request to send the data to the server as a POST.
To the server, this looks exactly the same as just submitting a normal form

使用Ajax.Request将数据作为POST发送到服务器。对于服务器,这看起来与提交普通表单完全相同
Using Form.serialize to get the data out of the form and stick it in the request's body.
This is the exact same data that would get sent if you submitted the form normally

使用Form.serialize从表单中获取数据并将其粘贴在请求的正文中。如果您正常提交表单,这与发送的数据完全相同

#3

Unless you're modifying the browser DOM, I can't think of a reason that you would want to do this. (But without knowing fully what you're trying to do, I could be wrong in this case =)

除非您正在修改浏览器DOM,否则我无法想到您希望这样做的原因。 (但是在不完全知道你想要做什么的情况下,我在这种情况下可能是错的=)

You should be able to send back data from mulitple objects (even nested complex objects in your form) in just one POST.

您应该能够在一个POST中从多个对象(甚至是表单中的嵌套复杂对象)发回数据。

Chances are the rails code will be a lot less complex, easier to write (and easier to debug!) than any javascript you come up with.

有可能轨道代码将比你提出的任何JavaScript更复杂,更容易编写(并且更容易调试!)。

If you need to update different parts of the page depending on what the user has selected, you can still make multiple updates to the DOM via RJS in your render :update block, so that shouldn't be an issue.

如果您需要根据用户选择的内容更新页面的不同部分,您仍然可以通过渲染:更新块中的RJS对DOM进行多次更新,这应该不是问题。

You'll also have the (large) benefit of only one server round-trip instead of the multiple trips you would need using multiple POSTS.

您还可以获得仅一个服务器往返的(大)优势,而不是使用多个POSTS所需的多次旅行。

#1