Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Ruby

Ralph Johnson
Ralph Johnson
10,408 Points

Trying to translate this WORKING html/jQuery code into html.erb in Rails. Tearing my hair out.

Trying to create a form to enter booleans into a db table, using checkboxes. Found this code on http://jsfiddle.net/3uf7D/ .

Javascript

    $(document).ready(function() {
        // Whenever the parent checkbox is checked/unchecked
        $(".parentcheckbox").change(function() {
                // save state of parent
            c = $(this).is(':checked');
            $(this).parent().find("input[type=checkbox]").each(function() {
                // set state of siblings
                $(this).attr('checked', c);
            });
       });
    // Update parent checkbox based on children
        $("input[type=checkbox]:not('.parentcheckbox')").change(function() {
            if ($(this).closest("div").find("input[type=checkbox]:not('.parentcheckbox')").not(':checked').length < 1) {
            $(this).closest("div").find(".parentcheckbox").attr('checked', true);
         } else {
            $(this).closest("div").find(".parentcheckbox").attr('checked', false);
        }
        });
    });

It works perfectly with the accompanying html:

HTML

<div class="accordian-group">
    <div>
    <input type="checkbox" class="parentcheckbox" value""/>
        <ul>
         <li> <input type="checkbox" value""/></li>
        <li> <input type="checkbox" value""/></li>
        <li> <input type="checkbox" value""/>
            <ul>
               <li> <input type="checkbox" value""/></li>
               <li> <input type="checkbox" value""/></li>
              <li> <input type="checkbox" value""/>
                    <ul>
                      <li> <input type="checkbox" value""/></li>
                    </ul>
                </li>
           </ul>
       </li>
       </ul>
    </div>
     <div>

It's supposed to toggle--when the parent checkbox is checked, it checks (or unchecks, depending on state) all the children. When a single child is unchecked, the parent (the "check all" box) is unchecked. And it is supposed to toggle indefinitely.

I can't find a way to modify the Rails-generated scaffold to work with the script. One variation (another code snippet from a different author) the script worked ONCE, then quit responding properly (it's supposed toggle continuously until submit).

I tried just copying the html directly into my _form.hml.erb file, and it worked ONCE, then quit toggling.

Also I got an error because I couldn't translate the erb (html.erb tags omitted because they caused the whole statement not to display in this forum for some reason) :

f.check_box :check_all

(or any of the other input statements) into html that would actually store the value in the db table. I don't know the right variable assignment (name=, input=, etc) to feed the db.

But what I'd really prefer is to learn how to translate the above html into html.erb that WORKS, and stores the table values.

Any ideas?