• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Jeanne Boyarsky
  • Ron McLeod
  • Paul Clapham
  • Liutauras Vilda
Sheriffs:
  • paul wheaton
  • Rob Spoor
  • Devaka Cooray
Saloon Keepers:
  • Stephan van Hulst
  • Tim Holloway
  • Carey Brown
  • Frits Walraven
  • Tim Moores
Bartenders:
  • Mikalai Zaikin

Need a pop up search box with selectable result

 
Greenhorn
Posts: 4
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
OK the easiest way to describe what I have been trying to do is to compare it to the little calendars you click to pop up and pick a date. I need a little icon I can click and pop up a box with a list of items (I will generate these in the pop up), you select one of the options and its valud is passed to the text box next to the box, again much like selecting a date in those little calendars which then fills in the datebox but the box will contain text instead picked from a list.
 
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Likes 1
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Sounds like you may be describing a combobox plugin, or perhaps an autocompleter.
 
Clint Russell
Greenhorn
Posts: 4
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

Bear Bibeault wrote:Sounds like you may be describing a combobox plugin, or perhaps an autocompleter.



Close but neither solution worked like I needed, the combobox wouldn't populate the text box and the autocompleter could be usable but was slowing some users usage during tests and complaints came about.
 
Bear Bibeault
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

Clint Russell wrote:Close but neither solution worked like I needed, the combobox wouldn't populate the text box


There are dozens and dozens of these. Surely they're not all buggy?

and the autocompleter could be usable but was slowing some users usage during tests and complaints came about.


Consider using local data.
 
Clint Russell
Greenhorn
Posts: 4
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
OK, let me explain my goal end result and some screen shot mock ups.

So The page begins with a blank Search box and no visible table or PROCESS USERS button (until people are added), in this search box the user types as much or as little of a users name they wish to do a search for, in the example they are trying to find someone with John, the Search box list that pops ups (which I have working in a separate page completely already), next to the names are PLUS signs (most likely graphics when done). If they click the + sign the pop search box vanishes, the user is then added to a table below with key info retrieved (in the example Name and Title), click + also clears the entry in the search box and is ready for a new search to occur.

Now once the user has added all the people they wish then they can fill in the new title and effective date on the table form and submit it for processing.

The part I am having problems with is the search box pop up and returning selected values back to the page, which then updates the table (which is contained in a form) and populate the values.

Note: The form also needs to validate that the new title field and the effective date fields are valid and entered before Process users can be done, in the example attached clicking PROCESS USERS should warn the effective date for Jane Doe hasn't been entered and let the user click OK on the warning and go back and fill in the info. It would be nice if Process users button wouldn't light up until all required fields were filled in.
sample-page.JPG
[Thumbnail for sample-page.JPG]
The page as it would display once 3 users had been selected
PopUp-Example.JPG
[Thumbnail for PopUp-Example.JPG]
Pop Up list of users once someone typed John in the search box and clicked Search
 
Bear Bibeault
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
What you've described is an autocompleter. If the performance is unacceptable, then you may be in trouble at the outset as any other similar mechanism would run into the same issues. Your choice of UI mechanism may have little impact on performance.

How is the data for the search retrieved? From a DB? What's the scale of the data? 10's? 100's? millions? Depending upon these answers, the appropriate sourcing mechanism for the data can be chosen.

I'd also ditch the whole notion of the "+" -- just let the user click on the name. Why make them click on a small "+"? I often say: "UI should not be a test of hand/eye coordination".


 
Clint Russell
Greenhorn
Posts: 4
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

Bear Bibeault wrote:
How is the data for the search retrieved? From a DB? What's the scale of the data? 10's? 100's? millions? Depending upon these answers, the appropriate sourcing mechanism for the data can be chosen.

I'd also ditch the whole notion of the "+" -- just let the user click on the name. Why make them click on a small "+"? I often say: "UI should not be a test of hand/eye coordination".



The data is currently being retrieved on a separate search page using ADO connections to Active Directory, AD contains around 1800 employees.

As for the + sign I am MORE than happy to ditch that and let them click on the user name or the entire column showing the user's name.

The reason for the search button and then a list pop up was to reduce what the ADO AD connection was searching for, thus speeding up the webpage response time. Even though only 1600 employees, my current concept would require 3200 data elementa (name, title per user), so the more I pull into a local data (easily generated via ASP inside the java) the slower the page would pull up initially for an autocompleter.

An example:
On the page I use to search if I put in SMI and click search I get a list of 47 employees in about 1 second, If I put nothing (pulling everyone) the search box takes about 11 seconds to return, so logically I would assume it would take at least those 11 seconds to populate local data for the javascript.

I am open to any suggestions and if the end is to make them wait 10 seconds more that's fine, one might even argue if we change 7 people on average each time we access this, then 7 searches would be at least 1 second each, so 7 seconds total, by building local data there is of course no need to repull the data but to just autocomplete it in each circumstance.
 
Bear Bibeault
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
So it sounds like it's your backend technology that's slowing you down more than choice of widgetry.

With 1800 choices, it's a tad large to load locally into the page (not with JavaScript, but with JSP or whatever you're using on the server as a template engine) but not impossible. I'd give that a try to see if performance is acceptable. That might give you a slower (but maybe not discernibly so) load time, but data retrieval will be immediate.

Failing that, if performance is unacceptable, it's your backend data path that will need tweaking rather than your UI choices on the page.

P.S. I set something up that's very similar for the admin section of a system for a client. The admin starts typing a name into an autocompleter (the jQuery UI widget) and the matching names are pulled from the DB using Ajax. It's lightning fast. The difference is that the data path (access to the database) is streamlined and fast.
 
Bear Bibeault
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Another data point: how often does the data change? If data access is too slow, would a caching mechanism help if the data doesn't change all that often?
 
Consider Paul's rocket mass heater.
reply
    Bookmark Topic Watch Topic
  • New Topic