Country State City using AJAX

HI , I have a state and country drop down in my client form and i
want that state to be populated when a country is selected, How ever
iam struggling on it… i dont want to implement plain JavaScript but
AJAX for this, please let me know any resources or the rite
direction…

Thanks in Advance

This is a good resource to start:
http://railscasts.com/episodes/88-dynamic-select-menus

2012/5/2 AJ [email protected]

Thanks Laura
i have gone through this but it has an example where Javascript has been
used , i want to use AJAX and JQuery, Thanks

On Wed, May 2, 2012 at 7:34 PM, Lauro C.
[email protected]wrote:


You received this message because you are subscribed to the Google G.
“Ruby on Rails: Talk” group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.


Thanks & Regards,
Akshar Jamgaonkar

On Wed, May 2, 2012 at 7:06 AM, akshar jamgaonkar
[email protected] wrote:

i have gone through this but it has an example where Javascript has been
used , i want to use AJAX and JQuery,

So what’s the problem? What have you tried so far, and how did it
not work?


Hassan S. ------------------------ [email protected]
http://about.me/hassanschroeder
twitter: @hassan

Hi Hassan,

I am Bit of a novoice to this… iam nt sure wether this is correct
approach…in my application.js file i have wriiten

$(document).ready(function() {
$("#client_country_id").change(function() {
$.ajax({
type: “GET”,
url: ‘/states/1’,
success: function(data) {
// Code
}
});
});
});

and my clients form has state feidl like this

<%= f.label :state1 %> <%= f.select 'state_id', State.find(:all).collect{|s| [s.name,s.id]} %>

now i want to pass the country id and ftecth state depending on
it… do i include the above div in a prtial and what to write in
the state controller…

Thanks in advance.

Thanks & Regards,

On May 2, 7:14pm, Hassan S. [email protected]

Hey Aziz,

   really thanks for you repl..........so do i need to write a

controller action that would return me the states depending on the
country
and how do i render the state drop down in Cilent Form…Thanks…

Thanks,
AJ

