Databases
StackOverflow2013
Postsdbo
POjquery AJAX requests not updating php variable
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjquery AJAX requests not updating php variable
    text
    copied!<p>I have a comics website, <a href="http://HittingTreesWithSticks.com" rel="nofollow">Hitting Trees with Sticks</a>, that allows a user to get next, previous, or random comic id by pressing next or simply pressing arrow keys.</p> <p>Since images are stored in a database, the only way for me cycle through these images on the client side was to store them in a javascript array, and store the php $imgid in a javascript variable as imgIndex. Then I could alter that index on the client side when they press keyboard keys.</p> <p>When the user presses a key, I'm using pushstate to alter the imgid in the URL, but that's not actually updating the server side $imgid. I need to update the server side $imgid because I'm associating a liking function with each specific ID... but currently, the total likes associated with an img ID won't refresh/update when I press a key to get a new image.</p> <p>My solution was to not only use the PushState to update the URL, but when a key is pressed, I use a $.post, and send the updated imgIndex to the php script.</p> <p><strong>Here are snippets:</strong></p> <p><strong>KeyInput.php</strong>: This is the client-side javascript:</p> <pre><code>&lt;script type="text/javascript"&gt; var imgArray = [&lt;?php echo implode(',', getImages($site)) ?&gt;]; var imgIndex = &lt;?php echo $imgid ?&gt;; $(document).ready(function() { var img = document.getElementById("showimg"); img.src = imgArray[&lt;?php echo $imgid ?&gt;]; $(document).keydown(function (e) { var key = e.which; var rightarrow = 39; var leftarrow = 37; var random = 82; if (key == rightarrow) { imgIndex++; if (imgIndex &gt; imgArray.length-1) { imgIndex = 0; } img.src = imgArray[imgIndex]; window.history.pushState(null, null, '.?action=viewimage&amp;site=comics&amp;id=' + imgIndex); $.post('./templates/viewimage.php', { _newImgId : imgIndex }, function(data) { //alert(data); } ); } </code></pre> <p><strong>viewimage.php</strong> This is the file that originally gets the $imgid, then it calls the keyInput.php script to accept key input... that alters the javascript imgid. For testing purposes, I've tried using $.post and $.get AJAX to send the updated imgid, as you can see below, that's <code>$newID = $_POST['_newImgId];</code>. When I echo out $newID, it says it's not defined.</p> <pre><code>&lt;?php /* Controls display of comic on the viewComic template */ include 'include/header.php'; global $site, $imgid; $cat = (isset($_GET['cat']) ? ($_GET['cat']) : null); $site = (isset($_GET['site']) ? ($_GET['site']) : null); $title = (isset($_GET['title']) ? ($_GET['title']) : null); $imgid = $_GET['id']; include './scripts/keyinput.php'; $newID = $_POST['_newImgId]; echo $newID; //THIS SHOULD ECHO THE UPDATED ID, but it says it is not defined </code></pre> <p>Any thoughts?</p> <p>Thanks!</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload