jSuggest -> autoSuggest but with some features added

jSuggest's Avatar

jSuggest

11 Apr, 2011 11:09 PM

Hi all,
I just wanted to share my custom adaptation of autoSuggest.

I have implemented some features i saw on this forum, such as select first result, provide the data when adding or deleting elements, and many bug fixes.

Also I have managed to optimize the code so now it is just 5.43KB minified and 2.18KB gzipped.

Click here to see a working demo and the options and the source code
http://jsbin.com/asahe5/3/edit

  1. 1 Posted by Tom on 13 Apr, 2011 01:05 AM

    Tom's Avatar

    This has a bug in the JSON retrieval. It doesn't work, plain and simple. The JSON call returns results from my script, but the dropdown doesn't get populated.

    http://stackoverflow.com/questions/5643104/jquery-plugin-not-return...

  2. 2 Posted by jSuggest on 13 Apr, 2011 09:50 PM

    jSuggest's Avatar

    Hi Tom, I forgot to say that it is a beta.
    I did not test the url retrieving function, but I will check that asap and see what i can do.

    Thanks for your comment.

  3. 3 Posted by Zee on 13 Apr, 2011 11:41 PM

    Zee's Avatar

    @jSuggest Thanks for you hard work on this jSuggest. I had a difficult time as well getting this to work with JSON calls. I tried to look at the javascript to compare it with the version from Drew Wilson, but ended up way too over my head...

    @Tom have you had any luck? I see the responses on stackoverflow provide a diagnosis more than a solution.

  4. 4 Posted by Tom on 14 Apr, 2011 01:14 AM

    Tom's Avatar

    I haven't really been trying to find a solution. As I mentioned on the Stackoverflow post, the jquery UI autosuggest plugin is less "pretty" by default, but I understand it completely. It's very easy to extend.

    I've switched to using it and have been fairly happy so far. To point you in the right direction if you care to take another stab at it, the getJSON call needs to defer processing the data until after getJSON returns a success. That means pretty much anything that happens with the data will be in the callback function. I think. I'm not an advanced AJAX developer either, so that's my understanding.

    Anyway, I recommend using either Drew's plugin or the jQuery UI for the moment. This one fixes a lot of Drew's bugs, but ultimately isn't useful in a large project until it's feature complete.

    @jSuggest By the way, you might want to pick another name, as jSuggest is definitely taken.

  5. 5 Posted by jSuggest on 16 Apr, 2011 10:23 PM

    jSuggest's Avatar

    Hi @Tom, @Zee.

    So i managed to get some time and i fixed the getJSON() function.

    I did not test it when developing because is not a feature im using atm, but now it seems to work.

    The issue was that the data retrieved from the url was not being handled by the processData function. So I wrote a new function that handles the data from the url and also from the object, so we don't repeat code.

    On the server side, the data must be sended the same way / format which was originally done with the drew's autoSuggest script.

    $json_resp = array(
        $json[] = array( 'value' => '78',
                                'name' => 'michael jordan'),
        $json[] = array( 'value' => '70',
                                'name' => 'michael moore'),
        $json[] = array( 'value' => '71',
                                'name' => 'michael jordano'),
    
    
    );
    header("Content-type: application/json");
    echo json_encode($json_resp);
    

    The output should be something like this:

    [
        {"value":"78","name":"michael jordan"},
    
        {"value":"70","name":"michael moore"},
    
        {"value":"71","name":"michael jordano"}
    ]
    

    Here is the page with the code and demo.
    http://jsbin.com/asahe5/10/edit

    Tell me if it works for you.

    PD: about the name, i did not do a deep research of pluggins, but you can rename it to whatever you want.
    PD2: @TOM, did you had to download the main jQuery UI script to get the autocomplete working?

  6. 6 Posted by Tom on 17 Apr, 2011 06:37 AM

    Tom's Avatar

    @jSuggest I downloaded the main jQuery UI script, yes. However, it wasn't that it got YOUR plugin working, but rather that it has it's OWN autosuggest feature.

    I'll try the new version if I have a chance, but both of my projects that I am using it in have deadlines that are very soon, so I won't be going back to change the autocomplete functions right now.

  7. 7 Posted by prasad.mhatre on 05 Mar, 2012 07:37 AM

    prasad.mhatre's Avatar

    No it's not working as is.

    I couldn't find the reference to jSuggest.js anywhere in the html file.

    Also the sample doesn't work in IE9

    Thanks
    Prasad

  8. 8 Posted by steve on 27 Mar, 2012 09:24 PM

    steve's Avatar

    works great for me! clears the input-as-values ID like autoSuggest didnt. thanks so much!

  9. 9 Posted by Pablo de la Pen... on 28 May, 2012 11:53 AM

    Pablo de la Pena's Avatar

    Hi,

    I think I've found a bug; search items cannot container regex special characters. At least In my autosuggest of programming languages most work fine with the exception of C++. I get an Uncaught Syntax error:

    Uncaught SyntaxError: Invalid regular expression: /c++/: Nothing to repeat

    Also, as pointed out by this guy unterminated parenthesis also cause the bug to occur.

    I realise the issue resides in the original plugin too but thought I'd flag it up with you as I use jSuggest over Andrew's version.

    I did try to sort this issue myself and post a fix (escaping regex characters) but I struggled to get it working without breaking the plugin. I hope it's something you might be able to fix!

    Thanks,
    Pablo.

  10. 10 Posted by bkwdesign on 11 Feb, 2013 08:23 PM

    bkwdesign's Avatar

    I have modified a version of jSuggest. The version I had found, v 0.8, dated April 11, 2011 contained issues with the resultsHolder DIV throwing an error in IE 8 and lower due to the way hover detection was implemented in the script (or, due to the way hover support was lacking in the browser).

    Here's my updated version:
    http://pastebin.com/nwAX5kcj

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:

»

Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac