how to pass form values within an ajax call?

rubyonrails-talk
1

hi guys,   I am now rewriting an existing app (rails 2.3.8) with rails 3.1.x.

As observe_field() is no longer the way to go with rails 3 when ajax is used, I am trying to rewrite a piece of functionality for when a select box (drop down) with a div id of 'category' is clicked (onChange), -a call is made to the sub_categories controller with the category ID (from the selected option in the category select box) -the sub categories belonging to the selected category ID will be returned and a another select box is to be generated in the div with id of 'sub_category'.

I'm looking at Unobtrusive JavaScript in Rails 3 — Simone Carletti and I have a question now.

How do I go about passing a variable value to the javascript that performs the asynchronous call?

For example, i have :

// Append the function to the "document ready" chain jQuery(function($) {   // when the #search field changes   $("#category").change(function() {     // make a POST call and replace the content     $.post(<%= category_sub_categories_path %>, function(data) {       $("#results").html(data);     });   }); })

-how do I pass the category id (which is a form value) to the category_sub_categories_path?? -would the category_id value be valid in the jQuery call?

2

This has nothing to do with Rails, this is a strictly jQuery question. Take a look at the $.post documentation[1]

Cheers. [1]jQuery.post() | jQuery API Documentation

3

1. The following javascript is being defined in myapp/public/ javascripts/application.js

jQuery(function($) {   // when the #search field changes   $("#category").change(function() {     // make a POST call and replace the content     $.post(<%= category_sub_categories_path %>, function(data) {       $("#results").html(data);     });   }); })

2. this javascript is being applied to the myapp/app/views/parts/ _form.html.erb partial template

My question is, if there is a rails variable, @categories in the partial template, I need to pass the @categories.id value to the javascript from there. Would this work?

If somebody understands this and could comment, kindly share your input. Thank you