0

我希望我的高级搜索表单在提交后保留它的表单字段值,所以我将带有 method=POST 的表单更改为 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;
}
4

1 回答 1

0

只需使用 JavaScript 解析您的响应。基本上从表中删除行,然后为每个结果添加一行。您也可以添加一些不错的动画;)

另一种选择是使用已呈现的包含数据的 HTML 页面响应该 AJAX 调用,您只需将表替换为新的表(再次使用 JavaScript)。我不知道哪个会更好。

于 2013-03-24T15:11:35.613 回答