Wednesday 21 August 2013

How do I change inner HTML of a DIV to the output of a PHP file using jQuery

How do I change inner HTML of a DIV to the output of a PHP file using jQuery

I am learning PHP and jQuery. I have a PHP file called renderPicture.php
that returns a dynamically created image in an HTML IMG tag. I want to
change that image after a click event on my webpage -- without reloading
the page. I know that I need a jQuery Ajax call to renderPicture. And I
know that I need to set the inner HTML of my div to the result of that
jQuery Ajax call. I learned how to set inner HTML here How to replace
innerHTML of a div using jQuery? But I am not quite sure how to do this
with the AJAX call.
How to I set the inner HTML of a DIV to the output of a PHP file using
jQuery?
Here is the jQuery and some of the HTML:
<script>
$(document).ready(function(){
$("#myDIV").click(function(){
//var resultOfAjaxCall = $.ajax({ url: './renderPicture.php',});
$("#myDIV").html(resultOfAjaxCall); //This is roughly what I want
to do
});
});
</script>
</head>
<div id='myDIV'>
<?php
$cryptinstall="./renderPicture.php";
include $cryptinstall;
?>
</div>
</html>
Here is renderpicture.php
<?php
$cryptinstall="./cryptographp.fct.php";
include $cryptinstall;
if(session_id() == "") session_start();
$_SESSION['cryptdir']= dirname($cryptinstall);
$cfg=0;
echo "<img id='cryptogram'
src='".$_SESSION['cryptdir']."/cryptographp.php?cfg=".$cfg."&".SID."'>";
ren
?>

No comments:

Post a Comment