1internet

$('.cart_item').hover(function(){ $('.remove_cart_item').fadeToggle(); }); So the issue is that when I hover over the div class cart_item, all the divs with class cart_item show the hidden div class remove_cart_item. How do I get it to just show for the div its hovering over?

Naa, didn't do it.

I have been trying to create a rollover effect that enlarges a div in the results page. Identical to the old google image results, when you rollover an image it would enlarge. I am currently doing this through jquery animate $('.product_result').hover(function(){ $(this).css('position', 'relative') $(this).animate({ 'width': '220px', 'height': '286px', 'margin-left': '-6px', 'margin-top': '-6px' }, 'fast'); },function(){ $(this).animate({ 'width': '200px', 'height': '260px', 'margin-left': '6px', 'margin-top': '6px' }, 'fast'); }); The problem is with this code is that it distorts the position of all other elements I want it to do the equivalent effect of being position absolute, when the height and width are increased, as to not affect layouts.

denno020, can you do that again but with selecting the anchors?

Still nothing works!! This is driving me crazy.

Doesn't work either. #product_tabs ul li a:last-child { didnt work either, as it selected them all.

That selects the ul, but was a good theory.

I want to select the last child (li), but it doesn't select. It must be the last, i.e. not the 5th, becuase the list quantity changes. HTML: <div id="product_info"> <h1>Hobo Indoor Data Loggers</h1> <div id="product_tabs"> <ul> <li><a href="#description">Description</a></li> <li><a href="#features">Features</a></li> <li><a href="#specifications">Specifications</a></li> <li><a href="#technical">Technical</a></li> <li><a href="#recommendations">Recommendations</a></li> <span style="clear:both;"></span> </ul> </div> </div> CSS: #product_tabs ul { background: #3463a0; border-radius: 5px; padding: 0px 5px; border: solid; } #product_tabs li { float: left; } #product_tabs li a { background: #3463a0; color: #f6f6f6; padding: 10px 20px; font-weight: bold; } #product_tabs li a:last-child { border-radius: 5px; } Any idea why it won't just select the #recommendations li, instead it selects all of them.

What I am trying to do is just provide a report showing the most popularly sold products. I am trying to create a sql result that will show the `product name`, along with the `quantity` of that product sold, and order it by quantity. So essentially I want to count how many of each product id is in the result, and maybe create this count as an alias to go with the product id. From there I display the product name (associated with the id) with the quantity. The table has these fields: orders_products_id - the id of the row products_id - the id of the product, this is what we want to count products_name - the name of the product, this is what we want to display in the results and to add extra confusion there is also a quantity column orders_products_id | products_id | products_name | quantity 1 | 7 | apple | 1 2 | 4 | orange | 3 3 | 11 | grapes | 6 4 | 7 | apple | 3 5 | 4 | orange | 1 6 | 7 | apple | 1 7 | 17 | pear | 2 So the outcome I would be seeking from this would be grapes 6 apple 5 orange 4 pear 2 So I just need to know what the sql query would be.

Please show the code.

Oh, thanks so much Jessica.

No, not necessarily, I am not entirely sure what the difference is when you using ajax anyway. I am guessing that in this case GET probably is better, as it will be fine to cache the results in the browser, and I am passing very little data through. So I have changed it to GET, and it still works. The strangest thing is that when the ajax pulls the pagination, then the jquery stops working. Is it not possible for the script to read from the DOM when its inserted through ajax?

Thanks Jessica So what would code look like? Can it just us easily be passed through POST? For <div id="pagination"><a href="categories.php?filterCat=72&page=3">3</a></div> I have this $("#pagination a").click(function(event){ event.preventDefault() var url = $(this).attr('href'); var pos = url.indexOf("?"); var data = url.substring(pos + 1); $.ajax({ beforeSend: startRequest, url: "./public/js/ajax-category.php", data: data, type: "POST", dataType: "html" }).done(function(result, status){ $("#pages_results").html(result); }); }); for the jquery script and if(isset($_POST['filterCat'])) { $filterCat = $_POST['filterCat']; if($filterCat != 'allCats') $filterCat = (int)$_POST['filterCat']; } else { $filterCat = 'allCats'; } if(isset($_POST["page"])) $current_pagination = (int)$_POST["page"]; to obtain the variables in the ajax script. This works, but you are saying this is not the right way?

Oh, I think I get it, so we grab the href attribute then $("#pagination a").click(function(){ var data = $(this).attr('href'); $.ajax({ url: "ajax-category.php", data: data, type: "POST", dataType: "html" }).done(function(result, status){ $("#pages_results").html(result); }); return false; }); And the ajax page will pick up the variables. Is it fine to use POST?

