CommandButton action: use value of inputText as parameter in dynamic URL

1
votes

I need to make a small form where user types a number into the inputField, and clicks on a button, then is sent to a page, using that number as a parameter to the page.

So far I got into this:

<p:inputText id="myText" style="width:75px;" />
<p:commandButton id="myButton" value="Ir" 
    action="/site/page.xhtml?id=${param['form:myButton']}"
    title="Ir" ajax="false" proces="@this,myText" />

tried with ${param['form:myButton']} and #{param['form:myButton']}, error is the same.

Problem is, JSF thinks its a method expression...

GRAVE: Servlet.service() for servlet [Faces Servlet] in context with path [/intranet] threw exception [/myPage action="/site/page.xhtml?id=${param['form:myButton']}".xhtml @95,41  action="/site/page.xhtml?id=${param['form:myButton']}" Not a Valid Method Expression:  action="/site/page.xhtml?id=${param['form:myButton']}" with root cause
javax.el.ELException: Not a Valid Method Expression:  action="/site/page.xhtml?id=${param['form:myButton']}"
at org.apache.el.lang.ExpressionBuilder.createMethodExpression(ExpressionBuilder.java:236)
at org.apache.el.ExpressionFactoryImpl.createMethodExpression(ExpressionFactoryImpl.java:55)
at org.jboss.weld.util.el.ForwardingExpressionFactory.createMethodExpression(ForwardingExpressionFactory.java:43)
at org.jboss.weld.el.WeldExpressionFactory.createMethodExpression(WeldExpressionFactory.java:64)
at com.sun.faces.facelets.tag.TagAttributeImpl.getMethodExpression(TagAttributeImpl.java:222)
at com.sun.faces.facelets.tag.jsf.ActionSourceRule$ActionMapper2.applyMetadata(ActionSourceRule.java:104)
at com.sun.faces.facelets.tag.MetadataImpl.applyMetadata(MetadataImpl.java:81)
at javax.faces.view.facelets.MetaTagHandler.setAttributes(MetaTagHandler.java:129)
at javax.faces.view.facelets.DelegatingMetaTagHandler.setAttributes(DelegatingMetaTagHandler.java:102)
at com.sun.faces.facelets.tag.jsf.ComponentTagHandlerDelegateImpl.doNewComponentActions(ComponentTagHandlerDelegateImpl.java:402)

and this is the bottom-most exception trace.

Question: how can I pass the value typed into of the input-field into the action of the Button when the button is clicked, so the browser navigates to the desired page passing the value in the input as a parameter, without resorting to a backing bean.

I don't need to communicate with the server, just forward the page.

any solution using jQuery or plain javascript in tandem with JSF is acceptable too.

using mojarra, primefaces 3.3.1

2
jsfjsf-2primefacesel
You are doing it wrong. action expects a java Method as an EL. for eg: #{bean.someMethod}. Where 'bean' is a JSF ManagedBean. To pass value use #{bean.someMethod(someValue)}. See more here: balusc.blogspot.in/2011/09/communication-in-jsf-20.html – Johny T Koshy
<p:commandButton>'s action can have a string instead of a Java Method. it sends you to a page when you click the button. I do not want a method expression. – Mindwin
The concrete functional requirement is unclear. Do you want do perform a GET form submit or do you want to perform a POST form submit and then a redirect to the desired GET URL? – BalusC
also, the solution using a backing bean, binding the input to a POJO property and faces-redirect=true is know, but I need to do it without using a backing bean. JSF, jQuery is fine, but no Java classes can be created or modified. – Mindwin
@BalusC: use-case: form has input field and button. user types value into input. User clicks on button. user navigates to another page, passing the value in input as a parameter to the new page. Any strategy that achieves this outcome in JSF without using Java classes is acceptable. – Mindwin

2 Answers

0
votes

I do not need a bazooka to kill a mouse. The answer is very simple.

bind a javascript function to the onclick of the button, and in that function, retrieve the value of the input field by its id, then assemble URL with the parameters and navigate away from within the javascript function.

JSF code (assume they are inside a form with myForm as its id):

<p:inputText id="myInput" style="width:75px;" />
<p:commandButton id="myButton" value="Ir" onclick="navega();" title="Ir" ajax="false" proces="@none" />

Javascript script, declared on a separate file or later on in the xhtml document:

function navega() {
     var submittedInputValue = $('#myForm\\:myInput').val();
     window.location.href = "/site/mypage.xhtml?param1=whatever&amp;id=" + submittedInputValue ;
                }

Take note of the prepend id (myForm:myInput), of using \\ to escape the : in jQuery, and using &amp; instead of & in the xhtml so its not treated as an entity.

Note: probably not all of those commandButton attributes are required, feel free to edit this answer and remove the useless ones.

EDIT: removed the submit and changed process to @none on the command button.