Dynamic Drop Down lists using ajax sql and php

0 votes

I have a code that is effective. The dropdowns are filled based on the previous list, but there is an issue. The option value =""> field in the HTML form displays "id," a number value rather than "name." Please explain to me how "name" can be displayed instead of the value. The true issue is that when data is saved in a SQL database, the matching "id" of the country, state, or city is stored instead of its "name."

This is the code that I am using. I have tried changing the last line in ajax.php echo "<option value='$entity_id'>$enity_name</option>"; to echo "<option value='$entity_name'>$enity_name</option>"; but then the dynamic dropdowns do not work as they are dependent upon "id". Many thanks for your help.

ajax.php

<?php
    /* File : ajax.php
     * Author : Manish Kumar Jangir
    */
    class AJAX {

        private $database = NULL;
        private $_query = NULL;
        private $_fields = array();
        public  $_index = NULL;
        const DB_HOST = "localhost";
        const DB_USER = "admin";
        const DB_PASSWORD = "admin";
        const DB_NAME = "disciples";


        public function __construct(){
            $this->db_connect();                    // Initiate Database connection
            $this->process_data();
        }

        /*
         *  Connect to database
        */
        private function db_connect(){
            $this->database = mysql_connect(self::DB_HOST,self::DB_USER,self::DB_PASSWORD);
            if($this->database){
                $db =  mysql_select_db(self::DB_NAME,$this->database);
            } else {
                echo mysql_error();die;
            }
        }

        private function process_data(){
            $this->_index = ($_REQUEST['index'])?$_REQUEST['index']:NULL;
            $id = ($_REQUEST['id'])?$_REQUEST['id']:NULL;
            switch($this->_index){
                case 'country':
                    $this->_query = "SELECT * FROM countries";
                    $this->_fields = array('id','country_name');
                    break;
                case 'state':
                    $this->_query = "SELECT * FROM states WHERE country_id=$id";
                    $this->_fields = array('id','state_name');
                    break;
                case 'city':
                    $this->_query = "SELECT * FROM cities WHERE state_id=$id";
                    $this->_fields = array('id','city_name');
                    break;
                default:
                    break;
            }
            $this->show_result();
        }

        public function show_result(){
            echo '<option value="">Select '.$this->_index.'</option>';
            $query = mysql_query($this->_query);
            while($result = mysql_fetch_array($query)){
                $entity_id = $result[$this->_fields[0]];
                $enity_name = $result[$this->_fields[1]];
                echo "<option value='$entity_id'>$enity_name</option>";
            }
        }
    }

    $obj = new AJAX;

?>

index.html

<html xmlns="http://www.w3.org/1999/xhtml"><head profile="http://gmpg.org/xfn/11">
<head>
<title>Country State City Dependent Dropdown using Ajax</title>
<script type="text/javascript" src="jquery-1.5.2.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){
    load_options('','country');
});

function load_options(id,index){
    $("#loading").show();
    if(index=="state"){
        $("#city").html('<option value="">Select city</option>');
    }
    $.ajax({
        url: "ajax.php?index="+index+"&id="+id,
        complete: function(){$("#loading").hide();},
        success: function(data) {
            $("#"+index).html(data);
        }
    })
}
</script>
</head>
<body>
<div style="width:800px; margin:auto;padding-top:100px;">
<h1>Country,State,City dynamic dependent dropdown using Ajax and Jquery</h1>
<form>
        <label>Select Country</label>
        <select id="country" name="country" onchange="load_options(this.value,'state');">
            <option value="">Select country</option>
        </select>
        &nbsp;&nbsp;&nbsp;
        <label>Select State</label>
        <select id="state" name="state" onchange="load_options(this.value,'city');">
            <option value="">Select state</option>
        </select>
        &nbsp;&nbsp;&nbsp;
        <label>Select city</label>
        <select id="city" name="city">
            <option value="">Select City</option>
        </select>
        <img src="loader.gif" id="loading" align="absmiddle" style="display:none;"/>
</form>
</div>
</body>
</html>

Can someone please help me with this?

Sep 3 in Database by Kithuzzz
• 12,240 points
78 views

No answer to this question. Be the first to respond.

Your answer

Your name to display (optional):
Privacy: Your email address will only be used for sending these notifications.

Related Questions In Database

0 votes
0 answers

What is the difference between drop table and delete table in SQL Server?

What is the distinction between the following ...READ MORE

Aug 9 in Database by Kithuzzz
• 12,240 points
71 views
0 votes
0 answers

How to create a small and simple database using Oracle 11 g and SQL Developer?

How can I build a tiny, straightforward ...READ MORE

Aug 20 in Database by Kithuzzz
• 12,240 points
39 views
0 votes
0 answers

How to see the real SQL query in Python cursor.execute using pyodbc and MS-Access

I use the following code in Python ...READ MORE

Sep 4 in Database by Kithuzzz
• 12,240 points
16 views
0 votes
1 answer

Difference between single and double quotes in SQL

Single quotes are used to indicate the ...READ MORE

answered Sep 11, 2018 in Database by CodingByHeart77
• 3,720 points
17,077 views
0 votes
1 answer

STUFF and REPLACE function in SQL

STUFF Function: This function is used to ...READ MORE

answered Sep 28, 2018 in Database by DataKing99
• 8,240 points
783 views
0 votes
1 answer

Difference between clustered and non clustered index in SQL

The differences between the clustered and non ...READ MORE

answered Sep 28, 2018 in Database by Sahiti
• 6,380 points
952 views
0 votes
0 answers

Edit PHP query code depending on image map clicked area using AJAX

I am working on an image map ...READ MORE

Jun 3 in PHP by Kichu
• 19,040 points
33 views
0 votes
0 answers

Fetch data from database in php through AJAX,

The index.php  I created a connection with the ...READ MORE

Jun 16 in PHP by narikkadan
• 20,880 points
722 views
0 votes
0 answers

Using Jquery Ajax to retrieve data from Mysql

list.php: A simple ajax code that I ...READ MORE

Jun 20 in PHP by Kithuzzz
• 12,240 points
128 views
0 votes
1 answer

Using Jquery Ajax to retrieve data from Mysql

Perform a AJAX GET request to get ...READ MORE

answered Jun 23 in Web Development by rajatha
• 7,440 points
1,122 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP