Combining jQuery Ajax Code Not Working

I am trying to amalgamate two ajax functions that use jQuery. Both work perfectly on their own, but I'm having a hell of a time combining the two, and I'm pretty green when it comes to Ajax. I can't figure out what's wrong. I know this is asking a lot of someone, but I don't know what else to do. I would be extremely grateful for any help, and perhaps an explanation of what I would need to do if I wanted to add more functionality to this code so I don't have to keep bothering you all. It's an image gallery. The two halves are a combo box to select how many images show per page, and the other is pagination to navigate the pages. I have a feeling it has something to do with the jQuery Ajax `data: {page:page, imgs: value}` but that might just be part of the problem. **The HTML:**
**The JavaScript (jQuery):** function loading_show(){ $('#loading').html("").fadeIn('fast'); } function loading_hide(){ $('#loading').fadeOut('fast'); } function gallery_show(){ $('#gallery_container').fadeIn('slow'); } function gallery_hide(){ $('#gallery_container').fadeOut(10); } function loadData(page){ loading_show(); gallery_hide(); $.ajax ({ type: "GET", url: "new_arrivals_data.php", data: {page:page, imgs: value}, success: function(msg) { $("#gallery_container").ajaxComplete(function(event, request, settings) { gallery_show(); loading_hide(); $("#gallery_container").html(msg); }); } }); } loadData(1); // For first time page load default results $('#gallery_container .pagination li.active').live('click',function(){ var page = $(this).attr('p'); loadData(page); }); $('#go_btn').live('click',function(){ var page = parseInt($('.goto').val()); var no_of_pages = parseInt($('.total').attr('a')); if(page != 0 && page <= no_of_pages){ loadData(page); }else{ alert('Enter a PAGE between 1 and '+no_of_pages); $('.goto').val("").focus(); return false; } }); //Bind the onChange event to Fetch images on combox selection $("#imgNum").change(function(){ //The combo box var sel = $(this); //Selected value var value = sel.val(); loadData(page); }) //You should store the current selected option in a cookie //For the sake of the example i'll set the default permanently to 12 var imgNum_selected = 12; //set the initial selected option and trigger the event $("#imgNum [value='"+imgNum_selected+"']") .prop("selected","selected") .change(); **The PHP:** 0){ $per_page = (int) $_GET['imgs']; } else { $per_page = 12; } $previous_btn = true; $next_btn = true; $first_btn = true; $last_btn = true; $start = $page * $per_page; include"db.php"; $query_pag_data = "SELECT `imgURL`,`imgTitle` FROM `images` ". "ORDER BY `imgDate` DESC LIMIT $start, $per_page"; $result_pag_data = mysql_query($query_pag_data) or die('MySql Error' . mysql_error()); echo ""; /* --------------------------------------------- */ $query_pag_num = "SELECT COUNT(*) AS count FROM images"; $result_pag_num = mysql_query($query_pag_num); $row = mysql_fetch_array($result_pag_num); $count = $row['count']; $no_of_paginations = ceil($count / $per_page); /* ---------------Calculating the starting and endign values for the loop----------------------------------- */ if ($cur_page >= 7) { $start_loop = $cur_page - 3; if ($no_of_paginations > $cur_page + 3) $end_loop = $cur_page + 3; else if ($cur_page <= $no_of_paginations && $cur_page > $no_of_paginations - 6) { $start_loop = $no_of_paginations - 6; $end_loop = $no_of_paginations; } else { $end_loop = $no_of_paginations; } } else { $start_loop = 1; if ($no_of_paginations > 7) $end_loop = 7; else $end_loop = $no_of_paginations; } /* ----------------------------------------------------------------------------------------------------------- */ $msg .= ""; // Content for pagination echo $msg; } Thank you so much to whomever takes the time to look at this. I know it's a lot, but even if someone tells me what needs to be done, and then I figure out how to do it, I would be extremely grateful. *I would be willing to include the code of each part before I tried to combine them, if that would help. --------------------------------------------------------------------------------------------- ***ORIGINAL SEPERATE CODE:*** Here are both sets of the original code. The goal is to combine them, in other words add code #2 to code #1. **HTML & jQuery #1:**
**PHP #1:** "; while($row = mysql_fetch_assoc($result_pag_data)) { echo "
  • "; } echo ""; /* --------------------------------------------- */ $query_pag_num = "SELECT COUNT(*) AS count FROM images"; $result_pag_num = mysql_query($query_pag_num); $row = mysql_fetch_array($result_pag_num); $count = $row['count']; $no_of_paginations = ceil($count / $per_page); /* ---------------Calculating the starting and endign values for the loop----------------------------------- */ if ($cur_page >= 7) { $start_loop = $cur_page - 3; if ($no_of_paginations > $cur_page + 3) $end_loop = $cur_page + 3; else if ($cur_page <= $no_of_paginations && $cur_page > $no_of_paginations - 6) { $start_loop = $no_of_paginations - 6; $end_loop = $no_of_paginations; } else { $end_loop = $no_of_paginations; } } else { $start_loop = 1; if ($no_of_paginations > 7) $end_loop = 7; else $end_loop = $no_of_paginations; } /* ----------------------------------------------------------------------------------------------------------- */ $msg .= ""; // Content for pagination echo $msg; } **HTML & jQuery #2:**
    **PHP #2:** 0){ $limit = (int) $_GET['imgs']; } else { $limit = 12; } $curPage = 0; if(isset($_GET['page'])){ $curPage = (int) $_GET['page']; } $mysql_link = mysql_connect("localhost", "root", "root"); mysql_select_db("new_arrivals_imgs") or die("Could not select database"); $query = mysql_query("SELECT `imgURL`,`imgTitle` FROM `images` ". "ORDER BY `imgDate` DESC LIMIT " . $limit * $curPage . ", $limit") or die(mysql_error()); if(!$query) { echo "Cannot retrieve information from database."; } else { while($row = mysql_fetch_assoc($query)) { echo "
  • "; } } ?> --------------------------------------------------------------------------------------------- **Thought I should mention:** When I change the `data: {page:page, imgs: value}` back to what it was in code #1: `data: "page="+page` the images show, and the pagination works. Alas, the combo box is not visible. Any thoughts on that?
    Maybe it's just because it's late here in Germany that I don't understand your problem, but what exactyl is not working? HTML not showing up after the GET request is completed? Pagination not working? Which 2 functions are you talking about?

    以上就是Combining jQuery Ajax Code Not Working的详细内容,更多请关注web前端其它相关文章!

    赞(0) 打赏
    未经允许不得转载:web前端首页 » jQuery 答疑

    评论 抢沙发

    • 昵称 (必填)
    • 邮箱 (必填)
    • 网址

    前端开发相关广告投放 更专业 更精准

    联系我们

    觉得文章有用就打赏一下文章作者

    支付宝扫一扫打赏

    微信扫一扫打赏