Pinoy Tutorials

I am using the snippet below on one of my blogs in blogger to dynamically get the classname of a span element which contains a text of the post ID of the entry and process the iframe tags within that element. $(document).ready(function(){ $.each($('span.post-id'),function(i,v){ var s = $(this).text(); getiFrame(s); //this is a separate function to process iframe tags. }); });

The .scrollTop() function in jQuery allows you to get the current vertical position of the scroll bar for the first element in the set of matched elements or set the vertical position of the scroll bar for every matched element. You can extract the scroll position of a certain page or element using the jQuery's .scrollTop() method . $(window).scroll(function (event) { var scroll = $(window).scrollTop(); // Do something }); You can also determined the percentage and alert the user that he has scrolled certain amount within the document. >$(document).scroll(function(e){ // get the scroll value and the document height var scrollVal = $(window).scrollTop(); var docHeight = $(document).height(); // calculate the percentage when the user scrolls down the page var percentage = (scrollVal / docHeight) * 100; if(percentage > 50) { // call the function called alertUser alertUser(percentage); } function alertUser(scr...

I have this problem before when I tried to search a keyword from a database using jQuery-AJAX-PHP. Where in the query is fired up multiple times which slows down process. After searching reading various solution for this problem. I've came up with the jQuery function below. This handles the keypress event of the textbox with an id keyword . $('#keyword').live('keypress', KeywordSearch); Javascript Function: function KeywordSearch(event) { if (event.handled !== true) { if (event.keyCode == 13){ var type = $('#searchType').val(); var keyword = $('#keyword').val(); var result = $.ajax({ type: "GET", url: "search.php?keyword=" + keyword + "&type=" + type, async: false}).responseText; $('#results').html(result); $('#myTable').fadeIn('fast'); event.handled = true; event.preventDefault(); } } }

In this tutorial, I'll be showing you a basic example on how to create Pagination on your website. The purpose of this is just to give basic logic of how it was created. So, let's get it started. First, we will create the PHP file to print out the page ranges. We have two parameters $LIMIT and $RANGE that is passed by an Ajax request via jQuery. $LIMIT - This is the limit of rows per page to be displayed. $RANGE - Initially, this is set to 1. This is the pages range that will be displayed. It will decrement/increment as you click the Next or Previous buttons. Additional parameters... $MAX - The maximum number of pages to be shown in a range. This example shows 10. $RECORDS - Get the total number of records in the database table. $PAGES - This is the quotient of the $RECORDS divided by the $LIMIT . Then we do some conditional statement to print out the pages, next and prev button. PHP File (pages.php) <?php include "js/pagination.js...

Key event handling is not that easy after all. However, it's more advisable to reliably get character codes during the keyPress event. There are two different types of codes: 1.)   event.keyCode: Keyboard Codes that Returns the Unicode value of a non-character key in a keypress event or any key in any other type of keyboard event. 2.) event.charCode: Character Codes that Returns the Unicode value of a character key pressed during a keypress event. In this tool I was using jQuery events to get the corresponding event codes of the keys the user pressed. CODE: $(document).ready(function(){ $('#key').live('keypress', processKeyPress); $('#key').live('keydown', processKeyDown); $('#key').live('keyup', processKeyUp); function processKeyDown(e) { processEvent('keyPress', e); } function processKeyPress(e) { processEvent('keyDown', e); } function pro...