捕捉选定的文本从inputTextArea primefaces JSF [英] capture selected text from inputTextArea primefaces jsf

问题描述

我想捕捉从 inputTextArea 关于Ajax所选文本双击自动或选择我event.How能做到这一点？ 下面的code选择中的所有文本区域（这是我不希望）。非常感谢。

 ＆LT; H：格式ID =形式＆GT;
        ＆LT;电话号码：面板标题=选择文本＆GT;
            ＆LT; H：panelGrid的列=3的cellpadding =5＆GT;
                ＆LT; H：的outputText值=文字：/＆GT;
                ＆LT;电话号码：inputTextarea ID =文本区域
                            值=＃{selectedTextBean.selectedText}＆GT;
                    ＆LT;电话号码：AJAX事件=选择更新=selectedText/＆GT;
                ＆LT; / P：inputTextarea＆GT;
                ＆所述; H：的outputText的id =selectedText
                          值=＃{selectedTextBean.selectedText}/＆GT;
            ＆LT; / H：panelGrid的＆GT;
        ＆LT; / P：面板＆gt;
＆LT; /小时：形式GT;
 

下面是 SelectedTextBean

  @ManagedBean
@ViewScoped
公共类SelectedTextBean {

   公共SelectedTextBean（）{
   }
   私人字符串selectedText;

   公共字符串getSelectedText（）{
    返回selectedText;
   }
   公共无效setSelectedText（字符串selectedText）{
    this.selectedText = selectedText;
   }
}
 

解决方案

您可以做，发送参数远程命令如下：

视图

 ＆LT; H：格式ID =形式＆GT;
    ＆LT;电话号码：面板标题=选择文本＆GT;
        ＆LT; H：panelGrid的列=3的cellpadding =5＆GT;
            ＆LT; H：的outputText值=文字：/＆GT;
            ＆LT; H：panelGroup中＆GT;
                ＆LT;电话号码：inputTextarea ID =文本区域
                                 值=＃{selectedTextBean.selectedText}ONSELECT =processSelection（）; /＆GT;
                ＆LT;电话号码：remoteCommand名=sendSelection的ActionListener =＃{selectedTextBean.onSelect}更新=selectedText过程=@这个/＆GT;
            ＆LT; /小时：panelGroup中＆GT;
            ＆所述; H：的outputText的id =selectedText
                          值=＃{selectedTextBean.selectedText}/＆GT;
        ＆LT; / H：panelGrid的＆GT;
    ＆LT; / P：面板＆gt;
＆LT; /小时：形式GT;
＆LT;脚本＆GT;
    功能processSelection（）{
        VAR selectedText =（!! document.getSelection）？ document.getSelection（）：
                （!! window.getSelection）？ window.getSelection（）：
                document.selection.createRange（）文本。
        sendSelection（[{名称：selectedText'，值：selectedText}]）;
    }
＆LT; / SCRIPT＆GT;
 

请注意，文本选择的变化取决于浏览器。

豆

 的Bean;
进口的java.util.Map;
进口javax.faces.bean.ManagedBean;
进口javax.faces.bean.ViewScoped;
进口javax.faces.context.FacesContext;

@ManagedBean
@ViewScoped
公共类SelectedTextBean实现Serializable {

    公共SelectedTextBean（）{
    }
    私人字符串selectedText;

    公共无效调用onSelect（）{
        FacesContext的上下文= FacesContext.getCurrentInstance（）;
        地图= context.getExternalContext（）getRequestParameterMap（）。
        selectedText =（字符串）map.get（selectedText）;
    }

    公共字符串getSelectedText（）{
        返回selectedText;
    }

    公共无效setSelectedText（字符串selectedText）{
        this.selectedText = selectedText;
    }
}
 

I want to capture selected text from inputTextArea on ajax dblclick or select event.How can I do this ? The code below selects everything in the text area (which I don't want). Thank you very much.

<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>  

Here is SelectedTextBean

@ManagedBean
@ViewScoped
public class SelectedTextBean {

   public SelectedTextBean() {
   }
   private String selectedText;  

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

解决方案

You can do that sending a parameter to a remote command as follows:

The View

<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>

Note that the text selection changes depending on the browser.

The Bean

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;
    }
}

这篇关于捕捉选定的文本从inputTextArea primefaces JSF的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！