SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    a fresh, new start... dujmovicv's Avatar
    Join Date
    Aug 2006
    Location
    Earth
    Posts
    559
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    3 step ajax/jquiry select chain

    Hi All,

    I hope this is the right subforum for my 'issue'....

    I get the script for a chained select box using PHP/MySql/AJAX/jQuiry ad have edited it to meet my needs. Everything is fine, but one thing. I believe I'll have to edit some of the JavaScript code which I'm unable to figure out...

    Here's the javascript at the <head> :
    Code:
    	<script type="text/javascript">
    	$(document).ready(function() {
    		$('#wait_1').hide();
    		$('#drop_1').change(function(){
    		  $('#wait_1').show();
    		  $('#result_1').hide();
    		  $.get("ajax/select_chain_3.php", {
    			func: "drop_1",
    			drop_var: $('#drop_1').val()
    		  }, function(response){
    			$('#result_1').fadeOut();
    			setTimeout("finishAjax('result_1', '"+escape(response)+"')", 400);
    		  });
    			return false;
    		});
    	});
    	
    	function finishAjax(id, response) {
    	  $('#wait_1').hide();
    	  $('#'+id).html(unescape(response));
    	  $('#'+id).fadeIn();
    	}
    	function finishAjax_tier_three(id, response) {
    	  $('#wait_2').hide();
    	  $('#'+id).html(unescape(response));
    	  $('#'+id).fadeIn();
    	}
    	</script>
    here's the form at the index.php :
    PHP Code:
    <form action="" method="post">
        <select name="drop_1" id="drop_1">
          <option value="" selected="selected" disabled="disabled">Select a Project</option>
          <?php getTierOne(); ?>
        </select> 
        <span id="wait_1" style="display: none;">
        <img alt="Please Wait" src="images/loading.gif"/>
        </span>
        <span id="result_1" style="display: none;"></span>
        <span id="wait_2" style="display: none;">
        <img alt="Please Wait" src="images/loading.gif"/>
        </span>
        <span id="result_2" style="display: none;"></span> 
        <input type="submit" class="submit_button" value="START" name="submit" />
    </form>
    and here's the ajax/select_chain_3.php :
    PHP Code:
    <?
    //**************************************
    //     Page load dropdown results     //
    //**************************************
    function getTierOne()
    {
        
    $result mysql_query("SELECT * FROM project WHERE status = 1"
        or die(
    mysql_error());
        
    //$result = $database->projectLister("list_all_active", 0, 0, 0, 0, 0);

          
    while($tier mysql_fetch_array$result )) 
      
            {
               echo 
    '<option value="'.$tier['nr'].'">'.$tier['nr'].'</option>';
            }

    }

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

    function 
    drop_1($drop_var)
    {  
        
    //include_once('../include/connect_to_db.php');
        //$result = mysql_query("SELECT * FROM project WHERE nr = '$drop_var'") 
        //or die(mysql_error());
        //$result = $database->projectLister("this_project", $drop_var, 0, 0, 0, 0);
        
        
    echo '<br /><br />
                <select name="drop_2" id="drop_2">
                    <option value="" selected="selected" disabled="disabled">Change what?</option>
                    <option value="change_task">Change Task</option>
                    <option value="remove_task">Remove Task</option>
                    <option value="add_task">Add Task</option>
                </select><br />'
    ;
        
        echo 
    "<script type=\"text/javascript\">
    $('#wait_2').hide();
        $('#drop_2').change(function(){
          $('#wait_2').show();
          $('#result_2').hide();
          $.get(\"ajax/select_chain_3.php\", {
            func: \"drop_2\",
            drop_var: $('#drop_2').val()
          }, function(response){
            $('#result_2').fadeOut();
            setTimeout(\"finishAjax_tier_three('result_2', '\"+escape(response)+\"')\", 400);
          });
            return false;
        });
    </script>"
    ;
    }


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

    function 
    drop_2($drop_var)
    {      
        include_once(
    '../include/connect_to_db.php');

        switch (
    $drop_var) {
            case 
    "change_task":
            break;
            
            case 
    "remove_task":
                
    $result mysql_query("SELECT * FROM tasks WHERE project_id = '$project_id'") or die(mysql_error());
                
    ?>
                    <select name="drop_3" id="drop_3">
                    <?
                    
    while ($tasks_row mysql_fetch_array($result)) {
                        echo 
    "<option value='".$tasks_row['id']."'>".$tasks_row['task_name']."</option>";
                    }
                    
    ?>
                    </select>
                <?
            
    break;
            
            case 
    "add_task":
            break;
        } 
    // end switch drop_var
    }
    ?>
    I'd like to pass the variable $project_id to the function drop_2 (Second selection results). This variable is passed to the function drop_1 as $drop_var
    I don't have the JS knowledge to do that, I'm even unsure if that's possible at all. Any help/suggestion will be highly appreciated!!!!

    Full time ADMIN - art community
    Part time coder - dsign

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,684
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by dujmovicv View Post
    I'd like to pass the variable $project_id to the function drop_2 (Second selection results). This variable is passed to the function drop_1 as $drop_var
    All of those parts seem to be in the PHP code - moving thread to the PHP forum.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Wizard silver trophybronze trophy Cups's Avatar
    Join Date
    Oct 2006
    Location
    France, deep rural.
    Posts
    6,869
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    If the function drop_2 needs access to a site-wide variable called $project_id then you declare it as a global var which that function can then access from outside its own namespace.

    But I cannot see where you set $project_id so I suppose I could be well wrong, as maybe you are half way through this.


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
  •