CODEWITHSUNDEEP
phpjqueryhtmlajax
J. Ano
J. Ano

Reputation: 67

Send information to PHP file using ajax and load this file to a div using .load()?

This is my ajax script:

var cid = $(this).data('cid');
var sendData = { canidtoset: cid };

$.ajax({
    url: '/functions/cv_showinformation.php',
    type: 'post',
    data: sendData,
    dataType: 'json',
    success: function(data) {

        $('#can-viewer .cv--informationtab .infotab--inner')
        .load("/functions/cv_showinformation.php");

    }
});

It gets the value of an attribute called data-cid from an clicked element. This value should be send to an PHP-Script that gets included into a div after the element was clicked. The PHP-Script:

<?php

    if(isset($_POST['canidtoset'])){

        $canid = $_POST['canidtoset'];
        echo $canid;

    } else {

        echo "Something went wrong";

    }

?>

In the end it should show the value from the attribute in the div. But it doesn't even gets included so I believe the data wasn't set. Where the hella is the mistake?

Upvotes: 0

Views: 200

Answers (2)

harsh kumar
harsh kumar

Reputation: 165

If you want to use .load() then we can do like this to avoid errors 

var cid = $(this).data('cid');
var sendData = { canidtoset: cid };

$.ajax({
    url: '/functions/cv_showinformation.php',
    type: 'post',
    data: sendData,
    dataType: 'json',
    success: function(data) {

        $('#can-viewer').load('test.php?canidtoset='+ data);

    }
});



<div id='can-viewer'></div>

/functions/cv_showinformation.php :

if(isset($_REQUEST['canidtoset'])){
        $canid = $_REQUEST['canidtoset'];
        echo $canid;

    } else {
        echo "Something went wrong";

    }

Upvotes: 2

Joel Glovacki
Joel Glovacki

Reputation: 813

dataType: json means the data coming from your server is expected to be json (you're sending plain text).

the second issue is that your .ajax call should be all you need. the .load call is accomplishing the same thing without your passed value.

the easiest solution should be to change your dataType to html

var cid = $(this).data('cid');
var sendData = { canidtoset: cid }

$.ajax({
    url: '/functions/cv_showinformation.php',
    type: 'post',
    data: sendData,
    dataType: 'html',
    success: function(data) {

        $('#can-viewer .cv--informationtab .infotab--inner').html(data);

    }
});

or, you can pass post data to .load as well. just make sure you replace your .ajax call with it instead of nesting it inside the success callback.

$('#can-viewer .cv--informationtab .infotab--inner')
    .load("/functions/cv_showinformation.php", { 
        canidtoset: $(this).data('cid') 
    });

Upvotes: 1

Related Questions