एक डीवी तत्व में जीडब्ल्यूटी विजेट डालने

Question

मैं एक जीडब्ल्यूटी लाइब्रेरी (gwt-openlayers) का उपयोग कर रहा हूं जो मुझे Google मानचित्र के समान मनमाने ढंग से HTML युक्त नक्शा पॉपअप बनाने की अनुमति देता है। मुझे इस एचटीएमएल को एक जीडब्ल्यूटी बटन विजेट रखने की आवश्यकता है।

Element outerDiv = DOM.createDiv(); 
outerDiv.getStyle().setOverflow(Overflow.HIDDEN); 
outerDiv.getStyle().setWidth(100, Unit.PCT); 
outerDiv.appendChild(new HTML(mapPOI.getHtmlDetails()).getElement()); 
Button popupButton = new Button("View Property"); 
popupButton.getElement().getStyle().setFloat(com.google.gwt.dom.client.Style.Float.RIGHT); 
outerDiv.appendChild(popupButton.getElement()); 

तो मैं इन तत्वों के लिए स्रोत HTML हो रही है

बुला और इस एचटीएमएल डालने से:

मैं इस तरह ऑन-द-मक्खी कुछ HTML तत्वों बना रहा हूं मेरे मानचित्र मार्कर में। अब मेरा नक्शा मार्कर बटन सहित सामग्री ठीक से प्रदर्शित करता है। हालांकि, बटन किसी भी घटना का जवाब नहीं देगा! जो मैं इकट्ठा कर सकता हूं, ऐसा इसलिए है क्योंकि एटैच() विधि पर बटन कभी नहीं कहा जा रहा है।

क्या ऐसा करने का कोई बेहतर तरीका है?

धन्यवाद,

जॉन

~~~~ संपादित ~~~~

मैं अब स्वीकार कर लिया विधि की तलाश में होना करने के लिए इस है, जो लगता है ऐसा करने का एक नया तरीका कोशिश कर रहा हूँ अन्य समान पदों पर।

सबसे पहले मैं अपने div बना रहा हूं:

String divId = "popup-" + ref; 
String innerHTML = "<div id=\"" +divId + "\"></div>"; 

तब मैं अपने मानचित्र पॉपअप को यह जोड़ रहा है और यह प्रदर्शित (जो यह डोम के लिए कहते हैं)। बाद पॉपअप प्रदर्शित किया गया है, मैं तत्व इस प्रकार हो रही है और इसके चारों ओर एक HTMLPanel रैप करने के लिए कोशिश कर रहा है:

Element element = Document.get().getElementById(divId); 
HTMLPanel popupHTML = HTMLPanel.wrap(element); 

मेरे div तत्व सफलतापूर्वक लिया गया है। हालांकि, HTMLPanel.wrap(element); पूरा नहीं हुआ है।

assert !widgetsToDetach.contains(widget) : "detachOnUnload() called twice " 
    + "for the same widget"; 
assert !isElementChildOfWidget(widget.getElement()) : "A widget that has " 
    + "an existing parent widget may not be added to the detach list"; 

मैं में कुछ breakpoints डाल दिया और यह है कि 2 दावे विफल हो रहा है लगता है: इस का कारण यह है कि wrap(..) कॉल RootPanel.detachOnWindowClose(Widget widget) है, जो निम्नलिखित दावे भी शामिल है!

क्या किसी को कोई विचार है कि यह मामला क्यों हो सकता है? इस दावे को विफल करने में वास्तव में विधि की पूरी विफलता (कोई वापसी नहीं) होनी चाहिए?

Answer 1

आपका पहला दृष्टिकोण अच्छा है, तो आप सिर्फ इस तरह अपने बटन के लिए onClick ईवेंट रजिस्टर करने की आवश्यकता:

DOM.sinkEvents(popupButton.getElement(), Event.ONCLICK); 
DOM.setEventListener(popupButton.getElement(), new EventListener() { 
    @Override 
    public void onBrowserEvent(Event event) { 
     //implement the logic after click 
    } 
}); 

मैं इस जाँच की है, यह 100% काम करता है!

Answer 2

आप देखें RootPanel.get()

दुर्भाग्य से, RootPanels AbsolutePanels जो लेआउट के लिए बहुत अच्छा नहीं कर रहे हैं, लेकिन अगर आप सिर्फ जोड़ने का सरल बटन काम कर सकता हैं जैसे

RootPanel.get("idOfYourMapMarker").add(popupButton); 

कुछ कोशिश कर सकते हैं। आप RootLayoutPanel को भी आजमा सकते हैं जो आपको लेआउटपैनेल देगा (जब आप चीजों को प्रवाह करना चाहते हैं तो भी इतना अच्छा नहीं है)। आप एक कंटेनर विजेट बनाना समाप्त कर सकते हैं जो आपके लिए लेआउट करता है, और को रूटपनेल में जोड़ता है।

Answer 3

आपने तत्व जोड़ा, लेकिन आपको वास्तविक जीडब्ल्यूटी विजेट्स का पदानुक्रम भी रखना है।

मुझे यह करने का एक साफ तरीका नहीं दिख रहा है, लेकिन आप बटन और आईडी को बटन पकड़ने के लिए jQuery जैसे कुछ का उपयोग कर सकते हैं और उस पर एक क्लिक हैंडलर जोड़ सकते हैं जो मूल क्लिक हैंडलर को कॉल करेगा।

private static native void registerEvents(String buttonId, MyClass instance)/*-{ 
    var $ = $wnd.$; 

    //check click 
    $('#'+buttonId).live('click', function(e) { 
     e.preventDefault(); 
     instance.@com.package.MyClass::handleButtonClick(Lcom/google/gwt/event/dom/client/ClickEvent;)(null); 
    }); 
}-*/; 

इस रजिस्टर को कॉल करें() या तो अपने ऑन या कन्स्ट्रक्टर में।

Answer 4

सरलपैन एक डीआईवी है। शायद इसके बजाय इस्तेमाल किया जा सकता है?

Answer 5

मुझे एक बार एक ही समस्या थी। यह लम्बवत या क्षैतिज हो

private MapWidget createMapWidget() { 
    final MapOptions defaultMapOptions = new MapOptions(); 
    defaultMapOptions.setDisplayProjection(DEFAULT_PROJECTION); 
    defaultMapOptions.setNumZoomLevels(TOTAL_ZOOM_LEVELS); 

    MapWidget mapWidget = new MapWidget(MAP_WIDGET_WIDTH, MAP_WIDGET_HEIGHT, defaultMapOptions); 

    map = mapWidget.getMap(); 

    return mapWidget; 
} 

और फिर किसी भी पैनल में जोड़ने: आप का उपयोग gwt-openlayer के MapWidget इस प्रकार कर सकते हैं।

MapWidget mapWgt = createMapWidget(); 

VerticalPanel mainPanel = new VerticalPanel(); 
mainPanel.add(mapWgt); 
... 
... add whatever you want 
... 

आप अंत में बनाया PanelPopupPanel को (MapWidget और gwt विजेट युक्त) जोड़ सकते हैं। इसके अलावा, अब आप gwt बटन में हैंडलर जोड़ने में सक्षम होना चाहिए।