2010-10-30 10 views
6

मैं वसंत एमवीसी के लिए काफी नया हूं, और पूरे पृष्ठ को रीफ्रेश किए बिना आंशिक दृश्य प्रस्तुत करने का तरीका जानने का प्रयास कर रहा हूं। मैं सोचा:स्प्रिंग एमवीसी में आंशिक जेएसपी टुकड़े प्रस्तुत करें?

  • अगर मैं एक स्प्रिंग नियंत्रक विधि

  • इस मामले में, बैकएंड के लिए एक अनुरोध पोस्ट कर सकते हैं, और इस विधि मॉडल विशेषता में भर जाता है, और अगर फिर साथ ModelAndView ऑब्जेक्ट प्रदान एक जेएसपी फ़ाइल में निर्दिष्ट दृश्य नाम मैपिंग, और जेएसपी आवश्यक HTML खंड उत्पन्न करने में सक्षम है।

  • लौटा हुआ HTML खंड डीआईवी प्लेसहोल्डर में डाला जाएगा।

यह शायद काम नहीं करेगा, लेकिन मुझे यकीन नहीं है कि इसमें क्या गलत है? जब तक जेएसपी को दृश्य प्रस्तुत करने के लिए कहा जाता है, तब तक मुझे मिला, लेकिन किसी कारण से, सत्र में डाल दिया गया मॉडल विशेषता वहां प्रतीत नहीं होती है।

मैं इस बात पर सराहना करता हूं कि समान अनुभव वाले किसी भी व्यक्ति इस विषय पर कुछ उदाहरण प्रदान कर सकता है, या मुझे इंगित कर सकता है कि यह संभावित रूप से गलत कहां गया है।

मैंने स्प्रिंग वेब प्रवाह से कुछ पढ़ा है ताकि खंडित दृश्य के साथ अजाक्स अनुरोध को संभाला जा सके, लेकिन मुझे यकीन नहीं है कि मुझे यह वास्तव में कैसे काम करता है इस बारे में विचार मिलता है।

अग्रिम धन्यवाद।

ओलिवर

+0

प्रतिक्रिया में केवल एक ही HTML टुकड़ा प्राप्त करें अपने नियंत्रक से कुछ कोड प्रदान करें। – heikkim

उत्तर

-1

आप सोचा था कि के रूप में आप अजाक्स की आवश्यकता होगी नए HTML सामग्री प्राप्त करने और अपने वर्तमान HTML पृष्ठ में सम्मिलित करने के लिए। इसे इस सामग्री को लोड करने के लिए आप jquery लाइब्रेरी का उपयोग कर सकते हैं, विशेष रूप से इसके फ़ंक्शन load()। इस लिंक में इसके उपयोग के उदाहरण हैं।

आपको एक नियंत्रक विधि की भी आवश्यकता है जो एक जेएसपी से एचटीएमएल कोड देता है जैसा आप कर रहे थे। विधि को एक यूआरएल के साथ मैप किया जाना चाहिए जिसे आपको AJAX के लोड() फ़ंक्शन में उपयोग करना चाहिए। यदि आपको वसंत के साथ जेएसपी में विशेषताओं को प्रवृत्त करने में समस्याएं हैं तो यह देखने के लिए कि क्या गलत हो सकता है, प्रश्न में कुछ कोड जोड़ें।

8

मैं नहीं कहूंगा कि मेरा उत्तर नीचे आपके प्रश्न का उत्तर दे, लेकिन मैं इस पृष्ठ पर Google के माध्यम से पहुंचे, जबकि मैं वसंत AjaxEventDecoration (जो केवल एक पृष्ठ के टुकड़े लोड करता है) को दोहराने का प्रयास कर रहा था, तो यहां मेरे पास है अब किसी और के यहां आने के मामले में पता चला है:

