blog gadget design wallpaper web programming review


check checkbox with specific value ( using jQuery )

To check/uncheck checkbox with specific value using jQuery.

To check checkbox with id lead with "chk_hobby_" and has value = 7 :

$("#data-form input[id^='chk_hobby_'][value=7]").prop('checked',true);

To uncheck checkbox with id lead with "chk_hobby_" and has value = 2 :

$("#data-form input[id^='chk_hobby_'][value=2]").prop('checked',false);

HTML Sample :

<form id="data-form">Hobby
<div><input id="chk_hobby_2" type="checkbox" name="hobby[]" value="2" checked="true" /> <label>Swimming</label></div>
<div><input id="chk_hobby_6" type="checkbox" name="hobby[]" value="6" /> <label>Watching Movie</label></div>
<div><input id="chk_hobby_7" type="checkbox" name="hobby[]" value="7" /> <label>Bowling</label></div>
Demo :
Tagged as: No Comments

Javascript UI library

Here some javascript library for make your website user interface (UI) looks good and cut your time to create common UI.
They have many common feature which is we need for common website, datagrid, tree, window, menu, accordion, datepicker, etc .
jQuery UI

jQuery EasyUI
This library is created  based on jQuery.

This library is created  based on jQuery and also support for mobile device.


CSS Generator Tools

Here some useful web design tools for make your live easier  :) .

CSS Button Generator -

CSS Button Generator

CSS Layout Generator -

Tagged as: Continue reading

basic jquery tutorial

What is jquery ? jquery is one of most popular javascript library to make your live easier 😀 , you can make animation, ajax, manipulate html with only few line code. You can download jquery file from . Here same sample jquery for basic usage :)  .

Hello World

//make sure you use ready state to make sure all element is loaded before execute the script inside
 alert("Hello World");

Full code :

    <title>Untitled Document</title>
  <script type="text/javascript" src=""></script>
  <script type="text/javascript">
        alert("Hello World");


create simple menu navigation using CSS

Here i will explain how to make simple menu using CSS (without table) like this.
First create menu using list tag li and make inside <div> element and give it name as "main-menu". After that make css for styling the list.  We must make the list become one line using float:left to make horizontal menu. For the detail you can see in


the various uses of “group by” in mysql

I will explain some useful tips  using "group by" query in mysql.

First create new table for testing in your database ...

CREATE TABLE `movie` (
`id` tinyint(4) NOT NULL auto_increment,
`title` varchar(100) default NULL,
`genre` varchar(100) default NULL,
`price` double(10,2) default NULL,

INSERT INTO `movie` (`id`, `title`, `genre`, `price`) VALUES (1, 'Spiderman', 'action', 5.00);
INSERT INTO `movie` (`id`, `title`, `genre`, `price`) VALUES (2, 'Hulk', 'action', 4.00);
INSERT INTO `movie` (`id`, `title`, `genre`, `price`) VALUES (3, 'Romance in the rain', 'romance', 4.00);
INSERT INTO `movie` (`id`, `title`, `genre`, `price`) VALUES (4, 'Hello World', 'comedy', 10.00);
INSERT INTO `movie` (`id`, `title`, `genre`, `price`) VALUES (5, 'Bang Bang', 'comedy', 6.00);