Unindented submitting of form by autocomplete

[pixtur]

See http://jsfiddle.net/V6shp/10/

Description: For historic reasons I want to insert the autocompletion box with a form tag. Now, when selection a suggested result, the form get's submitted involuntarily.

Current work-around: added...

.select: function() {
event.preventDefault;
}

But this seems to be an evil hack.

[uipoet]

The 1.0 autocomplete implementation did not take form submission into account. The new version does and can be found here: https://github.com/ninja/ninja-autocomplete. You can grab the latest via npm install ninja-autocomplete Examples can be found in the test directory.

[pixtur]

Thanks for this answer. Some more questions:

• I also wanted to use .rating. I assume ninja-autocomplete and ninjaui don't play nicely together. Does that mean I have to find another star-rating widget?

[pixtur]

Okay after fiddling around, I've got a version with 'ninja.js' and 'ninja-autocomplete.js' running.

The only think that's missing now is this part from the original example:

    success: function (data) {
      $autocomplete.list({
        values: $.map(data.geonames, function (item) {
          return {
            html: item.name + ', ' + item.adminName1,
            value: item.name + ', ' + item.adminCode1
          };
        }),
        query: event.query
      })

The amazon-example only deals with a simple list, but I need to distinguish "name" and "id" attributes.

I also noted that selecting a list item with cursor-down keys and then pressing RETURN will submit the form. Is this a bug, I do I miss something?

[uipoet]

ninja-rating 1.1 is not implemented yet. Unfortunately, using both versions of Ninja UI would have conflicts. I will keep you posted on ninja-rating progress.

ninja-autocomplete completes the bound <input>, which itself can have any attributes you like. Since an input can only submit text within a form, the array of suggestions are also only text.

The keyboard submitting of the form does sound like a bug or a misconfiguration. Please create an issue within the ninja-autocomplete repo and I'll investigate.

[pixtur]

Thanks for the quick answer. It took some time to digest the new autocomplete code. But it makes for a pretty decent reading, indeed. And I learned a lot of jquery by doing so.

My current solution is no longer that beautiful but at least I've got it up and running: https://gist.github.com/3870727

Regarding the complex data: This was actually the main reason I discarded jquery.ui and stumbled upon ninja: My current tasks is pretty complex: Setting one autocomplete field has to trigger a series of java-script actions and also set a couple of hidden value fields (not with the string but with an id). I really liked the original approach of every list-element having an object with "html", "value" and "select". This also gave the possibility to compose complex html list items (e.g. like the spotlight results having icon, name and type). Is there a new recommended way to do this?

Any particular reason, why you discarded the highlight of the search term with bold format?