On Thu, May 3, 2012 at 4:46 PM, Aziz B.
[email protected]wrote:

    $.ajax({

state_id that was selected currently. Using the below js, in your
success: function(data) {

Hi Hassan,
// Code
<%= f.label :state1 %>

been

http://groups.google.com/group/rubyonrails-talk?hl=en.


Thanks & Regards,
Akshar Jamgaonkar

Hey AJ

In your ajax call, you need to pass the id of the selected state if you
are
using a nested resource url structure.
Your js would looks something like this:

$(document).ready(function() {
var country_states_path = '/countries/:id/states;
$("#client_country_id").change(function() {
var state_id = $(this).val();
$.ajax({
type: “GET”,
url: country_states_path.replace(":id", id),
success: function(data) {
// Code to populate cities
}
});
});
});

Incase you are not using nested resources, you still need to pass the
state_id that was selected currently. Using the below js, in your
controller, the state id would be available as params[:state]

$(document).ready(function() {
var country_states_path = ‘/states/’;
$("#client_country_id").change(function() {
var country_id = $(this).val();
$.ajax({
type: “GET”,
data: {country: country_id},
url: country_states_path,
success: function(data) {
// Code to populate cities
}
});
});
});

On Thu, May 3, 2012 at 12:42 PM, AJ [email protected] wrote:

success: function(data) {

Thanks in advance. > > i have gone through this but it has an example where Javascript has


You received this message because you are subscribed to the Google G.
“Ruby on Rails: Talk” group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

  • Aziz M. Bookwala

Hey AJ

Yes, to serve any request made by your client, you would need something
on
the server to handle the request.
As for rendering the dropdown, this is a pretty simple thing to do with
jQuery. Look around, you should find something quite easily.

On Thu, May 3, 2012 at 5:01 PM, akshar jamgaonkar <
[email protected]> wrote:

On Thu, May 3, 2012 at 4:46 PM, Aziz B. [email protected]wrote:

    var state_id = $(this).val();

Incase you are not using nested resources, you still need to pass the
url: country_states_path,

success: function(data) {

Thanks in advance. > > i have gone through this but it has an example where Javascript has

For more options, visit this group at
You received this message because you are subscribed to the Google G.
“Ruby on Rails: Talk” group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

  • Aziz M. Bookwala

Thanks Aziz… I have wriiten a countries_state action and in states
controller, and in application.js i have modified the path like this
var country_states_path = ‘/states/countries_state/’; however on console
its giving me eroor like

Couldn't find State with id=countries_state
... Iam

struggling
to find what;s going wrong as iam pretty new to all this…thanks a lot
all
of you for your help…

On Thu, May 3, 2012 at 5:03 PM, Aziz B.
[email protected]wrote:

On Thu, May 3, 2012 at 4:46 PM, Aziz B. [email protected]wrote:

    var state_id = $(this).val();

Incase you are not using nested resources, you still need to pass the
url: country_states_path,

success: function(data) {

Thanks in advance. > > i have gone through this but it has an example where Javascript has

For more options, visit this group at
You received this message because you are subscribed to the Google G.


Thanks & Regards,
Akshar Jamgaonkar

Did you add a route for this new action?

On Thu, May 3, 2012 at 5:08 PM, akshar jamgaonkar <
[email protected]> wrote:

On Thu, May 3, 2012 at 4:46 PM, Aziz B. [email protected]wrote:

    var state_id = $(this).val();

Incase you are not using nested resources, you still need to pass the
url: country_states_path,

success: function(data) {

Thanks in advance. > > i have gone through this but it has an example where Javascript

[email protected]

http://groups.google.com/group/rubyonrails-talk?hl=en.
“Ruby on Rails: Talk” group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

  • Aziz M. Bookwala

my country_state action looks like this

def countries_state
@state = State.find(“country_id = :c_id”,{:c_id=>params[:country_id]})
respond_to do |format|
format.js
end
end

On Thu, May 3, 2012 at 5:08 PM, akshar jamgaonkar <
[email protected]in.invalid> wrote:

On Thu, May 3, 2012 at 4:46 PM, Aziz B. [email protected]wrote:

    var state_id = $(this).val();

Incase you are not using nested resources, you still need to pass the
url: country_states_path,

success: function(data) {

Thanks in advance. > > i have gone through this but it has an example where Javascript

[email protected]

http://groups.google.com/group/rubyonrails-talk?hl=en.


Thanks & Regards,
Akshar Jamgaonkar


Thanks & Regards,
Akshar Jamgaonkar

Make sure this route comes before the route entry for the country
resource.

On Thu, May 3, 2012 at 5:12 PM, akshar jamgaonkar <
[email protected]> wrote:

On Thu, May 3, 2012 at 5:08 PM, akshar jamgaonkar <

On Thu, May 3, 2012 at 5:01 PM, akshar jamgaonkar <

$(document).ready(function() {
});
$.ajax({

$("#client_country_id").change(function() {

now i want to pass the country id and ftecth state depending on
wrote:


[email protected]
You received this message because you are subscribed to the Google

[email protected]
You received this message because you are subscribed to the Google

http://groups.google.com/group/rubyonrails-talk?hl=en.
To post to this group, send email to [email protected]n.invalid.
Akshar Jamgaonkar


You received this message because you are subscribed to the Google G.
“Ruby on Rails: Talk” group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

  • Aziz M. Bookwala

Yes i have added…it looks like this

match “/states/countries_state/:country_id” => “states#countries_state”

On Thu, May 3, 2012 at 5:10 PM, Aziz B.
[email protected]wrote:

Couldn't find State with id=countries_state
... Iam

As for rendering the dropdown, this is a pretty simple thing to do with

and how do i render the state drop down in Cilent Form…Thanks…

you are using a nested resource url structure.
// Code to populate cities
var country_states_path = ‘/states/’;
});

});

not work?
[email protected]

To unsubscribe from this group, send email to

For more options, visit this group at
“Ruby on Rails: Talk” group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.


Thanks & Regards,
Akshar Jamgaonkar

Make sure ur using the currect URL for the new action.

On Thu, May 3, 2012 at 5:18 PM, akshar jamgaonkar <
[email protected]> wrote:

get “home/index”

On Thu, May 3, 2012 at 5:08 PM, akshar jamgaonkar <

AJ

    });
    var country_id = $(this).val();

$(document).ready(function() {

On May 2, 7:14 pm, Hassan S. [email protected]

To unsubscribe from this group, send email to

To unsubscribe from this group, send email to

To unsubscribe from this group, send email to

For more options, visit this group at
“Ruby on Rails: Talk” group.
Thanks & Regards,

  • Aziz M. Bookwala

Yea it looks like this…

match “/states/countries_state/:country_id” => “states#countries_state”

resources :clients

resources :skill_sets

resources :technologies

resources :level_of_contacts

resources :states

resources :discounts

resources :countries

resources :roles

get “home/index”

On Thu, May 3, 2012 at 5:15 PM, Aziz B.
[email protected]wrote:

var country_states_path = ‘/states/countries_state/’; however on

Yes, to serve any request made by your client, you would need

   really thanks for you repl..........so do i need to write a

Hey AJ
type: “GET”,
controller, the state id would be available as params[:state]
// Code to populate cities

// Code
<%= f.label :state1 %>

has been

[email protected]

[email protected]

http://groups.google.com/group/rubyonrails-talk?hl=en.
“Ruby on Rails: Talk” group.

  • Aziz M. Bookwala


You received this message because you are subscribed to the Google G.
“Ruby on Rails: Talk” group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.


Thanks & Regards,
Akshar Jamgaonkar

Iam sorry i didnt get you… i have created a new action for the
ajax stuff is this approach wrong… This is how my states controller
is


class StatesController < ApplicationController

GET /states

GET /states.json

def index
@states = State.all

respond_to do |format|
  format.html # index.html.erb
  format.json { render json: @states }
end

end

GET /states/1

GET /states/1.json

def show
@state = State.find(params[:id])

respond_to do |format|
  format.html # show.html.erb
  format.json { render json: @state }
end

end

GET /states/new

GET /states/new.json

def new
@state = State.new
respond_to do |format|
format.html # new.html.erb
format.json { render json: @state }
end
end

GET /states/1/edit

def edit
@state = State.find(params[:id])
end

POST /states

POST /states.json

def create
@state = State.new(params[:state])

respond_to do |format|
  if @state.save
    format.html { redirect_to @state, notice: 'State was 

successfully
created.’ }
format.json { render json: @state, status: :created, location:
@state }
else
format.html { render action: “new” }
format.json { render json: @state.errors, status:
:unprocessable_entity }
end
end
end

def countries_state
@state = State.find(“country_id = :c_id”,{:c_id => params[:country]})
respond_to do |format|
format.html
format.js
end
end

PUT /states/1

PUT /states/1.json

def update
@state = State.find(params[:id])

respond_to do |format|
  if @state.update_attributes(params[:state])
    format.html { redirect_to @state, notice: 'State was 

successfully
updated.’ }
format.json { head :ok }
else
format.html { render action: “edit” }
format.json { render json: @state.errors, status:
:unprocessable_entity }
end
end
end

DELETE /states/1

DELETE /states/1.json

def destroy
@state = State.find(params[:id])
@state.destroy

respond_to do |format|
  format.html { redirect_to states_url }
  format.json { head :ok }
end

end
end


On Thu, May 3, 2012 at 5:20 PM, Aziz B.
[email protected]wrote:

resources :discounts

Make sure this route comes before the route entry for the country

var country_states_path = ‘/states/countries_state/’; however on

    $.ajax({

the state_id that was selected currently. Using the below js, in your
success: function(data) {

Hi Hassan,
success: function(data) {

[email protected] wrote:
@gmail.comhttp://about.me/hassanschroeder
http://groups.google.com/group/rubyonrails-talk?hl=en.
To post to this group, send email to
Thanks & Regards,
http://groups.google.com/group/rubyonrails-talk?hl=en.
To post to this group, send email to
Thanks & Regards,
http://groups.google.com/group/rubyonrails-talk?hl=en.
To post to this group, send email to [email protected]
Thanks & Regards,

To unsubscribe from this group, send email to

For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.


Thanks & Regards,
Akshar Jamgaonkar

That is fine, though you could make it more ‘RESTful’ by adding it as a
nested resource. You can read about that
herehttp://railscasts.com/episodes/139-nested-resources.
The RailsCast is a little old, but you should get the idea.

With respect to your current problem, what is the url you are using in
your
js?

On Thu, May 3, 2012 at 5:23 PM, akshar jamgaonkar <
[email protected]> wrote:

def index
def show
def new
end
format.json { render json: @state, status: :created, location:
@state = State.find(“country_id = :c_id”,{:c_id => params[:country]})

end
  format.json { head :ok }

resources :skill_sets

Couldn't find State with id=countries_state
... Iam

something on the server to handle the request.

controller action that would return me the states depending on the
country

        url: country_states_path.replace(":id", id),

        }

I am Bit of a novoice to this… iam nt sure wether this is
}
<%= f.select ‘state_id’, State.find(:all).collect{|s|

Javascript has been

To unsubscribe from this group, send email to

To unsubscribe from this group, send email to

To unsubscribe from this group, send email to

[email protected]nvalid.

http://groups.google.com/group/rubyonrails-talk?hl=en.
“Ruby on Rails: Talk” group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

  • Aziz M. Bookwala

Not a problem.

On Thu, May 3, 2012 at 5:32 PM, akshar jamgaonkar <
[email protected]> wrote:

your js?


end
end

end

  end

  else
@state = State.find(params[:id])

resources :states
On Thu, May 3, 2012 at 5:15 PM, Aziz B. <[email protected]

On Thu, May 3, 2012 at 5:08 PM, akshar jamgaonkar <

AJ

    });
    var country_id = $(this).val();

});

Thanks & Regards,

You received this message because you are subscribed to the

For more options, visit this group at
You received this message because you are subscribed to the

For more options, visit this group at
You received this message because you are subscribed to the Google

For more options, visit this group at
You received this message because you are subscribed to the Google

For more options, visit this group at
You received this message because you are subscribed to the Google

http://groups.google.com/group/rubyonrails-talk?hl=en.
Groups “Ruby on Rails: Talk” group.

  • Aziz M. Bookwala

To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

  • Aziz M. Bookwala

Thanks Aziz …thanks a lot…really appriaciate your help

On Thu, May 3, 2012 at 5:31 PM, Aziz B.
[email protected]wrote:

def index
def show
def new
end
format.json { render json: @state, status: :created, location:
@state = State.find(“country_id = :c_id”,{:c_id => params[:country]})

end
  format.json { head :ok }

resources :skill_sets

[email protected]> wrote:

console its giving me eroor like

Yes, to serve any request made by your client, you would need

   really thanks for you repl..........so do i need to write

Hey AJ
type: “GET”,
controller, the state id would be available as params[:state]
// Code to populate cities

Hi Hassan,
success: function(data) {

Hassan S. ------------------------ hassan.schroe…
For more options, visit this group at
Google G. “Ruby on Rails: Talk” group.

For more options, visit this group at
Groups “Ruby on Rails: Talk” group.

For more options, visit this group at
Groups “Ruby on Rails: Talk” group.

For more options, visit this group at
Groups “Ruby on Rails: Talk” group.

http://groups.google.com/group/rubyonrails-talk?hl=en.
To post to this group, send email to [email protected]
Akshar Jamgaonkar

[email protected]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.


Thanks & Regards,
Akshar Jamgaonkar

Also in the def countries_state
@state = State.where(“country_id = :c_id”,{:c_id =>
params[:country_id]})
respond_to do |format|
format.html
end
end

previously the it was format.js when nothing on the page was changing
dynamically but when i make it format.html, the state drop down changes
but
i get all the unnecessary thing like the the entire html page.

Thanks

On Thu, May 3, 2012 at 5:47 PM, akshar jamgaonkar <
[email protected]> wrote:

var country_states_path = '/states/countries_state/';
});

Thanks Aziz …thanks a lot…really appriaciate your help


end
end

end

  end

  else
@state = State.find(params[:id])

resources :level_of_contacts

struggling to find what;s going wrong as iam pretty new to all

As for rendering the dropdown, this is a pretty simple thing to

country and how do i render the state drop down in Cilent
Form…Thanks…

In your ajax call, you need to pass the id of the selected
success: function(data) {
$(document).ready(function() {
});

I am Bit of a novoice to this… iam nt sure wether this
}
<%= f.select ‘state_id’, State.find(:all).collect{|s|
Thanks in advance.

[email protected] wrote:
@gmail.comhttp://about.me/hassanschroeder
http://groups.google.com/group/rubyonrails-talk?hl=en.
To post to this group, send email to
Thanks & Regards,
http://groups.google.com/group/rubyonrails-talk?hl=en.
To post to this group, send email to
Thanks & Regards,
http://groups.google.com/group/rubyonrails-talk?hl=en.
To post to this group, send email to
Thanks & Regards,
http://groups.google.com/group/rubyonrails-talk?hl=en.
To post to this group, send email to
Thanks & Regards,
http://groups.google.com/group/rubyonrails-talk?hl=en.
To post to this group, send email to
Thanks & Regards,
http://groups.google.com/group/rubyonrails-talk?hl=en.
To post to this group, send email to [email protected]
Akshar Jamgaonkar

[email protected]


Thanks & Regards,
Akshar Jamgaonkar

This forum is not affiliated to the Ruby language, Ruby on Rails framework, nor any Ruby applications discussed here.

| Privacy Policy | Terms of Service | Remote Ruby Jobs