通过AJAX中的表单提交呈现

我希望我的高级搜索表单在提交后保留表单字段值，所以我将method = POST更改为ajax。我的控制器仍然工作得很好，我可以拨打其余的电话，并获得数据。通过AJAX中的表单提交呈现

问题是我不知道如何使用ajax再次渲染页面。我不想让ajax与响应有关，因为响应逻辑已内置到advanced_search_order_table中。我只需要Ajax来重新加载advanced_search_orders_table。

<%= render "advanced_search_orders_form" %> 
<div id="advanced_search_orders_table" class="fk-table ajax"> 
    <%= render "advanced_search_orders_table" %> 
</div>

在advanced_search_orders_form.html.erb（只有部分片段）

form id="advancedSearchOrder" name="advancedSearchForm" value="advancedSearch" class=" search line" action="" onsubmit="return submitForm();"> 

<div class="advancedSearchFormField"> 
     <span class="advancedSearchFormlabel">Order Id</span> 
     <%= text_area_tag('filters[order_id]',filter_params['order_id'],:rows=>10) %> 
</div> 

<div class="advancedSearchFormSelectField"> 
    <span class="advancedSearchFormlabel"> Order Sales Channel </span> 

    <%= select_tag 'filters[order_sales_channel]', 
        options_for_select(
          [["Web", "Web"], ["Phone", "Phone"]] 
       ), 
        selected: filter_params['order_sales_channel'], 
        multiple: true, 
        class: "advancedSearchFormSelectBox" %> 
</div> 

<input type="submit" class="advanced-search-btn" id="advancedSearchButton" name="advancedSearchButton" value="Search"/>

而且我已经定义submitForm为

function submitForm() { 
    $.ajax({type:'POST',url: '', data:$('#advancedSearchOrder').serialize(), success: function(response) { 
     /*Render advanced_search_orders_table here */ 
    }}); 

    return false; 
}

来源

2013-03-24 Pratik Bothra

'advanced_search_orders_form'看起来像什么？你选择不使用'form_for'有什么原因吗？ – 2013-03-24 11:37:55

@SrikanthVenugopalan - 不知道这有什么帮助，但我也使用了很多Rails功能...... Mix＆Match。 – 2013-03-24 11:46:20

简单解析使用JavaScript你的回应。基本上从表中删除行，然后为每个结果添加一行。您还可以添加一些不错的动画;）

另一个选择是使用包含数据的已经呈现的HTML页面来响应该AJAX调用，并且只需用新的HTML页面替换表格（再次使用JavaScript）即可。我无法分辨哪个表现会更好。

来源

2013-03-24 15:11:35 mart1nn

通过AJAX中的表单提交呈现

回答

相关问题