Dynamic Collection Select in Rails using jQuery and AJAX

Question

I have a simple application, in which I allow users to create posts. In order to create a post, users need to select a category. I want to use a collection select to show the category. When a user selects a category, I need to show another collection select below it, which lists the sub categories within that category. All this happens in the posts/new page.

I tried to implement this using jQuery and AJAX, I only got to the point when I could find the id of the category from the first collection select, confirmed by showing an alert() box showing that id. But I have no idea how to make an AJAX POST to the server with that id, retrieve the subcategories, and then show the second collection select.

All the examples I have found in the web did not work for me. Can anyone provide me with a complete working code that can serve for my requirement? Thanks.

Gaurav Gupta · Accepted Answer · 2011-08-04 17:14:11Z

3

First off, write a controller action which accepts a category ID as the parameter and renders it's subcategories in plain text in the format below:

<option value="1">First subcategory</option>
<option value="2">Second subcategory</option>
<option value="3">Third subcategory</option>

Next, write an AJAX request which is triggered when the category dropdown changes:

$('#category_dropdown').change(function() {
  var subcategory_url = "/get_subcategories?category_id=" + $(this).val();
  var subcategory_select = $(this).next('select');

  $.ajax({
    url: subcategory_url,
    success: function(data) {
      subcategory_select.html("<option selected=selected>Select Subcategory</option>" + data);
    }
  });
});

answered Aug 4, 2011 at 17:14

Gaurav Gupta

5,4162 gold badges33 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

rookieRailer Over a year ago

I was able to achieve this with something similar, i have that code in this post. Thanks for your help though.

Collectives™ on Stack Overflow

Dynamic Collection Select in Rails using jQuery and AJAX

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related