passing radio value to php file using jquery and then insert to database

Question

I am beginner in jquery "actually its my first code". i am working on stars rating system, the jquery part worked perfectly and it returns the value of rate. But when it comes to php code it did! i want to pass (rate variable) from (index.php) to (rate.php) file in order to insert it into (rate) table. please help me

Index.php:

<!DOCTYPE html class="ng-scope" ng-app="">
<head>
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="js/ca-pub-2074772727795809.js" type="text/javascript" async=""></script>
    <script src="js/analytics.js" async=""></script>
</head>
<body>

    <h1>please Rate:</h1>
    <script>
       $(function(){
            $(".stars").on("click", function(){
                    var rate = $(this).val();  
                    alert(rate);
                    });
                });
    </script>

    <fieldset id='starset' class="rating" name="star">
        <input class="stars" type="radio" id="star5" name="rating" value="5" />
        <label class = "full" for="star5" title="Awesome - 5 stars"></label>
        <input class="stars" type="radio" id="star4" name="rating" value="4" />
        <label class = "full" for="star4" title="Pretty good - 4 stars"></label>
        <input class="stars" type="radio" id="star3" name="rating" value="3" />
        <label class = "full" for="star3" title="Meh - 3 stars"></label>
        <input class="stars" type="radio" id="star2" name="rating" value="2" />
        <label class = "full" for="star2" title="Kinda bad - 2 stars"></label>
        <input class="stars" type="radio" id="star1" name="rating" value="1" />
        <label class = "full" for="star1" title="Sucks big time - 1 star"></label>
    </fieldset>
</body>

rate.php:

<?php
$connect=mysql_connect("localhost","root","");
$db=mysql_select_db("HWP",$connect);

$rate=$_POST['val']
if (isset($rate) && !empty($rate)) 
    {
        $query1 = mysql_query("select rate_id FROM rate WHERE Rate_cust_id= 1");
        $f1 = mysql_num_rows($query1);
        if (mysql_num_rows($query1) > 0) 
        {
            echo $f1['rate_id'];
        }

         else 
        {
            $query2= mysql_query("insert into rate ( rate_value, rate_cust_id , rate_hw_id) VALUES ($rate, 4 , 2); ");
            if ($query2) {
                echo "0";
            }
        }
    }
?>

I found method called $.Post() but i couldn't know where to use it. — Rayan Osman
– Rayan Osman, Commented Apr 1, 2016 at 18:59
Welcome to stackoverflow. Couple of pointers, your code (one which you have added doesn't show) you posting data to your server, without the associated HTML, $('.stars').on('click') doesn't make much sense. So please add your relevant HTML. Edit: Research on $.ajax(). On click you have to send your value to your server so you have to put $.post() or $.ajax() inside your on('click') block. — Anubhab
– Anubhab, Commented Apr 1, 2016 at 19:04

score 1 · Accepted Answer · 2016-04-01 19:09:52Z

1

You need to use AJAX with JQuery to be able to send your value:

<script>
$(function() {
    $(".stars").on("click", function() {
        var rate = $(this).val();
        $.post("rate.php", {
           val: rate
        },
        function(data, status) {
            // here you can get the data sent from PHP with data variable & the status of the request with status variable
            //alert("Data: " + data + "\nStatus: " + status);
        });
    });
});
</script>

Also, please note using PDO or mysqli for your requests. mysql is deprecated and can be vulnerable about SQL injections.
If you want to still on mysql and to don't use mysqli or PDO, you can use this mysql function to escape strings from the user to prevent SQL injection:

$secure = mysql_real_escape_string($_POST['val']);

Finally, please note that $cus_id variable isn't defined in your code, it should cause errors.

Remember: NEVER trust the user

Source (if needed) : http://www.w3schools.com/jquery/jquery_ajax_get_post.asp

PS: Ajax is a technique for sending $_GET or $_POST requests to a page

You can use $.get for your get requests and $.post for your post requests

edited Apr 1, 2016 at 19:09

answered Apr 1, 2016 at 19:02

user5672329

Sign up to request clarification or add additional context in comments.

1 Comment

Rayan Osman Over a year ago

Thanks for replay. actually index.php didn't get data, it send data to rate.php. And still not working.

Eihwaz · Accepted Answer · 2016-04-01 20:54:15Z

0

<script>
    $(function(){
        $(".stars").on("click", function(){
            var rate = $(this).val();  

            $.post('rate.php', {val: rate}, function(data){...})
        });
    });
</script>

Also mind the injection risk, escape and validate everything that comes from user, absolutely everything.

edited Apr 1, 2016 at 20:54

answered Apr 1, 2016 at 19:02

Eihwaz

1,23410 silver badges14 bronze badges

Collectives™ on Stack Overflow

passing radio value to php file using jquery and then insert to database

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related