当前位置： 文江博客话题详情

如何使用 JSF 从 javascript 调用 java 函数

发布于 2024-11-18 15:14:13 字数 8693 浏览 0 评论 0原文

我正在使用 JSF2.0 并尝试从 javascript 调用 java 函数，但无法实现这一点。 我有一个带有数据表的jsp，其中2个列（材料和描述）从弹出jsp中获取数据。现在用户在另外2个字段（单位和数量）中输入数据，将这4个作为输入参数我有一个java返回其余值的函数（在我的示例中为 NetPrice 和 NetTax） 我如何在这里调用java方法，以便我可以获取jsp（test.jsp）文本字段的值。这是我的跟踪

test.jsp

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script LANGUAGE="JavaScript">
        function testPrevSibling(buttonElement) {
            try {
                // alert(buttonElement);
                var inputText = buttonElement.previousSibling;
                while (inputText.nodeType!=1)
                {
                    inputText =inputText.previousSibling;
                }
                //      alert(inputText.id);
                return inputText.id;
            } catch(ex) {
                alert("bad " + ex);
            }
        }
        function testNextSibling(buttonElement) {
            try {
                // alert(buttonElement);
                var inputText = buttonElement.nextSibling;
                while (inputText.nodeType!=1)
                {
                    inputText =inputText.nextSibling;
                }
                // alert("next sibling-->"+inputText.innerHTML);
                return inputText;
            } catch(ex) {
                alert("bad " + ex);
            }
        }

        // var inputId;
        function popUp(URL,buttonRef) {
            var inputId = testPrevSibling(buttonRef);

            //     alert(inputId);
            day = new Date();
            id = day.getTime();
            URL = URL+"?inputId="+inputId;
            eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=1,statusbar=0,menubar=0,resizable=1,width=250,height=800 left = 630,top = 502');");
        }
        function getDetails(inputId,matVal,desc){
            var inputRef = document.getElementById(inputId);
            var tdRef = inputRef.parentNode;
            var tdNextRef = testNextSibling(tdRef);
      //      alert("td Ref-->"+tdRef+"td next Ref-->"+tdNextRef);
            var descRef = tdNextRef.firstChild;
        //    alert("Child ref-->"+descRef);
        //    alert("Current JSP-->"+matVal+"input Id-->"+inputId+"desc-->"+desc);
            document.getElementById(inputId).value = matVal;
            descRef.value = desc;
        }
    </script>
    <title>JSP Page</title>
</head>
<body>
    <f:view>
        <h:form>
            <br>
            <h:panelGrid  bgcolor="#9AC8E6" width="100%">
                <h:dataTable id="d" value="#{SalesCreate.orderBean.itemList}" var="iBean" bgcolor="#9AC8E6" border="10" cellpadding="5" cellspacing="3" rows="10" width="100%" dir="LTR" frame="hsides" rules="all" >

                    <h:column>
                        <f:facet name="header">
                            <h:outputText style=""value="Material" />
                        </f:facet>
                        <h:inputText id="mat" value="#{iBean.material}" > </h:inputText>
                        <h:commandButton value="..." onclick="javascript:popUp('MaterialList.jsp',this)" > </h:commandButton>
                        <h:commandButton style="display:none" value="..." onclick="" > </h:commandButton>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText style=""value="Description" />
                        </f:facet>
                        <h:inputText id="desc" value="#{iBean.description}" > </h:inputText>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText style=""value="Unit" />
                        </f:facet>
                        <h:inputText value="#{iBean.unit}" > </h:inputText>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText value="Quantity"/>
                        </f:facet>
                        <h:inputText value="#{iBean.quantity}"> </h:inputText>
                        <h:form>
                            <h:commandLink value="get Pricing" action="#{SalesCreate.pricingForQuotation}" >
                                <f:param name="mat" value="#{iBean.material}" />
                                <f:param name="unt" value="#{iBean.unit}" />
                                <f:param name="qty" value="#{iBean.quantity}" />
                            </h:commandLink> </h:form>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText style=""value="Unit Price" />
                        </f:facet>
                        <h:inputText value="#{iBean.netPrice}" > </h:inputText>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText style=""value="Total Price" />
                        </f:facet>
                        <h:inputText value="#{iBean.netTax}" > </h:inputText>
                    </h:column>
                </h:dataTable>
            </h:panelGrid>
        </h:form>
    </f:view>
