SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Enthusiast
    Join Date
    Oct 2006
    Posts
    78
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Help needed with php + ajax

    I am developing production scheduling application in php for my company. Here is the prototype with little notes:

    http://www.wholesalesignsuperstore.com/jetquote/system/

    WHAT I WANT: to have a table similar to Table 2 on the above link where I want to be able to have this toggle button/link with image, where if you click it once, image switches to another image (Stage 1), you press it again it switches to another image (Stage 2), you press it again it will start all over. Basically, toggle switch with 4 images and 4 corresponding values (SEE TABLE 4). But every time when I change the status of the job (click on the image), it should asynchronously (AJAX) save the stage value in MySQL DB.

    Here is the code of the page: http://www.wholesalesignsuperstore.com/jetquote/system/

    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>System</title>
    
    <script type="text/javascript">
    // this script allows image toggling
    
       var tggle='1';
       var obj;
    
    window.onload=function() {
       obj=document.getElementById('playPause')
    document.getElementById('mylink').onclick=function() {
       toggle();
       return false;
      }
     }
     
    function toggle(){
    if(tggle=='1'){
       obj.src="box_1.gif";
       tggle='2';
     }
    else if(tggle=='2'){
       obj.src="box_2.gif";
       tggle='3';
     }
    else if(tggle=='3'){
       obj.src="box_3.gif";
       tggle='4';
     }
    else {
       obj.src="box_4.gif";
       tggle='1';
     }
    }
    </script>
    
    </head>
    
    <body>
    
    <!-- PHP CODE GOES HERE -->
    
    <br /><br />
    <strong>TABLE 3:</strong> JOB STATUS IMAGES AND VALUES ATTACHED TO STATUSES
    <table cellpadding="2" cellspacing="0" border="1">
    <tr align="center">
    <td><strong>IMAGE</strong></td>
    <td><strong>VALUE</strong></td>
    </tr>
    <tr align="center">
    <td><img src="images/toggle/box_1.gif" alt="1" /></td>
    <td>1</td>
    </tr>
    <tr align="center">
    <td><img src="images/toggle/box_2.gif" alt="2" /></td>
    <td>2</td>
    </tr>
    <tr align="center">
    <td><img src="images/toggle/box_3.gif" alt="3" /></td>
    <td>3</td>
    </tr>
    <tr align="center">
    <td><img src="images/toggle/box_4.gif" alt="4" /></td>
    <td>4</td>
    </tr>
    </table>
    
    <BR />
    <strong>TABLE 4:</strong> TOGGLE IMAGE SCRIPT (keep clicking on the image below)
    <div>
    <a id="mylink" href="index.php"><img id="playPause" src="box_1.gif" alt="" border="0"/></a>
    </div>
    
    
    </body>
    </html>
    PHP Code:
    <?php
    include 'init.inc.php';

    function 
    get_contents() {

        
    //get stuff in the cart and return in indexed array
        
    $q1 "SELECT * FROM system WHERE hidden='0' ORDER BY `jobID` DESC";
        
    $incart_r mysql_query($q1) or die(mysql_error());
        
        
    $contents = array();
            
        while(
    $incart mysql_fetch_array($incart_r)){
                            
            
    //build array of info
            
    $item = array(
            
    $incart['jobID'],
            
    $incart['materials'],
            
    $incart['pattern']);
            
    array_push($contents,$item);
        }

        return 
    $contents ;

    }

    // Begin Table 1 Display /////////////////////////
    echo "<strong>TABLE 1:</strong> Shows the values for statuses of materials and pattern" ;
    $c get_contents();

    $table "
        <!-- Begin Cart Display -->
        <table summary='Your box' id='table' cellspacing='0' cellpadding='2' border='1'>
            <tr>
                <th>job ID</th>
                <th><img src='images/jobs/materials.gif' alt='Materials' title='Materials'/></th>
                <th><img src='images/jobs/pattern.gif' alt='Pattern' title='Pattern'/></th>
            </tr>"
    ;

    if(
    count($c) <= 0){ //nothing in cart

        
    $table .= "
            <tr>
                <td class='items' colspan='3'>Empty</td>
            </tr>"
    ;
                      
    }else{ 
    //stuff in the cart so show it

        
    for($i=0$i count($c); $i++){

        if(
    $i 2) { //this means if there is a remainder
            
    $table .= "<tr bgcolor=\"#CCCCCC\">";
        } else { 
    //if there isn't a remainder we will do the else
            
    $table .= "<tr bgcolor=\"white\">";
        }

            
    $table .= "
        
                <td class='items'>" 
    $c[$i][0] . "</td>
                <td class='items'>" 
    $c[$i][1] . "</td>
                <td class='items'>" 
    $c[$i][2] . "</td>
                
            </tr>"
    ;
        }

    }    

        
    $table .= "
        </table>
        <!-- End Cart Display -->\n\n\n"
    ;
    /////////////////////////////////////////////////                            

    echo $table

    echo 
    "<br>" ;

    // Begin Table 2 Display /////////////////////////
    echo "<strong>TABLE 2:</strong> Shows the images for statuses of materials and pattern. Images should be clickable like in Table 4" ;
    $c get_contents();

    $table "
        <!-- Begin Cart Display -->
        <table summary='Your box' id='table' cellspacing='0' cellpadding='2' border='1'>
            <tr>
                <th>job ID</th>
                <th><img src='images/jobs/materials.gif' alt='Materials' title='Materials'/></th>
                <th><img src='images/jobs/pattern.gif' alt='Pattern' title='Pattern'/></th>
            </tr>"
    ;

    if(
    count($c) <= 0){ //nothing in cart

        
    $table .= "
            <tr>
                <td class='items' colspan='3'>Empty</td>
            </tr>"
    ;
                      
    }else{ 
    //stuff in the cart so show it

        
    for($i=0$i count($c); $i++){

        if(
    $i 2) { //this means if there is a remainder
            
    $table .= "<tr bgcolor=\"#CCCCCC\">";
        } else { 
    //if there isn't a remainder we will do the else
            
    $table .= "<tr bgcolor=\"white\">";
        }

    switch(
    $c[$i][1]){
        
        case 
    "1":
        
    $material "<img src='images/toggle/box_1.gif'>" ;
        break;
        case 
    "2":
        
    $material "<img src='images/toggle/box_2.gif'>" ;
        break;
        case 
    "3":
        
    $material "<img src='images/toggle/box_3.gif'>" ;
        break;
        case 
    "4":
        
    $material "<img src='images/toggle/box_4.gif'>" ;    
        break;

    }

    switch(
    $c[$i][2]){
        
        case 
    "1":
        
    $pattern "<img src='images/toggle/box_1.gif'>" ;
        break;
        case 
    "2":
        
    $pattern "<img src='images/toggle/box_2.gif'>" ;
        break;
        case 
    "3":
        
    $pattern "<img src='images/toggle/box_3.gif'>" ;
        break;
        case 
    "4":
        
    $pattern "<img src='images/toggle/box_4.gif'>" ;    
        break;

    }

            
    $table .= "
        
                <td class='items'>" 
    $c[$i][0] . "</td>
                <td class='items'>" 
    $material "</td>
                <td class='items'>" 
    $pattern "</td>
                
            </tr>"
    ;
        }

    }    

        
    $table .= "
        </table>
        <!-- End Cart Display -->\n\n\n"
    ;
    /////////////////////////////////////////////////                            

    echo $table

    ?>
    Pls HELP WITH AJAX part so I can save it in the DB. Thank you.

  2. #2
    SitePoint Enthusiast
    Join Date
    Nov 2008
    Posts
    89
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have very little experience with ajax programming, but I am sure that somebody here will be able to assist you. Hope you get this straightened out soon.
    --------------------

    Web Hosting Reviews, News and Articles
    www.kubus.net


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
  •