Adding PHP Variables to JQuery's Ajax data

Question

So as you can probably tell, I'm a bit amateur when it comes to jQuery. So if there's any better methods to do what I'm trying to do, please share kindly :) Here's what's happening. Everything works smoothly in the script when you substitute <?php echo $header_id; ?> for a given id that is compatible, say 17. Although $header_id is defined before this script, it must not be really outputting '17'.

I did research before this, not finding anything to help.

So I guess the main question is, does adding a PHP echo really work in this instance, or do I need another method, or is that not even the problem...

$(".vote-button-disabled").click(function (evt) {
$(this).hide().prev("input[disabled]").prop("disabled", false).focus();

var quizid = "";
console.log(quizid);
$.ajax({ 
    url: "scripts/vote-post.php",
    type: "POST",
    data: {
        'quizid' : '<?php echo $header_id; ?>',
        'upvote' : '1', 
    },
    success: function() {
        console.log('yes!');
    },

error: function( xhr, status, errorThrown ) {
alert( "Sorry, there was a problem!" );
console.log( "Error: " + errorThrown );
console.log( "Status: " + status );
console.dir( xhr );
},
complete: function( xhr, status ) {
alert( "The request is complete!" );
}
});

});

Thanks in advanced!

look at the source in browser to see what is there. Also check errors in browser console. If the script isn't being output from within a php page ( is in a separate js file for example) what you have will never work without passing the varibale to a js variable in php — charlietfl
– charlietfl, Commented Oct 22, 2014 at 1:27
@charlietfl When you look at the source code, it gives the literal: 'quizid' : '<?php echo $header_id; ?>', so the PHP isn't doing anything, but why...? — aaronb
– aaronb, Commented Oct 22, 2014 at 1:30
is this code in a separate js file? A js file won't be compiled by php — charlietfl
– charlietfl, Commented Oct 22, 2014 at 1:33
Yes, but I thought if you added script in a php file, it would run like it was inline, or right in the file. Maybe I'm thinking about includes... So this is probably the problem, right? — aaronb
– aaronb, Commented Oct 22, 2014 at 1:35
yes, defintiely the problem. Suggest you add the quizid to a data-quizid attribute on the button instead. Then inside click handler : var quizid = $(this).data('quizid') — charlietfl
– charlietfl, Commented Oct 22, 2014 at 1:37

Travesty3 · Accepted Answer · 2014-10-22 02:18:44Z

Something to understand is that PHP is executed on the server side, and JavaScript is executed on client side.

PHP does not actually have any awareness of what is HTML, what is JavaScript, or what is plain text. It just knows that it's serving back some kind of content (maybe). So when you echo HTML or JavaScript code, you're really just creating a text file as far as PHP is concerned. You're creating a file that contains some text (that happens to be HTML + JS code) and sending that as the response to the HTTP request. Your browser interprets the resulting text in the response (which happens to be HTML + JS code). So one way you can think of PHP is as a HTML + JS generator. You can use PHP to output HTML + JS (and of course much more).

Once you understand that PHP is completely done executing by the time the page is sent back for the browser to interpret the HTML and JavaScript, the answer to what you can and can't do with JavaScript becomes much simpler. PHP is not interacting with JS, it's creating the JS code as text for your browser to read after PHP execution has completed.

So, as @charlietfl mentioned in the comments on the question, you should add the quizid to a data-quizid attribute on the button (assuming you're using HTML5), and then get the attribute for the specific element that was clicked, using var quizid = $(this).data('quizid');

Alejandro Iván · Accepted Answer · 2014-10-22 02:24:16Z

0

If it's an external from PHP .js file, it won't work. You could, however, insert JS directly in the PHP/HTML view document.

<?php
    // Some PHP processing here, whatever you want
?>
<html>
    <head>
        <script type="text/javascript">
            // Your Javascript here, for example:
            var some_data = '<?php echo $some_variable; ?>';
            // ...
        </script>
    </head>
    <!-- Whatever you want to add -->
</html>

answered Oct 22, 2014 at 2:24

Alejandro Iván

4,0611 gold badge23 silver badges31 bronze badges

Collectives™ on Stack Overflow

Adding PHP Variables to JQuery's Ajax data

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related