If it helps, this is for ajax pagination. So I have pagination links eg. <a class="pagination" href="categories.php?filterCat=2&page=3">3</a> So there is a sql query that shows results, in this case they are fileted by category=2, and page=3. So I want to send these variables through ajax. $(".pagination").click(function(){ var filter = var page = AJAX CODE IN HERE, passing through the variables }); 1. I don't know how to get the variables out of the href 2. How do I de-activate the hyperlink, so that on click it will not go to that page, and instead it will just run the ajax code? Oh and if I am doing this an unnecessarily difficult way, then please let me know.

So I am displaying a list of results, 30 per page, and I have filters. When a filter is selected the page results update, and so does the pagination. My issue is how do I run the ajax when someone clicks on the pagination? What should the pagination links be? What should the jquery script be? I am guessing it would be a click event, and then it would take the page number clicked on, and enter that into the ajax results, but it would also have to get the current filter values too. I am finding this quite complicated, if anyone can put me a step in the right direction that would be great.

If its within a CMS does it really need to be sanitized anyway?

But striptags would remove the html, I want to keep the html intact. I want something exactly like THIS form here.

So if you submit a form, that contains an htmleditor, but you want to sanitize the code, how is this done? Obviously htmlentities will render any html in the editor unusable.

Oh wait for SELECT m.`cat_id`, m.`name`, s.`cat_id`, s.`name` FROM cats AS m LEFT JOIN cats AS s ON s.`parent_id` = m.`cat_id` Does this need to be in a loop, so it obtains all child levels?

Ha, no no, not at all. I just don't really have the time to get my head around it, I understand the join if there was just a category and sub-category, but when you could have multiple child levels, I don't understand how to do the join there.

@lemmin - thanks, thats exactly what I was thinking. @Christian F. - yes, thats ideally where I would like to get it, but its a little bit too complex for me yet.

I have a select box that filters categories. However, there are also sub-categories, and sub-sub-categories, etc. <form method="GET" action="categories.php"> <div class="form"> <select id="filter" size="1" name="filterCat"> <option value="allCats" <?php if ($filterCat == 'allCats') echo 'selected="selected"';?>>All Categories</option> <option value="0" <?php if ($filterCat == 0) echo 'selected="selected"';?>>MAIN</option> <option value="noItem" disabled="disabled" >-------------------------------</option> <?php $cat_result = mysql_query("SELECT `categories_id`,`categories_name` FROM `categories` WHERE `parent_id`=0 ORDER BY `categories_name`"); while($cat_row = mysql_fetch_assoc($cat_result)){ $categories_id = $cat_row['categories_id'] ?> <option value="<?php echo $categories_id; ?>" <?php if ($filterCat == $categories_id) echo 'selected="selected"';?>> <?php echo $cat_row['categories_name']; ?></option> <?php $cat_result2 = mysql_query("SELECT `categories_id`,`categories_name` FROM `categories` WHERE `parent_id`=$categories_id ORDER BY `categories_name`"); while($cat_row2 = mysql_fetch_assoc($cat_result2)){ $categories_id2 = $cat_row2['categories_id'] ?> <option value="<?php echo $categories_id2; ?>" <?php if ($filterCat == $categories_id2) echo 'selected="selected"';?>> - <?php echo $cat_row2['categories_name']; ?></option> <?php $cat_result3 = mysql_query("SELECT `categories_id`,`categories_name` FROM `categories` WHERE `parent_id`=$categories_id2 ORDER BY `categories_name`"); while($cat_row3 = mysql_fetch_assoc($cat_result3)){ $categories_id3 = $cat_row3['categories_id'] ?> <option value="<?php echo $categories_id3; ?>" <?php if ($filterCat == $categories_id3) echo 'selected="selected"';?>> -- <?php echo $cat_row3['categories_name']; ?></option> <?php $cat_result3 = mysql_query("SELECT `categories_id`,`categories_name` FROM `categories` WHERE `parent_id`=$categories_id3 ORDER BY `categories_name`"); while($cat_row4 = mysql_fetch_assoc($cat_row4)){ $categories_id4 = $cat_row4['categories_id'] ?> <option value="<?php echo $categories_id4; ?>" <?php if ($filterCat == $categories_id4) echo 'selected="selected"';?>> -- <?php echo $cat_row4['categories_name']; ?></option> <?php }}}} ?> </select> </div> </form> So my issue is that I repeat the code for each new sub-category, and create a new loop to look up the sub-categories belonging to that one. Is there a simpler way that will cause the categories to look up if they have any sub-categories, and then run a loop from there, i.e. infinitely, so that if there were even 10 levels of categories, it would still be able to find them all?

I tried that, no luck. It's a div, doesn't blur only work for form fields? $("#products_nav").click(function(){ $("#menu_tabs").slideToggle(); $(this).blur(function(){ $("#menu_tabs").slideUp(); }); });

So I have a drop down menu that slides down on click, and back up on click again (slidetoggle). But I want it to slide up if the user clicks anywhere else on the page. The only way I can think of doing this is having a div overlay, that if they click on, it will hide the menu. Surely there is a better way. Any ideas?