SpringMVC，jquery，瓷磚和部分重新渲染

我試圖做我的網站，使用春天mvc 3.1，瓷磚2和jQuery的部分呈現。SpringMVC，jquery，瓷磚和部分重新渲染

這裏是我的春天的conf：

<beans:bean class="org.springframework.js.ajax.AjaxUrlBasedViewResolver"> 
    <beans:property name="viewClass" value="org.springframework.js.ajax.tiles2.AjaxTilesView"/> 
</beans:bean>

我的瓷磚CONF：

<definition name="productSearch" extends="baseLayout"> 
    <put-attribute name="mainSection"> 
     <definition template="/WEB-INF/views/productSearch.jsp"> 
      <put-attribute name="productSearchResults" value="/WEB-INF/views/productSearchResults.jsp" /> 
     </definition> 
    </put-attribute> 
</definition>

正如你看到有一個名爲「productSearchResults」嵌套屬性。這是結果頁面，我希望通過ajax重新呈現此頁面。

我的控制器：

@RequestMapping(params = "search=true", value = "/", method = RequestMethod.POST) 
public String searchHandler(@Valid final SearchFormBean searchformBean, final Model model) { 
    model.addAttribute("productsList", productsService.findProducts(searchformBean.getSearchCriteria())); 
    return "productsSearch"; 
}

我的JSP：

productsSearch.jsp：

<form:form id="product-search-form" method="post" modelAttribute="productSearchFormBean"> 
    <input type="hidden" name="search" value="" /> 
    <form:input path="searchCriteria.name" /> 
    // AND SOME OTHER FIELDS... 
    <button type="submit" onclick="this.form.search.value='true';">Search</button> 
</form>

productSearchResults.jsp：

<div id="products-result"> 
    <div id="search-results-info" class="section-content"> 
      Order results : 
     <form:select path="searchCriteria.resultsSort"> 
      <form:option value="orderByName">Name</form:option> 
      <form:option value="orderByDame">Date</form:option> 
     </form:select> 
    </div> 

    <div id="products-content" class="section-content">     
     <c:forEach var="product" items="${productsList}"> 
      <article> 
       // PRODUCT INFORMATIONS DISPLAYED HERE... 
      </article> 
     </c:forEach> 
    </div> 
</div>

終於列入.js文件在公關oductSearch.jsp：

$('select[id="searchCriteria.resultsSort"]').change(function() { 
    $.ajax({ 
     type : "POST", 
     url : "/myapp/product/search/", 
     data : "search=true&fragments=productSearchResults", 
     success : function(response) { 
      $("#search-results").html(response); 
     }, 
     error : function(e) { 
      alert('Error : ' + e); 
     } 
    }); 
});

所以這裏的東西：每當我在productsSearchResults.jsp頁面改變「searchCriteria.resultsSort」選擇價值的時候，我想要的結果瓷磚重新加載（無需重新加載整個頁面）。使用上面給出的代碼，我設法重新呈現整個頁面（包括html標記...），而不僅僅是感興趣的部分。

任何暗示如何實現我的目標？這是真的可能或者我誤解了部分渲染原理？

來源

2012-02-13 Christos Loupassakis

我發現了什麼事，所以我回答我的問題...

我只是改變了JavaScript代碼到這一點：

$('select[id="searchCriteria.resultsSort"]').change(function() { 
$.ajax({ 
    type : "POST", 
    beforeSend : function(req) { 
     req.setRequestHeader("Accept", "text/html;type=ajax"); 
    }, 
    url : "/myapp/product/search/", 
    data : "search=true&fragments=productSearchResults", 
    success : function(response) { 
     $("#search-results").html(response); 
    }, 
    error : function(e) { 
     alert('Error : ' + e); 
    } 
}); 
});

而現在它的作品！

由於部分重新渲染，似乎「searchCriteria.resultsSort」選擇器不再映射到窗體，一旦頁面重新加載到屏幕上，所以我還必須將此行添加到我的控制器：

model.addAttribute("searchCriteria", searchformBean.getSearchCriteria());

這一切！希望它可以幫助其他人。

來源

2012-02-15 12:21:57

SpringMVC，jquery，瓷磚和部分重新渲染

回答

相關問題