SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Addict
    Join Date
    Dec 2005
    Posts
    377
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question function does not work on body load?

    I have a js function which is set up to pull values into a <select> when another <select> is changed.
    Can anyone tell me how I can also get this to work when the page is initially loaded aswell please?

    This is the js code:
    Code:
    $(document).ready(function() {
    	$('#drop_1').change(function(){
          $.get("func.php", {
    		func: "drop_1",
    		drop_var: $('#drop_1').val()
          }, function(response){
            setTimeout("finishAjax('result_1', '"+escape(response)+"')", 400);
          });
        	return false;
    	});
    });
    
    function finishAjax(id, response) {
      $('#MyHolder').html(unescape(response));
    }
    This is the code in the func.php file:

    PHP Code:
    function getTierOne()
    {
        
    $result mysql_query("SELECT DISTINCT Make FROM table"
        or die(
    mysql_error());

          while(
    $tier mysql_fetch_array$result )) 
      
            {
                if(
    $tier['Make'] == $_REQUEST['make']) { $mine 'selected="selected"';}    
                  if(
    $tier['Make'] != $_REQUEST['make']) { $mine '';}        
               echo 
    '<option value="'.$tier['Make'].'" '.$mine.'>'.$tier['Make'].'</option>';
            }

    }

    //**************************************
    //     First selection results     //
    //**************************************
    if($_GET['func'] == "drop_1" && isset($_GET['func'])) { 
       
    drop_1($_GET['drop_var']); 
    }

    function 
    drop_1($drop_var)
    {  
        include_once(
    'db.php');
        
        
    $result mysql_query("SELECT DISTINCT Model FROM Used_Stock WHERE Type='4' AND Make='$drop_var' ORDER BY Model ASC"
        or die(
    mysql_error());
        
        echo 
    '<select name="model" id="model" class="selection" onchange="showTotalArticles()">
              <option value="" selected="selected">All Models</option>'
    ;

               while(
    $drop_2 mysql_fetch_array$result )) 
                {
                  echo 
    '<option value="'.$drop_2['Model'].'">'.$drop_2['Model'].'</option>';
                }
        
        echo 
    '</select> ';
        
    //echo '<input type="submit" name="submit" value="Submit" />';


  2. #2
    SitePoint Zealot
    Join Date
    Jun 2011
    Location
    Kolding, Denmark
    Posts
    108
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Something like this should work
    Code:
    $(document).ready(function() {
    	$('#drop_1').change(loadSelectItems);
            loadSelectItems();
    });
    
    function finishAjax(id, response) {
      $('#MyHolder').html(unescape(response));
    }
    
    function loadSelectItems() {
          $.get("func.php", {
    		func: "drop_1",
    		drop_var: $('#drop_1').val()
          }, function(response){
            setTimeout("finishAjax('result_1', '"+escape(response)+"')", 400);
          });
        	return false;
    }

  3. #3
    Under Construction silver trophybronze trophy AussieJohn's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    776
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    If you want to immediately populate the 2nd dropdown on page load with initial values, it's quite simple, we just need to trigger this "change" event handler that you've just added.

    Code:
    $(document).ready(function() { 
        $('#drop_1').change(function(){
            $.get(
                "func.php",
                {
                    func: "drop_1",
                    drop_var: $('#drop_1').val()
                },
                function(response){
                    setTimeout("finishAjax('result_1', '"+escape(response)+"')", 400);
                }
            );
            return false;
        }).trigger("change"); //trigger the change event that you just created
    });
    var details = {
    . . web: "afterlight.com.au",
    . . photos: "jvdl.id.au",
    . . psa: "usethelatestversion.com"
    }


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •