computermax2328 Posted July 23, 2013 Share Posted July 23, 2013 Hey All, I am relatively new to jQuery and AJAX. Doing pretty fine with basic jQuery functions, but I am having a hard time understanding AJAX. Here is what I am trying to do: I have a PHP generated nav-bar, which works and generates fine, and each link in this nav-bar gets an id number that is provided to them from a database of photo galleries. I store this id number in each link using HTML data-type. When one of these links is clicked, it passes its id number to a jQuery on click function using .data("id"). This number is stored in a variable x. Here is where I am getting messed up. I have an AJAX request that on click asks for a PHP file, get-gallery.php, and this PHP file queries the database to get all of the photos in the photo gallery. Get-gallery.php works fine. I tested it and it echos each photo perfectly. The file paths are wrong right now, but I am not worried about that. I was wondering, how do I get the gallery-get.php to echo where I need it to in the DOM? Take a look below and let me know what you think. Thanks in advance, PHP generated nav bar: <ul id="categories"> <?php $go = "SELECT * FROM `wp_ngg_gallery` ORDER BY `gid` DESC LIMIT 30"; $look = mysqli_query($con, $go); if(!$look) { echo "This does not work " . mysqli_errno(); } while ($find = mysqli_fetch_array($look)) { $name = $find['name']; $gid = $find['gid']; echo "<li><a href='#' data-id='" . $gid . "'>" . $name . "</a></li>"; } ?> </ul> jQuery AJAX request: <script type="text/javascript"> $(document).ready(function() { $("#categories li").on("click", "a", function(){ var x = $(this).data("id"); $.ajax({ url: "php/gallery-get.php", data: {"p": x}, success: function(response){ $(this).html(response).insertAfter("#content"); }; }); }); }); </script> gallery-get.php <?php $id = $_GET['p']; $select = "SELECT * FROM wp_ngg_pictures WHERE `galleryid`=$id"; $query = mysqli_query($con, $select); echo "<ul id='gallery' class='width'>"; while ($row = mysqli_fetch_array($query)) { $file = $row['filename']; $pid = $row['post_id']; $alt = $row['alttext']; echo "<li><img alt='" . $alt . "' src='images/" . $file . "'></li>"; } echo "</ul>"; ?> EDIT: If you can see a database connection in gallery-get.php, refresh the page. That was in there for testing pages on my local machine. Link to comment https://forums.phpfreaks.com/topic/280432-help-with-ajax-getting-php-generated-html/ Share on other sites More sharing options...
Muddy_Funster Posted July 24, 2013 Share Posted July 24, 2013 in the success function of the $.ajax() change $(this). to $('#divID'). Where divID is the id of your desired target div. ( if it's a class rather than an ID the used $('.classID') ) Link to comment https://forums.phpfreaks.com/topic/280432-help-with-ajax-getting-php-generated-html/#findComment-1441945 Share on other sites More sharing options...
computermax2328 Posted July 24, 2013 Author Share Posted July 24, 2013 That was a good point, but not the right answer. I am going to rehash some code and then I will update what I did. Any other ideas, let me know. Link to comment https://forums.phpfreaks.com/topic/280432-help-with-ajax-getting-php-generated-html/#findComment-1442003 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.