</body>

popup.jsp

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script LANGUAGE="JavaScript">
        function testNextSibling(buttonElement) {
            try {
                // alert(buttonElement);
                var inputText = buttonElement.nextSibling;
                while (inputText.nodeType!=1)
                {
                    inputText =inputText.nextSibling;
                }
                alert("next sibling-->"+inputText.innerHTML);
                return inputText.innerHTML;
            } catch(ex) {
                alert("bad " + ex);
            }
        }
        function gup( name )
        {
            name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
            var regexS = "[\\?&]"+name+"=([^&#]*)";
            var regex = new RegExp( regexS );
            var results = regex.exec( window.location.href );
            if( results == null )
                return "";
            else
                return results[1];
        }
        function setMaterialValue(mat,matNum){
            //   alert("mat " + mat);
            var desc = testNextSibling(mat);
            //   alert("Description-->"+desc);
            var inputId = gup("inputId");
            window.opener.getDetails(inputId,matNum,desc);
            //  window.opener.document.getElementById(mat).value;
            window.close();
        }
    </script>
    <title>JSP Page</title>
</head>
<f:view>
    <body>
        <h:dataTable id="datatbl" value="#{SalesCreate.inquiryMaterialList}" var="materialList"  bgcolor="#9AC8E6" border="10" cellpadding="5" cellspacing="3" rows="3000" width="100%" dir="LTR" rules="all">

            <h:column>
                <f:facet name="header">
                    <h:outputText style=""value="Material" />
                </f:facet>
                <h:form>
                    <h:commandLink style="" id="materialId" value="#{materialList.material}" onclick="javascript:setMaterialValue(this,#{materialList.material})" ></h:commandLink>
                    <h:outputText style="display:none" value="#{materialList.description}"></h:outputText>
                </h:form>
            </h:column>
            <h:column>
                <f:facet name="header">
                    <h:outputText style=""value="Description" />
                </f:facet>
                <h:form>
                    <h:commandLink style="" value="#{materialList.description}" onclick="javascript:setDescriptionValue(#{materialList.description})" ></h:commandLink></h:form>
            </h:column>
        </h:dataTable>
    </body>
</f:view>

的代码片段我尝试使用commandLink，但我想要当文本字段失去焦点或类似的情况时完成

原文

I'm using JSF2.0 and trying to call a java function from javascript but couldn't achieve this.
I've a jsp with datatable, where 2 of my columns(Material and Desc) fetch data from the popup jsp.Now the user enters data in 2 other fields(Unit and Qty), taking these 4 as input parameters I have a java function which returns the rest of the values (NetPrice and NetTax in my example)
How can I call the java method here such that I can get the values to my jsp's(test.jsp) text fields.Here is the code snippet of my trail

