-1

I have a text box which takes a search value, and i want to send this string to the server side on click of a button. Not by a form submit, by an ajax call.

I had added an actionListener to the input tag itself, which is called on blur. But what i really want is for the user to click the button to trigger the search function.

I got an idea from this question, and implemented it this way: 

<h:inputText id="likeMaterial" value="#{createBookingForm.searchText}"></h:inputText>
<a4j:jsFunction name="setParameterAndRerender" actionListener="{bean.searchMaterials}" reRender="searchResult">
    <a4j:actionparam name="param1" assignTo="#{createBookingForm.searchText}"/> 
</a4j:jsFunction> 
<h:commandButton value="Search" onclick="setParameterAndRerender('mySearchText');return false;"></h:commandButton>

The value received at server side is of course, "mySearchText". How do i pass what the user enters? Or how do i bind #{createBookingForm.searchText} before the button's action listener is called?

Im open to any other approach to. I have limitations though : Im working on enhancing a legacy application, built using JSF 1.1. I cant upgrade, not without a fight at least!

Edit : I tried doing it this way, but i get "undefined" on the server side.

Community
  • 1
  • 1
insanity
  • 347
  • 3
  • 14
  • You don't need `a4j:jsFunction` for setting value of searchText (`h:inputText` is enough). You can call action directly in your `h:commandButton`. Your code does not work because you pass wrong value to jsFunction. You need change `onclick` attribute to `onclick="setParameterAndRerender('#{createBookingForm.searchText}');"`. Your code has bad design, try do it in other way. – Vasil Lukach Mar 08 '14 at 09:41
  • i cant directly call the action in commandButton because that would submit the whole form. I don't want that. And i tried `onclick="setParameterAndRerender('#{createBookingForm.searchText}');` but i get "undefined" on the server side. – insanity Mar 10 '14 at 07:56
  • use `a4j:commandButton`. It can do some action without form submit. – Vasil Lukach Mar 10 '14 at 13:47

3 Answers3

3

Why not use a4j:commandButton instead of h:commandButton? It will execute ajax request and render what you want. No form submit will happen. Loks like what you need.

trims
  • 453
  • 4
  • 9
0

h:commandButton by default submit the form when clicked. So no need to send specially using a4j:jsFunction or in any other way. You can completely remove your js function unless if you have something else to do. If you want to test that add an action method and print the value of searchText variale in createBookingForm bean.

Hope this helps!!

Srikanth Ganji
  • 1,127
  • 1
  • 13
  • 29
  • I do not want to submit the form. As iv mentioned in my question, "Not by a form submit, by an ajax call." – insanity Mar 10 '14 at 07:23
0

This is the whole solution

<h:inputText id="likeMaterial" value="#{createBookingForm.searchText}"></h:inputText>
<a4j:commandButton reRender="searchResult" actionListener="#{createBookingForm.searchMaterials}">
    <a4j:actionparam name="param1" noEscape="true" value="document.getElementById('likeMaterial').value" assignTo="#{createBookingForm.searchText}" />
</a4j:commandButton>
insanity
  • 347
  • 3
  • 14