GWT RichTextArea

Question

में स्थिति को कैसे सेट करें GWT RichTextArea में cusror स्थिति सेट करने का कोई तरीका है। TextArea में ऐसा करने के लिए विधि सेट CusrorPosition() है, लेकिन RichTextArea में नहीं। शायद एक मूल जावास्क्रिप्ट (जिसे जीडब्ल्यूटी से कहा जाता है) है जो कि RichTextArea में कर्सर की स्थिति सेट कर सकता है?

Answer 1

आप सही हैं RichTextArea setSelectionRange विधि प्रदान नहीं कर रहा है, लेकिन मैंने JSNI का उपयोग करके एक बनाया है।

नीचे तरीका है,

public native void setSelectionRange(Element elem, int pos, int length) /*-{ 
    try { 
     var selection = null, range2 = null; 
     var iframeWindow = elem.contentWindow; 
     var iframeDocument = iframeWindow.document; 

     selection = iframeWindow.getSelection(); 
     range2 = selection.getRangeAt(0); 

     //create new range 
     var range = iframeDocument.createRange(); 
     range.setStart(selection.anchorNode, pos); 
     range.setEnd(selection.anchorNode, length); 

     //remove the old range and add the newly created range 
     if (selection.removeRange) { // Firefox, Opera, IE after version 9 
      selection.removeRange(range2); 
     } else { 
      if (selection.removeAllRanges) { // Safari, Google Chrome 
       selection.removeAllRanges(); 
      } 
     } 
     selection.addRange(range); 
    } catch (e) { 
     $wnd.alert(e); 
    } 
}-*/; 

कोड नीचे दी गई विधि लिखने से ऊपर का उपयोग कर के लिए:

final RichTextArea tr = new RichTextArea(); 
    Button b = new Button("Test"); 
    b.addClickHandler(new ClickHandler() { 

     @Override 
     public void onClick(ClickEvent event) { 
      setSelectionRange(tr.getElement(), 15, 20); 
      tr.setFocus(true); 
     } 
    }); 
    RootPanel.get().add(tr); 
    RootPanel.get().add(b); 

नोट: "स्थिति" और "लंबाई" का सत्यापन जांच में डाल करने के लिए याद है आप कर रहे हैं setSelectionRange() विधि में गुजर रहा है। इस कोड का परीक्षण आईई 9, एफएफ, क्रोम में किया गया था।

Answer 2

यह सुनिश्चित नहीं है कि यह अभी भी आवश्यक है, लेकिन मैं पूरे दिन यह काम करने की कोशिश कर रहा हूं और अंततः समाधान के लिए अपना रास्ता हैक करने में कामयाब रहा हूं। इसका क्रोम/सफारी में परीक्षण किया गया है। उम्मीद है कि यह किसी की मदद करता है।

public static native void setCursor(Element elem, int pos, int length) /*-{ 
    var node = elem.contentWindow.document.body; 
    var range = elem.contentWindow.getSelection().getRangeAt(0); 

    var treeWalker = $doc.createTreeWalker(node, NodeFilter.SHOW_TEXT, function(node) { 
     var nodeRange = $doc.createRange(); 
     nodeRange.selectNodeContents(node); 
     return NodeFilter.FILTER_ACCEPT; 
    }); 

    var charCount = 0; 
    while (treeWalker.nextNode()) { 
     if (charCount + treeWalker.currentNode.length > pos) 
      break; 

     charCount += treeWalker.currentNode.length; 
    } 

    var newRange = elem.contentWindow.document.createRange(); 
    newRange.setStart(treeWalker.currentNode, 1); 
    newRange.setEnd(treeWalker.currentNode, 1); 

    var selection = elem.contentWindow.getSelection(); 

    if (selection.removeRange) { // Firefox, Opera, IE after version 9 
     selection.removeRange(range); 
    } else if (selection.removeAllRanges) { // Safari, Google Chrome 
     selection.removeAllRanges(); 
    } 

    selection.addRange(newRange); 
}-*/; 

इस कोड को मामूली वाक्यविन्यास त्रुटियों को सुधारने के लिए 28 नवंबर, 2016 को संपादित किया गया था।