Handling ENTER on text input bindings

[Rodrigo Rosenfeld Rosas]

It is very handy to be able to handle changes to a text input field when ENTER is pressed. This kind of works out of the box in Chrome, but not in IE9, for example.

What do you think about registering to the keydown event and checking for ENTER being pressed and change the bound attribute accordingly?

[Jonas Nicklas]

I usually bind to the submit event of the form that contains the
element. Much cleaner, in my opinion.

/Jonas

[Rodrigo Rosenfeld Rosas]

It can be if you're using a form, which is not my case. I need to respond to several changes in lots of field types.

Knockout seems to make sure the bindings work the same way across browsers, but this is not the case with Serenade.

For example, try to add a class to some div depending on some attribute that will change its background color.

Then bind that attribute to a checkbox and you'll see that the background will change only when the checkbox loses the focus in IE 8.

It is too much work to handle such differences individually for each browser and it goes against the usage of some library for helping us to write consistent code that will work the same way across supported browsers.

Could you please reconsider a consistent binding behavior across browsers, taking into account that they will trigger their events in different ways?

[Rodrigo Rosenfeld Rosas]

Em terça-feira, 26 de junho de 2012 17h29min40s UTC-3, Rodrigo Rosenfeld Rosas escreveu:

...

For example, try to add a class to some div depending on some attribute that will change its background color.

Then bind that attribute to a checkbox and you'll see that the background will change only when the checkbox loses the focus in IE 8.

This is specially bad if you have something like

label

  input[type="checkbox" binding:change=@enable]

  "Enable"

Then, if you click on "Enable" label, you'll see the opposite effect of the other browsers.

[Jonas Nicklas]

You can use jQuery's event bindings, if you want this consistency in edge cases.

Serenade.useJQuery()

/Jonas

[Rodrigo Rosenfeld Rosas]

Em 26-06-2012 18:20, Jonas Nicklas escreveu:

You can use jQuery's event bindings, if you want this consistency in edge cases.

Serenade.useJQuery()

I didn't know about that. I'll give it a try tomorrow. For the time being, this is working for me:

old-ie.js.coffee:

$ ->
  return unless $.browser.msie and $.browser.version[0] < 9
  $(document).on 'click', 'input[type=checkbox]', ->
    $(this).trigger("change").blur(); $(this).focus()
  $(document).on 'keydown', 'input[type=text]', (ev)->
    ($(this).trigger("change").blur(); $(this).focus()) if `ev.which == 13` # Enter