제출 후 양식 필드 값을 유지하기 위해 고급 검색 양식을 원했기 때문에 method = POST, ajax로 양식을 변경했습니다. 내 컨트롤러는 여전히 훌륭하게 작동하며 휴식을 취하고 데이터를 가져올 수 있습니다.AJAX에서 양식 제출을 통한 렌더링
문제는 아약스로 페이지를 다시 렌더링하는 방법을 모르겠다는 것입니다. 응답 로직이 advanced_search_order_table에 내장되어 있기 때문에 아약스가 응답과 관련이 없도록하고 싶지 않습니다. advanced_search_orders_table을 다시로드하기 위해서는 Ajax가 필요합니다.
<%= 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"/>
그리고 단순히 응답 자바 스크립트를 사용하여 구문 분석
function submitForm() {
$.ajax({type:'POST',url: '', data:$('#advancedSearchOrder').serialize(), success: function(response) {
/*Render advanced_search_orders_table here */
}});
return false;
}
'advanced_search_orders_form'의 모양은 무엇입니까? 'form_for'를 사용하지 않기로 결정한 이유가 있습니까? –
@SrikanthVenugopalan - 어떻게 도움이되는지 모르지만 레일즈 기능을 많이 사용했습니다 ... Mix & Match. –