test.jsp

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script LANGUAGE="JavaScript">
        function testPrevSibling(buttonElement) {
            try {
                // alert(buttonElement);
                var inputText = buttonElement.previousSibling;
                while (inputText.nodeType!=1)
                {
                    inputText =inputText.previousSibling;
                }
                //      alert(inputText.id);
                return inputText.id;
            } catch(ex) {
                alert("bad " + ex);
            }
        }
        function testNextSibling(buttonElement) {
            try {
                // alert(buttonElement);
                var inputText = buttonElement.nextSibling;
                while (inputText.nodeType!=1)
                {
                    inputText =inputText.nextSibling;
                }
                // alert("next sibling-->"+inputText.innerHTML);
                return inputText;
            } catch(ex) {
                alert("bad " + ex);
            }
        }

        // var inputId;
        function popUp(URL,buttonRef) {
            var inputId = testPrevSibling(buttonRef);

            //     alert(inputId);
            day = new Date();
            id = day.getTime();
            URL = URL+"?inputId="+inputId;
            eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=1,statusbar=0,menubar=0,resizable=1,width=250,height=800 left = 630,top = 502');");
        }
        function getDetails(inputId,matVal,desc){
            var inputRef = document.getElementById(inputId);
            var tdRef = inputRef.parentNode;
            var tdNextRef = testNextSibling(tdRef);
      //      alert("td Ref-->"+tdRef+"td next Ref-->"+tdNextRef);
            var descRef = tdNextRef.firstChild;
        //    alert("Child ref-->"+descRef);
        //    alert("Current JSP-->"+matVal+"input Id-->"+inputId+"desc-->"+desc);
            document.getElementById(inputId).value = matVal;
            descRef.value = desc;
        }
    </script>
    <title>JSP Page</title>
</head>
<body>
    <f:view>
        <h:form>
            <br>
            <h:panelGrid  bgcolor="#9AC8E6" width="100%">
                <h:dataTable id="d" value="#{SalesCreate.orderBean.itemList}" var="iBean" bgcolor="#9AC8E6" border="10" cellpadding="5" cellspacing="3" rows="10" width="100%" dir="LTR" frame="hsides" rules="all" >

                    <h:column>
                        <f:facet name="header">
                            <h:outputText style=""value="Material" />
                        </f:facet>
                        <h:inputText id="mat" value="#{iBean.material}" > </h:inputText>
                        <h:commandButton value="..." onclick="javascript:popUp('MaterialList.jsp',this)" > </h:commandButton>
                        <h:commandButton style="display:none" value="..." onclick="" > </h:commandButton>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText style=""value="Description" />
                        </f:facet>
                        <h:inputText id="desc" value="#{iBean.description}" > </h:inputText>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText style=""value="Unit" />
                        </f:facet>
                        <h:inputText value="#{iBean.unit}" > </h:inputText>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText value="Quantity"/>
                        </f:facet>
                        <h:inputText value="#{iBean.quantity}"> </h:inputText>
                        <h:form>
                            <h:commandLink value="get Pricing" action="#{SalesCreate.pricingForQuotation}" >
                                <f:param name="mat" value="#{iBean.material}" />
                                <f:param name="unt" value="#{iBean.unit}" />
                                <f:param name="qty" value="#{iBean.quantity}" />
                            </h:commandLink> </h:form>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText style=""value="Unit Price" />
                        </f:facet>
                        <h:inputText value="#{iBean.netPrice}" > </h:inputText>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText style=""value="Total Price" />
                        </f:facet>
                        <h:inputText value="#{iBean.netTax}" > </h:inputText>
                    </h:column>
                </h:dataTable>
            </h:panelGrid>
        </h:form>
    </f:view>
</body>

popup.jsp

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script LANGUAGE="JavaScript">
        function testNextSibling(buttonElement) {
            try {
                // alert(buttonElement);
                var inputText = buttonElement.nextSibling;
                while (inputText.nodeType!=1)
                {
                    inputText =inputText.nextSibling;
                }
                alert("next sibling-->"+inputText.innerHTML);
                return inputText.innerHTML;
            } catch(ex) {
                alert("bad " + ex);
            }
        }
        function gup( name )
        {
            name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
            var regexS = "[\\?&]"+name+"=([^&#]*)";
            var regex = new RegExp( regexS );
            var results = regex.exec( window.location.href );
            if( results == null )
                return "";
            else
                return results[1];
        }
        function setMaterialValue(mat,matNum){
            //   alert("mat " + mat);
            var desc = testNextSibling(mat);
            //   alert("Description-->"+desc);
            var inputId = gup("inputId");
            window.opener.getDetails(inputId,matNum,desc);
            //  window.opener.document.getElementById(mat).value;
            window.close();
        }
    </script>
    <title>JSP Page</title>
