title: JSF Ajax Call with JQuery Mobile
body: <p>This issue has been troubling me to no end!!</p>
  
  <p>I have seen the forum post <a href="https://stackoverflow.com/questions/9848203/jsf-fajax-listener-not-called">JSF f:ajax listener not called</a> which describes my exact issue. </p>
  
  <p>I am using JSF 2.0 and am using the Jquery mobile as an extension library.</p>
  
  <p>I have actually copied the code exactly from the post, into my project (shown below). </p>
  
  <p>I have the same managed bean set in session scope, printing out a line. I can see the bean successfully executing on the first input text <em>the one assigned with an ajax listener</em> </p>
  
  <p>It doesn't however work for the button. In my use case, I want the button only to act as a bridge for calling the managed bean, so don't want the form to submit. </p>
  
  <p>I am at a complete loss as to why the bean isn't executed?</p>
  
  <p>I have no overriding JS classes either, and am using Jquery mobile only.</p>
  
  <p>Is this a restriction on the Jquery framework? or more than likely an issue with my code?</p>
  
  <p>S</p>
  
  <pre><code>&lt;h:form id="f1"&gt;
  &lt;h:panelGroup id="switchSearchTexts"&gt;
      &lt;h:inputText accesskey="s" alt="Search" id="searchBoxPeople" title="Search Plebeians" valueChangeListener="#{peopleBean.simplePersonQuery}" size="25" rendered="#{peopleBean.easySearch}"&gt;
          &lt;f:ajax render="peopleDataTable" event="keyup" listener="#{contactsBean.morePressed}"
                  immediate="true"/&gt;
      &lt;/h:inputText&gt;
  
      &lt;h:inputText accesskey="s" alt="Search First Name" id="searchBoxFN" title="Search First Name" size="25" rendered="#{!peopleBean.easySearch}"&gt;
          &lt;f:ajax render="moreButtonAsText" event="keyup" /&gt;
      &lt;/h:inputText&gt;
  &lt;/h:panelGroup&gt;
  
  &lt;div id="expandBox"&gt;
      &lt;h:inputText id="searchBoxLN" alt="Search Last Name" styleClass="hideToggle" title="Search Last Name" size="25" /&gt;
      &lt;h:inputText id="searchBoxAddress" alt="Search Address" styleClass="hideToggle" title="Search Address" size="25" /&gt;
  &lt;/div&gt;
  
  &lt;h:commandButton type="button" styleClass="moreButtonAsText" id="moreButtonAsText" value="More"&gt;
      &lt;f:ajax listener="#{contactsBeanFaces.morePressed}"/&gt;
  &lt;/h:commandButton&gt;
  &lt;/h:form&gt;
  </code></pre>
  
  <p>*** CORRECTION ****</p>
  
  <p>
              
  </p>
  
  <hr>
  
  <p>my apologies, I was seriously trying everything! and posted the wrong iteration of code!<br>
  I have found a great note:
  <a href="http://java.dzone.com/articles/ajax-jsf-joined" rel="nofollow noreferrer">http://java.dzone.com/articles/ajax-jsf-joined</a> which has been a huge help, however still no success. I am feeling jquery mobile is messing with the event? </p>
  
  <p>I believe that there may also be a requirement for the button to be in a form? </p>
  
  <p>Sorry abou the basic questions, however i am a Jdeveloper guy, who is kind of learning backwards.... the DOM and client java / html  side of things is almost unfairly hidden with this application. I am loving client side libraries and learning whole lot through this process.... but a strong requirement is that I can call server side logic!</p>
  
  <p>Any ideas would be very much appreciated!</p>