Posting variable to ajax script

Question

I got a function which displays an amount of products depending on a value that is selected in a dropdownlist. This is done with ajax, but for everything to work correctly I need to pass a variable.

On my catalog.php I got:

$pid = $productcatcr[0]['id'];

Which contains the page id.

On the same page I got the dropdownlist:

<select class="form-control showcount" name="showcount" id="showcount">
    <option value="100" selected>Alle</option>
    <option value="2">2</option>
    <option value="4">4</option>
    <option value="8">8</option>
    <option value="12">12</option>
    <option value="16">16</option>
    <option value="20">20</option>
</select>

Which works like this in ajax.js :

$("#showcount").on('change', function() {

    $.post("ajax/getproducts.php", {start: ($("#showcount").val() - 4), end: $("#showcount").val()}, function(result){
        $("#productviewajax").html(result);
    });
});

Finally in getproducts.php I use the following query:

$product = "SELECT * FROM `web_content` WHERE `catid` = ".$conn->real_escape_string($_GET['id'])." AND state = 1 order by ordering LIMIT ".$_POST['end']."";

I need to post id from the initial page, through ajax to the query. What would be the best way to do this? My ajax is not very good.

I got another filter on the initial page on which I can just pass the variable in an url, but the other option element doesn't work like that.

Example:

<option value="highlow" data-post-url="prijshooglaag.php?id='.$pid.'">Prijs: Hoog naar laag</option>

@NanaPartykar Nowhere, That's why I'm asking how to get it posted there. — twan
– twan, Commented Aug 17, 2016 at 8:21

Nana Partykar · Accepted Answer · 2016-08-17 08:30:08Z

Create one hidden input with class name as pageId (not mandatory with same class name, but if you are changing class name here. Change in Ajax code id:$(".pageId").val() here too. Both are related.)

catalog.php

<?php

$pid = $productcatcr[0]['id'];
?>

<input type='hidden' value='<?php echo $pid;?>' class='pageId'>

<select class="form-control showcount" name="showcount" id="showcount">
  <option value="100" selected>Alle</option>
  <option value="2">2</option>
  <option value="4">4</option>
  <option value="8">8</option>
  <option value="12">12</option>
  <option value="16">16</option>
  <option value="20">20</option>
</select>

Use pageId to get current page id. And, pass it to getproducts.php page.

Ajax

$("#showcount").on('change', function() {
    $.post("ajax/getproducts.php", {start: ($("#showcount").val() - 4), end: $("#showcount").val(),id:$(".pageId").val()}, function(result){
        $("#productviewajax").html(result);
    });
});

getproducts.php

Instead of $_GET['id'] use $_POST['id'] as $.post being used in AJAX.

$product = "SELECT * FROM `web_content` WHERE `catid` = ".$conn->real_escape_string($_POST['id'])." AND state = 1 order by ordering LIMIT ".$_POST['end']."";

A hidden input inside the select element? Will it automatically get posted if I select a value?
Not inside select. Use before that select dropdown. @twan. Some where in that page either below select dropdown or above.
@twan: see my updated answer. Don't miss a single thing here. You will succeed.

Collectives™ on Stack Overflow

Posting variable to ajax script

1 Answer 1

3 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Related