Chained List Boxes with Multi Tables

Codes here !

Moderators: macek, egami, gesf

DS928
New php-forum User
New php-forum User
Posts: 2
Joined: Wed Jan 09, 2013 4:44 pm

Chained List Boxes with Multi Tables

Postby DS928 » Wed Jan 09, 2013 4:53 pm

Hello, I ve been scoring the web for chained listboxes. At this point I've found only listboxes with one table or no tables. I have three listboxes. The first is based on one table, tblRestaurants. The second listbox is based on two tables tblLocations and tblCities. They are joined by the field CityID. The third listbox is also based on tblLocations, but is tied to the tblAreas and joined by the AreaID field. What I've created so far populates the first listbox, however; I am having difficulty populating the second and the third. Any help is appreciated. Thank you.

index.PHP

Code: Select all

<?php

try {
   
   $objDb = new PDO('mysql:host=MyHead.db.5513143.DADA.com;dbname=MyHead', 'MyHead', 'PasswordDADA');
   $objDb->exec('SET CHARACTER SET utf8');
   
   $sql = "SELECT *
      FROM `tblRestaurants`
      WHERE `RestStatus` = 'YES'
      ORDER BY 'RestName'";
   $statement = $objDb->query($sql);
   $list = $statement->fetchAll(PDO::FETCH_ASSOC);
   
} catch(PDOException $e) {
   echo 'There was a problem';
}

?>
<!DOCTYPE HTML>
<html lang="en">
<head>
   <meta charset="utf-8" />
   <title>Dependable dropdown menu</title>
   <meta name="description" content="chained list" />
   <meta name="keywords" content="chained list" />
   <link href="/BigStuff/css/core.css" rel="stylesheet" type="text/css" />
   <!--[if lt IE 9]>
   <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
   <![endif]-->
</head>
<body>


<div id="wrapper">
    <div align="center">
      <select name="Place" size="25" id='Place' class="update">
        <option value="">Select one</option>
        <?php if (!empty($list)) { ?>
        <?php foreach($list as $row) { ?>
        <option value="<?php echo $row['RestID']; ?>">
          <?php echo $row['RestName']; ?>
        </option>
        <?php } ?>
        <?php } ?>
      </select>
     
      <select name="City" size = "25" id="City" class="update"
         disabled="disabled">
         <option value="">----</option>
      </select>
      
      <select name="Area" size="25" id="Area" class="update"
         disabled="disabled">
        <option value="">----</option>
      </select>
    </div>
      
   </form>

</div>


<script src="/BigStuff/js/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="/BigStuff/js/core.js" type="text/javascript"></script>
</body>
</html>


core.js

Code: Select all

var formObject = {
   run : function(obj) {
      //if (obj.val() === '') {
         obj.nextAll('.update').html('<option value="">----</option>').attr('disabled', true);
      //} else {
         var id = obj.attr('LocationID');
         var v = obj.val();
         jQuery.getJSON('/BigStuff/mod/update.php', { LocationID : LocationID, value : v }, function(data) {
            if (!data.error) {
               obj.next('.update').html(data.list).removeAttr('disabled');
            } else {
               obj.nextAll('.update').html('<option value="">----</option>').attr('disabled', true);
            }
         });
      //}
   }
};
$(function() {
   
   $('.update').live('change', function() {
      formObject.run($(this));
   });
   
});


update.PHP

Code: Select all

var formObject = {
   run : function(obj) {
      //if (obj.val() === '') {
         obj.nextAll('.update').html('<option value="">----</option>').attr('disabled', true);
      //} else {
         var id = obj.attr('LocationID');
         var v = obj.val();
         jQuery.getJSON('/BigStuff/mod/update.php', { LocationID : LocationID, value : v }, function(data) {
            if (!data.error) {
               obj.next('.update').html(data.list).removeAttr('disabled');
            } else {
               obj.nextAll('.update').html('<option value="">----</option>').attr('disabled', true);
            }
         });
      //}
   }
};
$(function() {
   
   $('.update').live('change', function() {
      formObject.run($(this));
   });
   
});

Return to “mySQL & php coding”

Who is online

Users browsing this forum: Bing [Bot] and 1 guest