---
title: "select option generate value from ajax on change"
description: "select option generate value from ajax on change"
author: "Manoj Bhatt"
published: 2015-01-20
updated: 2015-01-20
canonical: https://www.mindstick.com/forum/12881/select-option-generate-value-from-ajax-on-change
category: "javascript"
tags: ["ajax", "jquery", "php"]
reading_time: 2 minutes
---
# select option generate value from ajax on change
I have 3 [select](https://www.mindstick.com/forum/160534/orderby-then-select-vs-select-then-orderby-performance) here one for [continent](https://answers.mindstick.com/qa/33919/which-country-of-the-african-continent-became-the-182nd-member-of-the-un-in-1993) one for [country](https://yourviews.mindstick.com/view/85543/do-you-think-that-french-will-be-islamic-country) one for city i get data to [populate](https://www.mindstick.com/blog/60/populate-records-in-second-listbox-according-to-the-selection-in-first-list-box) these select from [ajax request](https://www.mindstick.com/forum/157891/what-is-the-role-of-the-jsonresult-class-in-mvc-how-can-it-use-to-return-data-to-an-ajax-request) it is now [working fine](https://answers.mindstick.com/qa/95550/why-is-the-safari-browser-not-working-fine) i just want to make a bit fancy so i want to have a few [function](https://www.mindstick.com/articles/13001/multi-statement-table-valued-user-defined-function-in-sql-server)
1.When Continent is select the list of country for that continent is listed in the country list when the change happens i want the city to also show the [cities](https://yourviews.mindstick.com/view/252/air-pollution-choking-many-cities) of the first [entry](https://www.mindstick.com/interview/531/how-to-delete-an-array-entry-using-javascript) in the country currently it does not happened what i do is i still need to change the entry in country select to show the list of cities
2.Question is do i need to add another ajax request inside the ajax request for continent i am not sure this one is feasible i tried it, it is not working for now
**here is my ajax request**
```
$('.continentname').change(function() { var id = $(this).find(':selected')[0].id; //alert(id); $.ajax({ type:'POST', url:'../include/continent.php', data:{'id':id}, success:function(data){ // the next thing you want to do var country= document.getElementById('country'); $(country).empty(); var city = document.getElementById('city'); $(city).empty(); for (var i = 0; i < data.length; i++) { $(country).append(''); } } }); }); $('.countryname').change(function() { var id = $(this).find(':selected')[0].id; $.ajax({ type:'POST', url:'../include/country.php', data:{'id':id}, success:function(data){ // the next thing you want to do var city = document.getElementById('city'); $(city).empty(); for (var i = 0; i < data.length; i++) { $(city).append(''); } } });
```
## Replies
### Reply by Jayden Bell
You can trigger a change event for the country element once it is populated
```
$('.continentname').change(function () { var id = $(this).find(':selected')[0].id; //alert(id); $.ajax({ type: 'POST', url: '../include/continent.php', data: { 'id': id }, success: function (data) { // the next thing you want to do var $country = $('#country'); $country.empty(); $('#city').empty(); for (var i= 0; i < data.length; i++) {
$country.append(''); } //manually trigger a change event for the contry so that the change handler will get
triggered $country.change(); } }); }); $('.countryname').change(function () { var id = $(this).find(':selected')[0].id; $.ajax({ type: 'POST', url: '../include/country.php', data: { 'id': id }, success: function(data) { // the next thing you want to do var $city =$('#city');
```
---
Original Source: https://www.mindstick.com/forum/12881/select-option-generate-value-from-ajax-on-change
Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.