Featured
-
Top 10 Template Engines for JavaScript
What is a Template engine? Template Engines are
by nishant.mishra -
jQuery Accordion
Hello readers! In this Blog we will gain knowled
by vishwanath.rana -
How to make Numbered and bulleted list in HTML Editor with JavaScript
Hello all, Working with HTML Editor we wanted t
by gaurav.gautam -
How to hide particular div with just one click?
Hi, you want a condition in which the particula
by abhishek.tiwari.458 -
How to Create and Retrieve Array in Javascript?
If you want to store multiple values in a single v
by siddharth.shahi
Tags
Making Custom Select Box Using JQuery
While designing an HTML form, a lot of time there is a requirement of custom form elements. Below is a tutorial on how to create some nice custom select box with CSS and jQuery.
<div class="selectBox">
<div c...
Changing the Behavior of a Dialog Box with Effects
The options used when creating the dialog box can be modified by the dialog ("option", param, value) method. The param parameter is the name of the option, while the value corresponds to its new value.
lets change the effect for the opening and ...
Changing row color on clicking radio button
Consider an HTML table with multiple rows having radio button in first column of each row. Now, if we want to change the row color when radio button associated with it is clicked, we have to write following code.
// HTML //
Untitled
...
Finding the Dimensions of an Element
You want to determine the space occupied by an element.
The width and height methods can be applied to any element, and they are useful for
determining the computed width or height of an element. However, they fall short if
you need to deter...
Finding the Dimensions of the Window and Document
You want to get the width and height of the window and document in pixels.
jQuerys width and height methods provide easy access to the basic dimensions of the window or document:
$(function() {
alert('Window height:'+jQuery(window).height(...
Set predefault current date in datebox
How to set pre default current date in datebox before choose any other new date:
We have to follow following steps.
Step 1:-
Download below 2 files.
jquery.datepick.js
jquery.datepick.css
Call both file in HTML head
<link ...
How to check and uncheck all checkbox on single click?
When we have multiple check box to select then we need to check all these one by one it will take more time to check all so by using jsscript we can check and unchecked all check box on a single click. In the below script can check and uncheck al...
Preventing child element from firing on click of Parent element
Suppose, we have this html where div element have 2 child p elements and 1 child anchor element.
<div>
<p> I am para one</p>
<p> I am para two</p>
<a href="http:nowheretogo.com">I am a link<...
Subtract date in JS
Subtract date in javascript : -
var current = new Date();
//It will give the current date and time in default format.
var future_date = new Date(now .setHours(now .getHours()+48));
//in this we add 48 hours in present time .
...
Adding and Removing Select Options
A drop-down box for colors and want to add new colors to it, as well as remove options from it.
<label for="colors">Colors</label>
<select id="colors" multiple="multiple">
<option>Black</options>
<option>...
Adding data to jqxtree dynimacally on click of nodes of a tree using AJAX call
There might be a case where user wants to add data to jqxtree on click of each individual node. Below is the code which help us to achieve the above
functionality where user can get data from JSON file or database on click of each individual tre...
Disabling All Effects
Your user or web application may require that all animations are disabled, but the effect of revealing information or scrolling (or whichever animation type) may still be required. jQuery has a way to disable all animations from one access point...
Formatting jQuery date picker
Sometime you may need to use the jQuery calender in some project. you writes the following code:
jQuery( ".in_time" ).datepicker();
and it gives you:
1- if you need to show all the dates which are previous to the current date:
If ...
Declaring variables in jquery / javascript (for ie8)
Sometime we need to perform some operations in variables values in jquery or javascript.
We generally uses:
a = jQuery('input#marks').val();
It will be working fine in all the browsers except ie8.
This type of assignment doesn't works i...
Applying if condition on some specific index of select box
If we want to apply condition on changing of specific indexed value of select box we simply do this:
$('#select_id').change(function(){
if(((parseInt($('option:selected',$(this)).val()))==2)||((parseInt($('option:selected',$(this)).val...
Delete a row from list on a click of a button
If you want to delete a particular list (li) from the listing, you can easily do this with the following code.
$('#demo ul li[rel="'+id2+'"]').remove();
<div is="demo ">
<ul>
<li rel="id1">This is just a demo....
Restricting the textbox to enter number only using thier ASCII codes
We can disable the keys to enter inside the textbox. For example if we have a textbox for entering user's age then a user only need to enter numbers (The age will only be in number format ie 12,18 and so on)
We can use the following javascript...
Append tag using jQuery
If you want to append HTML in pre-defined HTML :
$("#detail").append('<div class="demo"><p class="modify">He has all the ability and a perfect attitude.</p></div>')
JScript to Check or Uncheck Checkbox in a Grid
JScript to Check or Uncheck Checkbox in a Grid
Inputs:
GridObject: Object of the grid in which checkbox exists
Column: Column name where value is searched
CellValue: Reference cell value
Status: Check or uncheck the checkbox
funct...
Creating custom alert and waiting popup using jquery
Creating custom alert and waiting popup using jquery
function displayWaitingPopup(){
var dynHtmlPart1 = '';
//insert lightbox HTML into page
$('body').append(dynHtmlPart1);
$("#shade").css('height', $(document).heig...
How to call custom scrollbar dynamically
To use custom scroll bar we have to follow below steps.
Steps.
1 - First download tiny scrollbar javascript libarary by using below url.
<pre>http://baijs.nl/tinyscrollbar/</pre>
2 - Include tinyscroll bar library in th...
Forming Valid Query Strings in jQuery
The jQuery serialize()
method turns the form values into a valid querystring, as such you can simply append to the string:
firstName=Maurizio&lastName=Tarchini
Useful, right?
Lets take an example:
<p><em></em>...
Selecting a text field with name using JQuery
JQuery has loads of selectors that can be used to select an HTML Element from a page.
One of the common scenario with development for even a simple case of validation requires to check for input fields and to do so we can use a selector that s...
