Forum: Ruby on Rails Checkboxes expand to show new options when checked?

Announcement (2017-05-07): www.ruby-forum.com is now read-only since I unfortunately do not have the time to support and maintain the forum any more. Please see rubyonrails.org/community and ruby-lang.org/en/community for other Rails- und Ruby-related community platforms.
6ec1e89eef5ce09fbfa56be5b6dd17b5?d=identicon&s=25 Adam Bloom (admanb)
on 2006-03-31 04:44
I'm writing a simple CMS where every item ("listing") HABTM categories
and subcategories (which themselves belong_to a category). What I'm
trying to do now is create a UI effect for listing creation: when you go
to create a listing, only the possible categories will be shown, but
when you select a category a set of new categories will be displayed
like so:

Lions
Tigers
Bears

> click on Tigers

Lions
Tigers
   Feeding
   Breeding
   Storing
Bears

> de-select Tigers and it returns to normal.

What I have right now is a display where every category and subcategory
is displayed at once. The code looks something like this:

<% for category in @categories %>
   <div id="categories"> <input type="checkbox" /NAME, ID, VALUE ARE
HERE>
                         <%= category.name %>
</div>
   <% for subcategory in category.subcategories %>
       <div id="subcategories"> <input type="checkbox" /DITTO>
                                <%= subcategory.name %>
</div
<% end %>
<% end %>

Is there some kind of conditional I can put before the second "for"
statement? An is_checked? sort of thing? Or maybe AJAX using
Element.toggle? I don't know where to start - and a web search didn't do
much good.

Thanks,

Adam
6ec1e89eef5ce09fbfa56be5b6dd17b5?d=identicon&s=25 Adam Bloom (admanb)
on 2006-03-31 20:24
Still curious about this...

-Adam
C29d9db03853958c4de5ee6b06edd39a?d=identicon&s=25 Nicolas Buet (Guest)
on 2006-03-31 21:05
(Received via mailing list)
you have the javascript option, or the ajax option.

In javascript, it is quite straightforward: a click on something toggle
the
visibility of a div. It works like that:


<% for category in @categories %>
  <div id="categories">
       <a href="#" onclick="Element.toggle('subcategories_<%=
category.name%>');"><%=
category.name %></a>
</div>
  <% for subcategory in category.subcategories %>
      <div id="subcategories_<%= category.name %>"
style="display:none">
                  <input type="checkbox" /DITTO>
                               <%= subcategory.name %>
</div>
<% end %>
<% end %>

IMHO, ajax would be useful here only if subcategory is big. Otherwise,
this
method work fine.
6ec1e89eef5ce09fbfa56be5b6dd17b5?d=identicon&s=25 Adam Bloom (admanb)
on 2006-03-31 23:42
> IMHO, ajax would be useful here only if subcategory is big. Otherwise,
> this
> method work fine.

That works great! Thanks a lot,

-Adam
6ec1e89eef5ce09fbfa56be5b6dd17b5?d=identicon&s=25 Adam Bloom (admanb)
on 2006-04-01 00:25
I'm having one problem. In my code, inside the <input ... > tag I have:

<% if @listing.categories.include? category %>checked="checked"<% end %>

because the same form that's used to create is used to edit. Obviously
this results in the categories being checked, but the subcategories
aren't toggled on. I tried this inside the <div id="categories">:

<% if @listing.categories.include? category %>
   <script language="javascript"
type="text/javascript">Element.toggle('subcategories_<%=category.name%>');</script>
<% end %>

but it didn't togggle...

Sorry, I'm still a newbie at all of this.

Thanks again,

Adam
C29d9db03853958c4de5ee6b06edd39a?d=identicon&s=25 Nicolas Buet (Guest)
on 2006-04-01 10:52
(Received via mailing list)
Your problem is that you would like a category checked to be shown,
right?
then the code
<div id="subcategories_<%= category.name %>"  style="display:none">
Should be replaced by
<div id="subcategories_<%= category.name %>"  <%= 'style="display:none"'
if
@listing.categories.include? category  %> >

Regards
C29d9db03853958c4de5ee6b06edd39a?d=identicon&s=25 Nicolas Buet (Guest)
on 2006-04-01 10:52
(Received via mailing list)
Ops, I meant:

 <div id="subcategories_<%= category.name %>"  <%=
'style="display:none"' if
not @ listing.categories.include? category  %> >
6ec1e89eef5ce09fbfa56be5b6dd17b5?d=identicon&s=25 Adam Bloom (admanb)
on 2006-04-01 21:48
Nicolas Buet wrote:
> Your problem is that you would like a category checked to be shown,
> right?
> then the code
> <div id="subcategories_<%= category.name %>"  style="display:none">
> Should be replaced by
> <div id="subcategories_<%= category.name %>"  <%= 'style="display:none"'
> if
> @listing.categories.include? category  %> >
>
> Regards

Doh! It seems so obvious once I see it. :)

Thanks a lot,

Adam
This topic is locked and can not be replied to.