/    Sign up×
Community /Pin to ProfileBookmark

2 weeks on… still can’t get it working (image submit)

Copy linkTweet thisAlerts:
Mar 26.2007

Hi, my page randomly generates an image (painting). the user then has the option to rate the painting on a scale of 1 to 10. However i need two things:

  • 1.

    I want to change the radio buttons to images. I currently have 10 radio buttons with a RATE button beside it. When a user clicks a radio button, they then have to click the RATE buttin to submit the vote. I want an image (10 images) there instead and when the user clicks on the image it automatically submits the rating.

  • 2.

    The second thing i need is an image swap on each of the 10 images. The images are stored in a folder called images/rate & the are called 1.GIF (and the rollover image is called 1c.GIF)

    • Here is my current code (with the radio buttons):

    PLEASE PLEASE PLEASE can someone help me achieve the above tasks PLEASE…

    [code=php]<?php
    session_start();
    //rate.php

    // make connection to database
    $dbh = mysql_connect(“localhost”, “root”, “”) or die(mysql_error());
    mysql_select_db(“test”) or die(mysql_error());

    if (array_key_exists(‘id_value’, $_POST))
    {
    //Get value from radio button
    $id_to_rate = ereg_replace(“[^A-Za-z0-9]”, “”, $_POST[‘id_value’]);

    $new_rating = $_REQUEST[‘rating’];

    //Get values of results according to ID
    $query = “SELECT total, average_score, votes FROM accounts where id =’$id_to_rate'”; // select 1 random record from accounts
    $results = mysql_query($query);

    $scoreslist = mysql_fetch_array($results);

    //Retrieve current values from database
    $total = $scoreslist[‘total’];
    $average_score = $scoreslist[‘average_score’];
    $votes = $scoreslist[‘votes’];

    //Calculate new values
    $new_votes = $votes + 1;
    $new_total = $total + $new_rating;
    $new_average= $new_total / $new_votes;
    $new_average= number_format($new_average, 2);

    //session_start();
    $_SESSION[‘previousid’] = $id_to_rate;

    $updatequery = “Update accounts set total = $new_total, average_score = $new_average, votes = $new_votes where id = $id_to_rate”;

    if (!mysql_query($updatequery, $dbh))
    {
    die(‘Error: ‘.mysql_error());
    }

    }

    ?>

    [code=html]<!DOCTYPE HTML PUBLIC ‘-//W3C//DTD HTML 3.2 Final//EN’>
    <html>
    <head>
    <title>Rate Painting</title>
    <meta http-equiv=’Content-Type’ content=’text/html; charset=utf-8′>
    <link rel=stylesheet href=stylesheet.css type=text/css>

    </head>

    <body>

    <div align=center>

    <table width=”760″ border=”0″ cellpadding=”0″ cellspacing=”0″>

    <tr>
    <td width=”145″><a href=”index.php” target=”_self”><img src=”Images/lt.gif” width=”145″ height=”58″ border=”0″></a></td>

    <td width=”145″><a href=”index.php” target=”_self”><img src=”Images/rt.gif” width=”145″ height=”58″ border=”0″></a></td>

    <td align=”right” width=”470″> <table width=465 border=0 cellspacing=0 cellpadding=0 class=”table_header”>
    <tr>
    <td width=2><img src=Images/status_bar_l.gif width=2 height=27></td>
    <td align=right background=Images/status_bar_background.gif><a href=”sign.php” target=”_self” class=”linksHeader”>Sign
    In</a></td>
    <td width=10 align=right background=Images/status_bar_background.gif><img src=Images/arrow.gif width=10 height=27 hspace=5></td>
    <td width=3 align=right><img src=Images/status_bar_background.gif width=3 height=27></td>
    <td width=2><img src=Images/status_bar_r.gif width=2 height=27></td>
    </tr>
    </table></td>

    </tr>
    <tr>
    <td height=”58″><a href=”index.php” target=”_self”><img src=”Images/lb.gif” width=”145″ height=”58″ border=”0″></a></td>

    <td colspan=”2″></td>
    </tr>
    </table>

    <!–section under navigation–>

    <!–<table width=760 border=0 cellspacing=0 cellpadding=0>
    <tr>
    <td height=”12″>&nbsp;</td>
    </tr>
    </table>–>

    [/code]

    <?php

    $sql = “SELECT * FROM accounts ORDER BY RAND() LIMIT 1”; // select 1 random record from accounts
    $result = mysql_query($sql);
    $nrows = mysql_num_rows($result);

    if ($nrows != 0) {
    $list = mysql_fetch_array($result);

    $id_to_rate = $list[‘id’];
    $current_score = $list[‘average_score’];
    $current_votes = $list[‘votes’];

    ?>

    [code=html] <table width=760 border=0 cellspacing=0 cellpadding=0>

    <tr>
    <td width=259 height=”520″ vAlign=top bgcolor=”#FFFFFF”>[/code]

    <?php
    if (isset($_SESSION[‘previousid’]))
    {//print “first”;
    $id = $_SESSION[‘previousid’];
    $sqllastrating = “SELECT average_score, votes FROM accounts where id= $id”; // select 1 random record from accounts
    $previousresult = mysql_query($sqllastrating);
    $previouslist = mysql_fetch_array($previousresult);

    $votedaverage = $previouslist[‘average_score’];
    $votedvotes = $previouslist[‘votes’];

    session_destroy();
    ?>

    [code=html]<table width=”100%” border=”0″ cellspacing=”0″ cellpadding=”0″>
    <tr>
    <td height=”117″ colspan=”2″ class=”rate_top”><table width=”100%” height=”106″ border=”0″ cellpadding=”0″ cellspacing=”0″>
    <tr>
    <td width=”85%”>&nbsp;</td>
    <td width=”15%”>&nbsp;</td>
    </tr>
    <tr>
    <td height=”54″ class=”average”>
    <?php print $votedaverage;?>
    </td>
    <!– average –>
    <td>&nbsp;</td>
    </tr>
    </table></td>
    </tr
    ><tr>
    <td width=”33%” height=”62″ class=”rate_bottom_left”>&nbsp;</td>
    <td width=”67%” height=”62″ class=”rate_bottom_right”><table width=”100%” height=”78″ border=”0″ cellpadding=”0″ cellspacing=”0″>
    <tr>
    <td width=”49%” height=”52″ class=”votes”>
    <?php print $votedvotes;?>
    </td>
    <!– votes –>
    <td width=”51%”>&nbsp;</td>
    </tr>
    <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    </tr>
    </table></td>
    </tr>
    <tr><td colspan=”3″ height=”100″><table width=”100%” border=”0″ cellspacing=”0″ cellpadding=”0″>
    <tr>
    <td width=”54%”><img src=”Images/rate/you_voted.jpg” width=”130″ height=”40″></td>
    <td width=”46%” class=”you_voted”><?php print $new_rating; ?></td>
    </tr>
    </table></td></tr>
    </table>
    <table width=”240″ border=”0″ cellspacing=”0″ cellpadding=”0″ align=”center”>
    <tr>
    <td width=”140″><a href=”rate_colour.php” target=”_self”><img src=”Images/rate/colour.jpg” width=”130″ height=”75″ border=”0″></a></td>
    <td width=”105″>&nbsp;</td>
    </tr>
    <tr>
    <td><a href=”rate_black_and_white.php” target=”_self”><img src=”Images/rate/black_and_white.jpg” width=”130″ height=”75″ border=”0″></a></td>
    <td>&nbsp;</td>
    </tr>
    <tr>
    <td><img src=”Images/rate/both.jpg” width=”130″ height=”75″></td>
    <td><img src=”Images/rate/tick.jpg” width=”100″ height=”70″></td>
    </tr>
    </table>
    [/code]

    <?php
    }
    else{
    ?>

    [code=html]<table width=”100%” border=”0″ cellspacing=”0″ cellpadding=”0″>
    <tr>
    <td height=”145″ colspan=”2″ class=”rate_me”>&nbsp;</td>
    </tr>

    </table>[/code]

    <?php
    }
    ?>

    [code=html]<br></td>
    <td width=501 vAlign=top bgcolor=”#FFFFFF”>

    <table align=center cellpadding=0 cellspacing=0 border=0>
    <form METHOD=”post” NAME=”rating” ACTION=”<?php echo $_SERVER[‘PHP_SELF’];?>”>
    <tr>
    <td>1<input TYPE=”radio” class=“ratebutton” name=”rating” value=”1″ /></td>
    <td>2<input TYPE=”radio” class=“ratebutton” name=”rating” value=”2″ /></td>
    <td>3<input TYPE=”radio” class=“ratebutton” name=”rating” value=”3″ /></td>
    <td>4<input TYPE=”radio” class=“ratebutton” name=”rating” value=”4″ /></td>
    <td>5<input TYPE=”radio” class=“ratebutton” name=”rating” value=”5″ /></td>
    <td>6<input TYPE=”radio” class=“ratebutton” name=”rating” value=”6″ /></td>
    <td>7<input TYPE=”radio” class=“ratebutton” name=”rating” value=”7″ /></td>
    <td>8<input TYPE=”radio” class=“ratebutton” name=”rating” value=”8″ /></td>
    <td>9<input TYPE=”radio” class=“ratebutton” name=”rating” value=”9″ /></td>
    <td>10<input TYPE=”radio” class=“ratebutton” name=”rating” value=”10″ checked=”checked”/>
    <input type=”hidden” name=”id_value” value=”<?php print $id_to_rate;?>”/></td><td><INPUT TYPE=submit VALUE=”Vote”></td>
    </tr>
    </form>
    </table>

    <table width=”498″ border=”0″ cellspacing=”0″ cellpadding=”0″ align=”center”> <!– photo table (top, left, photo, right, bottom) –>

    <tr>
    <td colspan=”3″ align=”center”><img src=”Images/rate/frame_top.jpg”></td>
    </tr>

    <tr>
    <td valign=”top” align=”right” width=”49″ class=”frame_left”> </td>

    <td align=”center” width=”400″”>[/code]

    <?php
    echo “<img src=’/site/uploaded_files/”.basename($list[‘file’]).”‘ alt=”>”; // call image
    //print $list[‘file’];
    }

    mysql_close($dbh);
    ?>

    [code=html]</td>

    <td valign=”top” align=”left” width=”49″ class=”frame_right”> </td>
    </tr>

    <tr>
    <td colspan=”3″ align=”center”><img src=”Images/rate/frame_bottom.jpg”></td>
    </tr>
    </table>

    </table>

    </td>

    </tr>
    <tr>
    <td colspan=”2″ vAlign=top bgcolor=”#FFFFFF”><br> <br></td>

    </tr>
    </table>

    <br>

    <table width=760 border=0 cellspacing=0 cellpadding=0>
    <tr>
    <td height=1 bgcolor=B2B3B3></td>
    </tr>

    <tr>
    <td height=2 bgcolor=0B9BFE></td>
    </tr>
    <tr>
    <td ></td>
    </tr>
    </table>

    </div>

    </body>

    </html>[/code]

    [/code]

    to post a comment
    PHP

    2 Comments(s) ↴

    Copy linkTweet thisAlerts:
    @CrazyMerlinMar 26.2007 — You can have an image on a submit button to make it look like whatever you want.

    You complicate yourself by having multiple images. If these are ratings, then why not just have a single star on each button?

    By doing that you cut down your code a hell of a lot and make the whole rollover thing possible in CSS with one line of code.

    Having separate imgaes means having a style attached to each button and then having a different rollover for it too.

    Lets say you just had a single star called rate.gif. You could simply use this...

    Example -- untested! ::

    HTML:
    <i>
    </i>&lt;input type='submit' name='rating_1' class='rate_image_button' /&gt;
    &lt;input type='submit' name='rating_2' class='rate_image_button' /&gt;
    &lt;input type='submit' name='rating_3' class='rate_image_button' /&gt;
    etc


    CSS:
    <i>
    </i>rate_image_button
    {
    border: 0px;
    background: url(images/rate.gif) no-repeat center center;
    }

    rate_image_button:hover
    {
    border: 0px;
    background: url(images/rate_over.gif) no-repeat center center;
    }


    then in your php page, simply get the number from the submit button.

    If you really must use separate images say so and I will provide you the correct code.

    Just out of curiosity, is your database online or on your local PC. If it is online and has no root password I can find it by simply using google.

    Be secure!
    Copy linkTweet thisAlerts:
    @oo7mlauthorMar 27.2007 — Hey, thanks so much for your help, i am really stuck on this at the moment. My database is on my local pc, thanks for pointing that out though. By the way, i need to use multiple images (10 to be precise). I probably need to use 10 seperate css classes, thats no problem, thanks but can you show me what code i need anyway. Also, from the code you have above, how does the form know what rate (number) is being submitted. Thanks again for your help, looking forward and eagerly awaiting on your reply, [COLOR="RoyalBlue"]thanks[/COLOR]
    ×

    Success!

    Help @oo7ml spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 — BETA 5.3,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @Yussuf4331,
    tipped: article
    amount: 1000 SATS,

    tipper: @darkwebsites540,
    tipped: article
    amount: 10 SATS,

    tipper: @Samric24,
    tipped: article
    amount: 1000 SATS,
    )...