使用jQuery / Coffeescript在页面加载上触发函数

Question

I have a form that shows or hide elements based on the selections they user makes. When the form fails validation I need these elements to show or hide on page load based on their previous selections.

My code looks a little like this:

ready = ->
  $(".radio-button").on "ready change", ->
    value = $(this).val()
    if value != true
        $("#some-element").show();
    else
        $("#some-element").hide();

$(document).ready(ready)
$(document).on('page:load', ready)

The change handler works fine but the ready handler never fires. I'm guessing this has something to do with the ready action finishing before the jquery can bind its own handler?

Answer 1

What is the purpose for attaching the "ready" event to the .radio-button selector? I'm not quite sure if that is valid. Regardless, try the following.

ready = ($) ->
    changeEvent = (e) ->
        value = $(this).val()
        if value is not true
            $("#some-element").show()
        else
            $("#some-element").hide()
    $(".radio-button")
        .on("change", changeEvent)
        .each -> $(this).change()

jQuery ready

This binds the change event to the selector, then immediately triggers that event for each element.