使用调用函数JSF获取密钥代码

时间:2021-08-29 20:04:07

when use JSF inputText call javascript function by ajax event keydown but not get code event of keu down.

当使用JSF inputText通过ajax事件keydown调用javascript函数但是没有得到keu的代码事件。

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://xmlns.jcp.org/jsf/html"
  xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
  xmlns:p="http://primefaces.org/ui"
  xmlns:f="http://java.sun.com/jsf/core">
<h:head>
    <title>Start Page</title>
    <script>
        i = 0;
        $(document).ready(function (e) {
            $("#form\\:inp1").keydown(function (e) {
                $("#form\\:span1").text(e.type + ": " + e.which);
            });
        });
        function keyUp1(e, extraval)
        {
            $("#form\\:span2").text(e.type + ": " + e.which);
            window.alert("call it" + extraval);
        }
    </script>
</h:head>
<body>
    <h:form id="form">
        JQuery:
        <p:inputText id="inp1" />
        <p:outputLabel id="span1" value="Test This"/>
        <br/>
        <br/>
        <h:outputText value="JSF Ajax: " />
        <p:inputText id="counter" value="#{listenerView.text}">
            <f:ajax event="keydown" onevent="function(data) {keyUp1(data,'  Test it')};"/>
        </p:inputText>
        <h:outputText id="out" value="#{listenerView.text}"/> 
        <p:outputLabel id="span2" value="Test This"/>
    </h:form>
</body>

first inputText work with Jquery and javascript function in line 11 but second inputText not work with JSF ajax.

第一个inputText在第11行使用Jquery和javascript函数,但第二个inputText不能与JSF ajax一起使用。

1 个解决方案

#1


0  

The data that you receives is event - it contains event.type, event.status, event.source. Thats why it does not work for you.

您收到的数据是事件 - 它包含event.type,event.status,event.source。这就是为什么它不适合你。

You can catch the event keydown but in source u will find only HTMLInputelement - the inputText element that invoked the event - not the key.

您可以捕获事件keydown,但在源代码中,您将只找到HTMLInputelement - 调用事件的inputText元素 - 而不是密钥。

If you realy need to know what key has been pressed then use your jQuery version, if you need to post request to backend and get some field update then use jsf ajax. BTW you are mixing primefaces component with jsf ajax - do not do that (it's not the same) - use primefaces ajax if you want.

如果你真的需要知道按下了什么键,那么使用你的jQuery版本,如果你需要发送请求到后端并获得一些字段更新,那么使用jsf ajax。顺便说一句,你将primefaces组件与jsf ajax混合 - 不要这样做(它不一样) - 如果你愿意,可以使用primefaces ajax。

Working version (just diff)

工作版(只是差异)

   function keyUp1(e)
   {
       if (e.status !== "complete") {
           console.log(e.type + ": " + Object.keys(e));
           console.log("type: " + e.type);
           console.log("status: " + e.status);
           console.log("source: " + e.source);
       }
   }

   <f:ajax event="keydown" onevent="keyUp1"/>

#1


0  

The data that you receives is event - it contains event.type, event.status, event.source. Thats why it does not work for you.

您收到的数据是事件 - 它包含event.type,event.status,event.source。这就是为什么它不适合你。

You can catch the event keydown but in source u will find only HTMLInputelement - the inputText element that invoked the event - not the key.

您可以捕获事件keydown,但在源代码中,您将只找到HTMLInputelement - 调用事件的inputText元素 - 而不是密钥。

If you realy need to know what key has been pressed then use your jQuery version, if you need to post request to backend and get some field update then use jsf ajax. BTW you are mixing primefaces component with jsf ajax - do not do that (it's not the same) - use primefaces ajax if you want.

如果你真的需要知道按下了什么键,那么使用你的jQuery版本,如果你需要发送请求到后端并获得一些字段更新,那么使用jsf ajax。顺便说一句,你将primefaces组件与jsf ajax混合 - 不要这样做(它不一样) - 如果你愿意,可以使用primefaces ajax。

Working version (just diff)

工作版(只是差异)

   function keyUp1(e)
   {
       if (e.status !== "complete") {
           console.log(e.type + ": " + Object.keys(e));
           console.log("type: " + e.type);
           console.log("status: " + e.status);
           console.log("source: " + e.source);
       }
   }

   <f:ajax event="keydown" onevent="keyUp1"/>