yolo
yolo

Reputation: 41

how to get two values to get result in php and ajax

I'm trying to get two values from a form in php which is weight and gender using jquery and ajax to show the price that corresponds to that gender and weight,

the mysql table looks like this

gender range1  range2  price
male     0       100     20
male    101      200     30
female   0       100     25
female  101      199     46

the php form looks like this

  <input type="text" name="gender" id="gender">
  <input type="number" name="weight">
 price <span id="result"></span>
<input type="button" herf="javascript:;" onclick="getprice" value="">

the ajax function looks like this

    function getprice (gender, whieght) {
        var str_num {
        "gender" : gender,
        "weight" : weight
       };
             $.ajax({ data: str_num, 
        url: 'selectprice.php',
        type: 'post'
        beforeSend: function() {
     $("#result").html("in progress..");},
           succes: function (reponse){
         $("result").html(reponse);
                  })}}

the selectprice.php looks like this

 $gender = $_GET["gender"];
  $weight = $_GET["weight"];
   $fetch = "SELECT * FROM table where gender like $gender and weight 
  >range1 and <range2"; 
$result = mysqli_query($con, $fetch) or die("Ocurrio un error en la 
  consulta SQL");
while ($row = $resul->fetch_assoc()) {
    echo "".$row["price"]."";
    }
   echo $result;

when I click the button nothing happens, I could really use some help, thanks in an advance

Upvotes: 0

Views: 56

Answers (3)

Akash
Akash

Reputation: 59

You are mixing "POST" and "GET" here.

If you want to use "GET" then follow Naveed's suggestion

If you want to use "POST" then find the two possible solutions below:

1) Easy one: Include your variables directly in data

function getprice (gender, weight) {

         $.ajax({ data: "gender" : gender,
    "weight" : weight, 
    url: 'selectprice.php',
    type: 'post'
    beforeSend: function() {
 $("#result").html("in progress..");},
       success: function (reponse){
     $("result").html(reponse);
              })}}

selectprice.php:

replace

 $gender = $_GET["gender"];  $weight = $_GET["weight"];

with

 $gender = $_POST["gender"];  $weight = $_POST["weight"];

2) Slightly complex one: Use stringify

function getprice (gender, weight) {
    var data={
    "gender" : gender,
    "weight" : weight
   };

var str_num = JSON.stringify(data);

         $.ajax({ data: str_num, 
    url: 'selectprice.php',
    type: 'post'
    beforeSend: function() {
 $("#result").html("in progress..");},
       success: function (reponse){
     $("result").html(reponse);
              })}}

selectprice.php:

replace

 $gender = $_GET["gender"];  $weight = $_GET["weight"];

with

$json_data_from_js= json_decode($_POST['data']);
$gender = $json_data_from_js->gender ;
$weight = $json_data_from_js-> weight;

Upvotes: 0

Jason K
Jason K

Reputation: 1381

You really packed the errors in.

<input type="text" name="gender" id="gender">
<input type="number" name="weight" id="weight">
price 
<input type="button" herf="javascript:;" onclick="getprice()" value="">


<script>
$(document).ready(function() {
});
function getprice () {
    var str_num = {
        "gender" : $('#gender').val(),
        "weight" : $('#weight').val()
    };
    $.ajax({ 
        data: str_num, 
        url: 'selectprice.php',
        type: 'post',
        beforeSend: function() {
            $("#result").html("in progress..");
        },
        succes: function (reponse){
            $("result").html(reponse);
        }
    })
};

</script>

PHP file

<?php
    error_reporting(E_ALL);
    ini_set('display_errors', true);
//  ini_set('log_errors', true);

var_dump($_POST); // Your doing a post not a get in the javaacript.

Upvotes: 1

Naveed Ramzan
Naveed Ramzan

Reputation: 3593

You need to update your line:

url: 'selectprice.php?weight='+weight+'&gender='+gender,

Or you can pass data just after url

url: 'selectprice.php',
data: {weight:weight, gender,gender},

Upvotes: 0

Related Questions