CODEWITHSUNDEEP
javascriptphpjqueryhtmlajax
Zain
Zain

Reputation: 1

.append() is not appending PHP Code

Hi I am a beginner in PHP and i am trying to append a simple include php code in a <section>in html using Jquery .append().

PHP Code

<?php
    $cupSize = "
    <br><br>
    <table width=\"100%\" border=\"0\">
        <tr>
        <td>
            <div class=\"mainBox2\" id=\"largeCup\">
                <div class=\"mainSubBox2L\"> 
                    Large
                </div>
            </div>
        </td>

        <td>
            <div class=\"mainBox2\" id=\"smallCup\">
                <div class=\"mainSubBox2S\">
                    Small
                </div>
            </div>
        </td>

        <td>
            <div class=\"mainBox2\" id=\"mixCup\">
                <div class=\"mainSubBox2MP\">
                    Mix
                </div>
            </div>
        </td>
        </tr>
    </table>";

    echo $cupSize;  
?>

Jquery code

$('#misc').click(function(){
    $('.second').append("<?php include 'cupCustomizer.php'; ?> ");
});

However it isn't working and nothing happens. I searched on StackOverflow and there are some answers with Ajax however i have no experience of server side programming. I was only good at CSS, HTML and Jquery. So help me maybe :)

Thank You

Upvotes: 0

Views: 7876

Answers (4)

ThatOneDude
ThatOneDude

Reputation: 1526

You can't add PHP code to HTML displayed in the browser via javascript, as there won't be a PHP interpreter running in your web browser to process it. A PHP Include is not what you want.

You likely want to make an AJAX call to http://yourhost.com/restofurl/cupCustomizer.php from HTML, and append the HTML output of that PHP script instead.

Something like 

$('#misc').click(function()
{
  $.get('cupCustomizer.php', function(data) 
  {
    $('.second').append(data);
  }
  );
});

might work as your function instead.

Upvotes: 2

Michael Wagner
Michael Wagner

Reputation: 1038

Do you have the JQuery-Script in a .js-file? If yes, your PHP-Interpreter doesn't interpret it. You can change this by adding the following to your .htaccess-file:

<FilesMatch "\.(js)$">
AddHandler application/x-httpd-php .js
</FilesMatch>

Upvotes: 0

Alvin Bakker
Alvin Bakker

Reputation: 1526

You will need to make an ajax call to get the output of a php script that is not in the same document. Something like:

$('#misc').click(function(){
        $.ajax({
            url : "cupCustomizer.php",
            type: "POST",
            success: function(data, textStatus, jqXHR) {
                $(".second").append(data);
            },
            error: function (jqXHR, textStatus, errorThrown){
                console.log('OOPS! Something went wrong');
            }
        });
});

Upvotes: 0

Marc B
Marc B

Reputation: 360592

You are attempting to dump raw HTML text into a javascript context.

e.g.. assuming your php include() and whatnot actually work, you're going to be generating a page that looks like

$('.second').append("<br><br> blah blah " quote here " quote there etc....");

and totally kill your JS code block with syntax errors.

You cannot EVER dump arbitrary html text into a JS context and expect it to work.

At BARE MININUM you need to json_encode your text so it at least becomes syntactically valid javascript:

.append(<?php echo json_encode($cupSize); ?>)

which would produce

.append("<br><br> blah blah \" quote here \" quote there ....");

Note how the internal quotes have been escaped.

Upvotes: 1

Related Questions