Databases
StackOverflow2013
Postsdbo
POI want to bind the click event to the li elements in the xpages type-ahead
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POI want to bind the click event to the li elements in the xpages type-ahead
    text
    copied!<p>I am using Tim Tripconys fancy type-ahead solution and it is working fine. <a href="http://www.timtripcony.com/blog.nsf/d6plinks/TTRY-7XD5P9" rel="nofollow">http://www.timtripcony.com/blog.nsf/d6plinks/TTRY-7XD5P9</a></p> <p>But I want it to behaive a bit differently, instead of filling the editbox with the value from the selected dropdown entry I want to attach a click event to the selected entry and redirect the user to the selected document.</p> <p>this means that I need to override the current click event and send a hidden "unid" to my click event and do the redirect in javascript.</p> <p>I have tried to add a class to the ul and li elements in my SSJS function so I can bind them to the click event. but that does not seem to be applied. and I am not sure how I should attach the click event as there is no eventhandler on the typeahead "ajax" control.</p> <p>This is what I am trying to do</p> <ol> <li>User enters characters in the editbox</li> <li>the xpages Typeahead returns the results as a dropdown</li> <li>the unid of each document returned need to be in hidden in the dropdown</li> <li>clicking one of the dropdown entries will redirect to another page displaying the document the user clicked on based on the hidden unid.</li> </ol> <p>btw. I know how to bind an event so I need no further explaination of this, but I need to know how to do it in relation to the type-ahead feature in xpages.</p> <p>Below is a sample from the html elements that are generated from dropdown</p> <pre><code>&lt;ul class="dijitReset dijitMenu dijitComboBoxMenu" dojoattachevent="onmousedown:_onMouseDown,onmouseup:_onMouseUp,onmouseover:_onMouseOver,onm&gt;ouseout:_onMouseOut" style="top: 0px; overflow-x: hidden; overflow-y: hidden; width: 310px; visibility: visible; " id="home:_id1:_id19:_id29:search_popup" dir="" widgetid="home:_id1:_id19:_id29:search_popup"&gt; &lt;li class="dijitReset dijitMenuItem" role="option" id="home:_id1:_id19:_id29:search_popup1"&gt; &lt;table&gt; &lt;tbody&gt; &lt;tr&gt; &lt;td&gt;&lt;img src=""&gt;&lt;/td&gt;&lt;td valign="top"&gt;&lt;p&gt;&lt;strong&gt;Entry1&lt;/strong&gt;&lt;/p&gt; &lt;p&gt; &lt;span class="informal"&gt;TADN-8CWLTP&lt;br&gt;2012-03-01 09:29:07 CET&lt;br&gt;Test&lt;/span&gt; &lt;/p&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; &lt;/li&gt; &lt;li class="dijitMenuItem dijitMenuNextButton" dojoattachpoint="nextButton" role="option" style="display: none; " id="home:_id1:_id19:_id29:search_popup_next"&gt;More choices&lt;/li&gt; &lt;/ul&gt; </code></pre> <p>Thanks Thomas</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload