захват выбранного текста из inputTextArea primefaces jsf

Question

Я хочу захватить выделенный текст из inputTextArea на ajax dblclick или select event.How можно сделать это? Код ниже выбирает все в текстовой области (чего я не хочу). Большое спасибо.

<h:form id="form">   
     <p:panel header="Select Text"> 
      <h:panelGrid columns="3" cellpadding="5"> 
       <h:outputText value="Text: " /> 
       <p:inputTextarea id="textarea" 
          value="#{selectedTextBean.selectedText}"> 
        <p:ajax event="select" update="selectedText" /> 
       </p:inputTextarea> 
       <h:outputText id="selectedText" 
          value="#{selectedTextBean.selectedText}" /> 
      </h:panelGrid> 
     </p:panel>    
</h:form> 

Вот SelectedTextBean

@ManagedBean 
@ViewScoped 
public class SelectedTextBean { 

    public SelectedTextBean() { 
    } 
    private String selectedText; 

    public String getSelectedText() { 
    return selectedText; 
    } 
    public void setSelectedText(String selectedText) { 
    this.selectedText = selectedText; 
    } 
} 

Answer 1

Вы можете сделать это отправив параметр в удаленную команду следующим образом:

Взгляд

<h:form id="form">   
    <p:panel header="Select Text"> 
     <h:panelGrid columns="3" cellpadding="5"> 
      <h:outputText value="Text: " /> 
      <h:panelGroup> 
       <p:inputTextarea id="textarea" 
           value="#{selectedTextBean.selectedText}" onselect="processSelection();" /> 
       <p:remoteCommand name="sendSelection" actionListener="#{selectedTextBean.onSelect}" update="selectedText" process="@this" /> 
      </h:panelGroup> 
      <h:outputText id="selectedText" 
          value="#{selectedTextBean.selectedText}" /> 
     </h:panelGrid> 
    </p:panel>    
</h:form> 
<script> 
    function processSelection() { 
     var selectedText = (!!document.getSelection) ? document.getSelection() : 
       (!!window.getSelection) ? window.getSelection() : 
       document.selection.createRange().text; 
     sendSelection([{name: 'selectedText', value: selectedText}]); 
    } 
</script> 

Обратите внимание, что text selection изменения в зависимости в браузере.

Бин

import java.io.Serializable; 
import java.util.Map; 
import javax.faces.bean.ManagedBean; 
import javax.faces.bean.ViewScoped; 
import javax.faces.context.FacesContext; 

@ManagedBean 
@ViewScoped 
public class SelectedTextBean implements Serializable { 

    public SelectedTextBean() { 
    } 
    private String selectedText; 

    public void onSelect() { 
     FacesContext context = FacesContext.getCurrentInstance(); 
     Map map = context.getExternalContext().getRequestParameterMap(); 
     selectedText = (String) map.get("selectedText"); 
    } 

    public String getSelectedText() { 
     return selectedText; 
    } 

    public void setSelectedText(String selectedText) { 
     this.selectedText = selectedText; 
    } 
} 

Answer 2

Вы можете использовать этот плагин jquery-textrange.

XHTML

<p:inputTextarea onselect="setSelectedText()" />      
<p:remoteCommand name="setSelectedTextCommand" 
       actionListener="#{mainBean.setSelectedText()}" 
       update="currentSelectedText" /> 
Selected Text is: 
      <h:outputText value="#{mainBean.selectedTextInArea}" 
          id="currentSelectedText" /> 

<h:outputScript library="js" name="jquery-textrange.js" /> 
<script> 
    function setSelectedText() { 
     var range = $('.ui-inputtextarea').textrange();// general selector 
     setSelectedTextCommand([{name: 'selectedText', value: range.text}]); 
    } 
</script> 

Bean

private String selectedTextInArea; 

public void setSelectedText() { 
    FacesContext context = FacesContext.getCurrentInstance(); 
    Map map = context.getExternalContext().getRequestParameterMap(); 
    selectedTextInArea = (String) map.get("selectedText"); 
} 

public String getSelectedTextInArea() { 
    return selectedTextInArea; 
} 

public void setSelectedTextInArea(String selectedTextInArea) { 
    this.selectedTextInArea = selectedTextInArea; 
} 

А вот живой demo на Primefaces Выбор TextArea, и на github.