如何使用onclick提交Rails AJAX表单 [英] How do I submit a Rails AJAX form using onclick

问题描述

我如何使用按钮在rails中提交AJAX表单？ $ p> 控制器：

def列表
@events = ExternalEvent.all
if！params [：city_id] .nil？
@events = @ events.where（city_id：params [：city_id]）
end
respond_to do | format |
format.js
format.html
end
end

list.js.erb：

$（'＃事件'）。html（<％= j render'events'％>）;

list.erb：

<％= javascript_include_tagjquery％>
<％= javascript_include_tagapplication％>
< div id ='events'>
<％=渲染'events'％>
< / div>

_events.erb：

<％= form_tag（'/ list'，remote：true）do％>
< input name ='city_id'value ='2'>
< input type ='提交'>
<％end％>
< table>
<@ for事件在@events％>
< tr>
< td>
<％= event.name％>
< / td>
< / tr>
<％end％>
< / table>


点击提交，AJAX表单已成功提交。

但是，如何从表单外部提交表单。
使用

 < input type ='button'onclick =document.getElementById（'get_event'）。onsubmit （）value =更改城市> 
  

返回JavaScript错误

  Uncaught TypeError：object is not a function 
 onclick 
  

如何从外部提交此表单？

解决方案

使用以下方式

 < form id =get_event> 
< input type ='button'onclick =document.getElementById（'get_event'）。submit（）; value =更改城市> 
< / form> 
  

issubmit（）不是一个函数，但是submit（）是。

对于AJAX ，使用Ajax调用来提交没有页面重新加载的表单：

 < form id =get_event> 
< input type ='button'onclick =submitFrmAjax（）; value =更改城市> 
< / form> 
 
< script> 
函数submitFrmAjax（）{
 $ .ajax（{
 //你的ajax代码在这里通过AJAX提交，参考jquery网站，我给了例如。
 url：你的URL或文件名在服务器上，
 data：$（form）。serialize（）
}）; 
} 
< / script> 
  

定期提交演示

演示：示例ajax提交，请参阅firebug中的网络选项卡

How can I submit an AJAX form in rails by using a button?

My Code:

Controller:

def list
  @events = ExternalEvent.all
  if !params[:city_id].nil?
    @events = @events.where(city_id: params[:city_id])
  end
  respond_to do |format|
    format.js
    format.html
  end
end

list.js.erb:

$('#events').html("<%= j render 'events' %>");

list.erb:

<%= javascript_include_tag "jquery" %>
<%= javascript_include_tag "application" %>
<div id='events'>
  <%= render 'events' %>
</div>

_events.erb:

<%= form_tag('/list', remote: true) do %>
  <input name='city_id' value='2'>
  <input type='Submit'>
<% end %>
<table>
  <% for event in @events %>
    <tr>
      <td>
        <%= event.name %>
      </td>
    </tr>
  <% end %>
</table>

On clicking submit the AJAX form is submitted successfully.

But how do I submit the form from outside the form. Using

<input type='button' onclick="document.getElementById('get_event').onsubmit()" value="Change City">

returns a JavaScript error

Uncaught TypeError: object is not a function
  onclick

How do I submit this form externally?

解决方案

Use following way

<form id="get_event">
<input type='button' onclick="document.getElementById('get_event').submit();" value="Change City">
    </form>

issubmit() is not a function , but submit() is.

For AJAX use Ajax call to submit form without page reload :

<form id="get_event">
<input type='button' onclick="submitFrmAjax();" value="Change City">
</form>

<script>
    function submitFrmAjax(){
       $.ajax({
    //Your ajax code here to submit from via AJAX. refer jquery site . I gave sample eg.
             url : "Your URL or file name on server",
             data : $("form").serialize()
        });
    }
</script>

Demo for Regular Submit

Demo : Sample ajax submit , see network tab in firebug

这篇关于如何使用onclick提交Rails AJAX表单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！