通過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中的表單提交呈現

回答

相關問題