त्वरित उत्तर यह सुनिश्चित करना है कि आप XMLHttpRequest की 'स्वीकार करें' संपत्ति 'टेक्स्ट/एचटीएमएल; टाइप = एजेक्स' पर सेट करें जो तब स्प्रिंग एमवीसी को बताती है कि केवल (कॉमा अलग) यूआरएल पैरामीटर 'खंड' द्वारा निर्दिष्ट टुकड़े वापस किया जाना चाहिए।

एक उदाहरण webmvc-config:

मैं Tiles सर्वर साइड और jQuery ग्राहक के पक्ष का उपयोग कर रहा, यह मेरा सेटअप का एक मोटा अवलोकन है।एक्सएमएल

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

एक उदाहरण पृष्ठ की टाइलें विन्यास

<!DOCTYPE tiles-definitions PUBLIC 
     "-//Apache Software Foundation//DTD Tiles Configuration 2.0//EN" 
     "http://tiles.apache.org/dtds/tiles-config_2_0.dtd"> 

<tiles-definitions> 

    <definition name="eventPage" extends="twoColumnLayout"> 
     <put-attribute name="title" value="My Event Page" /> 
     <put-attribute name="view" value="/WEB-INF/jsp/viewText.jsp" /> 
     <put-attribute name="objectViewer" value="/WEB-INF/jsp/viewEvent.jsp" /> 
    </definition> 

</tiles-definitions> 

मैं एक जावा नियंत्रक वर्ग कि ModelMap उस अनुरोध को 'eventPage' (करने के लिए मैप किया गया है का एक उदाहरण देता है मेरे मामले में एचटीएमएल)।:

@Controller 
public class EventPageController 
{ 
    /** 
    * Method to handle main my events page. 
    */ 
    @RequestMapping(value = "/eventPage.html", method = RequestMethod.GET) 
    public ModelMap pageDisplayHandlerForEvents(ModelMap model, HttpServletRequest req) 
    { 
     ... 
    } 
} 

और फिर मेरी जावास्क्रिप्ट क्लाइंट-साइड कोड (कि उदाहरण के लिए खातिर हमेशा 'objectViewer' टुकड़ा लोड करता है):

नोट: आपके HTML तत्वों कि टुकड़े एक होना आवश्यक है के रूप में लोड किए गए हैं आईडी विशेषता जो टुकड़े आईडी से मेल खाती है।

$(".springFragmentLoader").click(function() 
{ 
    $.ajax(__contextRoot + "/eventPage.html?fragments=objectViewer", { 
     beforeSend: function(req) { 
      req.setRequestHeader("Accept", "text/html;type=ajax"); 
     }, 
     complete : function(jqXHR) 
     { 
      $("#objectViewer").html(jqXHR.responseText); 
     } 
    }); 
} 

अधिक जानकारी के लिए Handling Ajax Requests देखें।

उम्मीद है कि मदद करता है।

0

एड के जवाब के अलावा:

<tiles-definitions> 
    <definition extends="partial" name="partial/listOfProcessesPartial"> 
     <put-attribute name="partialView" value="/WEB-INF/views/partial/listOfProcessesPartial.jspx"/> 
    </definition> 
: मैं अपने layouts.xml के लिए निम्न है, जो लेआउट कॉन्फ़िगर

<tiles-definitions> 
.... 

    <definition name="partial" template="/WEB-INF/layouts/partial.jspx"> 
    </definition> 
.... 
</tiles-definitions> 

partial.jspx आंशिक दृश्य के लिए

<div xmlns:jsp="http://java.sun.com/JSP/Page" xmlns:tiles="http://tiles.apache.org/tags-tiles"> 
    <jsp:directive.page contentType="text/html;charset=UTF-8"/> 
    <jsp:directive.page pageEncoding="UTF-8"/> 
    <jsp:output omit-xml-declaration="yes"/> 
    <tiles:insertAttribute name="partialView"/> 
</div> 

विन्यास है जोड़ा

तो आप बस अपने नियंत्रक से कुछ दृश्य वापस कर दें और

संबंधित मुद्दे