• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1834
  • Last Modified:

JSF question: "ondblclick" attribute for "selectOneListbox" component

Hi,

I am using Java ServerFaces for the web development, in my jsp I have got a "selectOneListbox" tag, when the user double click any value in the listBox, I want in the server side I can detect the user double click action and then do something with it. How can I do this without put the processing code inside the valueChangeEvent of the listBox? Many thanks.
0
victorli
Asked:
victorli
  • 6
  • 5
1 Solution
 
girionisCommented:
Hi victorli

AFAIK you cannot do that unless you use JavaScript and use the onDblclick event on the generated HTML.

Cheers
0
 
bpmurrayCommented:
Since firing an event on the server requires a submit, you can't attach server-side code to double-click. You can catch it a ValueChanged event, and do a submit on double-click, so you end up with something like:

<h:selectOneListbox id="listbox1" valueChangeListener="#{bean.method}" ondblclick="window.forms[0].submit();" ...>

The tooling often helps you to create the various code snippets, e.g. IBM's tooling will create the valuechange listener code in the pagecode file.
0
 
victorliAuthor Commented:
Thanks for your reply, but as I said in the question, I want to do this without calling the code under valueChangeEvent, is there other way? like can I use Javascript to fire a hidden command in the jsp page which links to a ActionListener in the server side?
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
bpmurrayCommented:
Actually, you can use AJAX-like functionality, although this is non-trivial. It all depends on what you want to do on the server side. Do you want to change something that would affect the JSF view? In that case, you really have to go through the entire lifecycle. If you want to get information that is independant of the JSF lifecycle, something that can be retrieved from a different servlet, you can do that easily, but the most usual case is including a phase listener that manages the submit, calling the external method and then calling responseComplete() to cause immediate return.

Another possible solution would be to have a hidden submit button that's clicked by JS and the onclick action executed on the server.
0
 
victorliAuthor Commented:
Thanks bpmurry.

I think the both approaches you recommended are what I want, so could you please give me the detailed code example? I am doing the hidden submit button one but it does not work.
0
 
victorliAuthor Commented:
The reason I can not put the code inside the selectOneBox's ValueChangeListener is I need to change the view, after I set the value, the set value will be overidden by the previous data. Probably this is because the ValueChangeListener happens before the data model change phase. I found I can always change the view when I put the code under ActionListener.
0
 
bpmurrayCommented:
Not sure which you want, but I'll assume that you want the separate servlet ....

1. In your web.xml add the following:
    <servlet id="myServlet">
          <servlet-name>My DoubleClik Servlet</servlet-name>
          <servlet-class>com.foo.faces.webapp.DoubleClickServlet</servlet-class>
          <load-on-startup>-1</load-on-startup>
     </servlet>
        ---
     <servlet-mapping>
          <servlet-name>My DoubleClick Servlet</servlet-name>
          <url-pattern>/myAjax/*</url-pattern>
     </servlet-mapping>

2. The class referenced above:
package com.foo.faces.webapp;


public class ImgServlet extends HttpServlet {
      public void doGet(HttpServletRequest request,
                        HttpServletResponse response)
                      throws IOException, ServletException
      {
             ServletOutputStream os = response.getOutputStream();
             String uri = req.getRequestURI();
           // Do your thing here
      }
}

3. The Javascript
function getAjaxStuff(url, id) {
  if (document.getElementById) {
    var x = (window.ActiveXObject) ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
  }
  if (x) {
    x.onreadystatechange = function() {
      if (x.readyState == 4 && x.status == 200) {
        el = document.getElementById(id); // Assume we want to put the returned markup in to the section "id"
        el.innerHTML = x.responseText;
      }
    }
    x.open("GET", url, true);
    x.send(null);
  }
}

4. Changes to your page
<h:selectOne ondblclick="getAjaxStuff('http://www.system.com/myAjax/foo', 'contents');" ...>
...
<div id="contents"></div>
0
 
bpmurrayCommented:
Duh! I should have waited a minute! Rather critical information!!!!

OK, this sounds like it's the hidden submit and action method. Give me a minute ....
0
 
victorliAuthor Commented:
Thanks for your code example, but I really think this is quite costyif using servlet as you exampled the code. Can we hage simpler solution? If not using JSF, I know it is easy to implements a JS which submit the form and attaction some request to the serverside, then in the server side, i could use the request.getParameter("doubleClickAction") to detect and then write the processing code. Just not sure how to do this in JSF apart from the standard listener approach.
0
 
bpmurrayCommented:
1. Change the page:
<h:commandButton type="submit" value="Submit" style="display:none" id="button1" action="#{bean.actionMethod}"></h:commandButton>

<h:selectOne ondblclick="clickIt('form1:button1');" ...>

2. Add JavaScript:
function clickIt(obj) {
   var elem = (window.document.getElementById)? window.document.getElementById(obj) : window.document.all(obj);
   elem.click();
}

0
 
bpmurrayCommented:
The reason I gave such a complex solution was because I wasn't aware of what you wanted to achieve, so I provided something that would give a generic solution. Had I realized that all you wanted was to change the view, I would have gone straight for the second one. BTW, I presume you're aware of how to set up navigation rules based on the return from your action.
0
 
victorliAuthor Commented:
Thanks, the problem is resolved.
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

  • 6
  • 5
Tackle projects and never again get stuck behind a technical roadblock.
Join Now