</head>
<f:view>
    <body>
        <h:dataTable id="datatbl" value="#{SalesCreate.inquiryMaterialList}" var="materialList"  bgcolor="#9AC8E6" border="10" cellpadding="5" cellspacing="3" rows="3000" width="100%" dir="LTR" rules="all">

            <h:column>
                <f:facet name="header">
                    <h:outputText style=""value="Material" />
                </f:facet>
                <h:form>
                    <h:commandLink style="" id="materialId" value="#{materialList.material}" onclick="javascript:setMaterialValue(this,#{materialList.material})" ></h:commandLink>
                    <h:outputText style="display:none" value="#{materialList.description}"></h:outputText>
                </h:form>
            </h:column>
            <h:column>
                <f:facet name="header">
                    <h:outputText style=""value="Description" />
                </f:facet>
                <h:form>
                    <h:commandLink style="" value="#{materialList.description}" onclick="javascript:setDescriptionValue(#{materialList.description})" ></h:commandLink></h:form>
            </h:column>
        </h:dataTable>
    </body>
</f:view>

I've tried using a commandLink but I want it to be done when the textfield looses its focus or something similar

如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论， 你可以免费 注册 一个本站的账号。

评论（2）

想你的星星会说话 2024-11-25 15:14:13
   <h:inputText value="#{yourbackingBean.first}">
                <f:ajax event="blur" render="cm" listener="#{yourbackingBean.caluculate}"/>
     </h:inputText>
     h:inputText value="#{yourbackingBean.second}" id="cm"/>
          </h:form>

  • 您可以选择这里的活动，例如
    模糊、更改、keyup、keydown
    等等............

    Listener 是要实现的方法
    当特定事件发生时调用
    触发。

    这里是计算方法
    由填充逻辑组成
    jsp 中的剩余字段。

你的支持 Bean

          private int first=1;
          private int second=1;
    //Getters and Setters
     public void caluculate(AjaxBehaviorEvent evt)
       {
        second=first*1000;
       }

   <h:inputText value="#{yourbackingBean.first}">
                <f:ajax event="blur" render="cm" listener="#{yourbackingBean.caluculate}"/>
     </h:inputText>
     h:inputText value="#{yourbackingBean.second}" id="cm"/>
          </h:form>

  • Here event can be your choice like
    blur,change,keyup,keydown
    etc.........

    Listener is the method to be
    called when particular event
    triggered.

    Here caluclate is the method
    consist of logic to populate
    remaining fields in your jsp.

your Backing Bean

          private int first=1;
          private int second=1;
    //Getters and Setters
     public void caluculate(AjaxBehaviorEvent evt)
       {
        second=first*1000;
       }
回复 原文
阳光下慵懒的猫 2024-11-25 15:14:13

你不能。您最多能做的就是发出 AJAX 请求。类似的问题已在这里得到解答，如何从 JSP 访问 javascript 中的 java 对象？

You can't. The most you can do is to make an AJAX request. Similar question has been answered here, How to access a java object in javascript from JSP?

回复 原文
~没有更多了~

关于作者

薄荷梦

暂无简介

文章
评论
25 人气
发私信

相关话题

更多

热门标签

操作系统 程序设计 IT运维 Linux系统管理 JavaScript 服务器应用 solaris C/C++ PHP Shell BSD Vue.js aix Oracle Python HTML 系统管理 HTML5 CSS 前端
更多

推荐作者

吝吻

文章 0 评论 0

Jasmine

文章 0 评论 0

∞梦里开花

文章 0 评论 0

阳光①夏

文章 0 评论 0

暮念

文章 0 评论 0

梦里泪两行

文章 0 评论 0

更多

友情链接

文江博客
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站，即表示您同意使用 Cookies 和您的相关数据。
    原文