How to expand/collapse (toggle) div layer using jQuery

Step 1 Include jQuery Library in head section of your html file.

<script type="text/javascript" src=""></script>

Step 2 Write HTML

<div class="main">
<p class="User">User-1</p>
<div class="description">PHP dev</div>
<p class="User">User-2</p>
<div class="description">Jquery dev</div>

Step 3 Write CSS
.main {
margin: 0;
padding: 0;
width: 500px;

.User {
margin: 1px;
color: #fff;
padding: 3px 10px;
cursor: pointer;
position: relative;
.description {
padding: 5px 10px;
p { padding: 5px 0; }
Step 4 JQuery function
<script type="text/javascript">
jQuery(document).ready(function() {

Thats it!!!!!!!!!!!!! Expandable-Collapsible panel is ready thank you

JQuery add / remove Text-Box example Dynamically

Following are steps to create a dynamic input fields

1.HTML Code

var increment=2;
if(increment &gt; 5)
return false;
// two methods
// first memthod…we can write div element
var maincontent=”Textbox #”+increment+” :
var fun=”<div id=’TextBoxDiv”+increment+”‘>”+maincontent+”</div>”;
//second method
// here jquery through create div element
var newTextBoxDiv = $(document.createElement(‘div’)).attr(‘id’, ‘TextBoxDiv’ +increment);
$(“#removeButton”).click(function () {
alert(“No more textbox to remove”);
return false;
$(“#TextBoxDiv” + increment).remove();

$(“#getButtonValue”).click(function () {
var msg = ”;
for(i=1; i&lt;increment; i++){
msg += &quot;\n Textbox #&quot; + i + &quot; : &quot; + $(‘#textbox’ + i).val();

<div id=’TextBoxesGroup’>
<div id=”TextBoxDiv1″>
Textbox #1 :

that`s it.... 

Show next input after typing in the first input using JQuery

Look @ following code 

1.HTML Code

Fname:<input type="text" id="1" /><br>
Mname:<input type="text" id="2" /><br>
Lname:<input type="text" id="3" /><br>
Education:<input type="text" id="4" /><br>
Age:<input type="text" id="5" /><br>
Hobby:<input type="text" id="6" /><br>
PutLast:<input type="text" id="7" /><br>

2. Javascript 

<script type="text/javascript" src=""></script>

<script type="text/javascript">
$(document).ready(function() {
               $('#2, #3, #4, #5 , #6, #7').hide();
                 $("input").keyup(function () {
                       var value = $(this).val();
                       var id = parseInt($(this).attr('id'));
                       var nextid = '#' + (id + 1);
                if (value != "")
                else     $(nextid).hide();

P { color: blue; margin : 8 px;}
.hide { display:none; }

that`s it.... from my side Thank you  

or got thr` dis URL


wamp forbidden phpmyadmin

WAMP error: Forbidden You don’t have permission to access /phpmyadmin/ on this server

Change the file content of c:\wamp\alias\phpmyadmin.conf to the following.

<Directory "c:/wamp/apps/phpmyadmin3.4.5/">
    Options Indexes FollowSymLinks MultiViews
    AllowOverride all
        Order Deny,Allow
        Allow from all

Here my WAMP installation is in the c:\wamp folder. Change it according to your installation.

Previously, it was like this:

<Directory "c:/wamp/apps/phpmyadmin3.4.5/">
    Options Indexes FollowSymLinks MultiViews
    AllowOverride all
        Order Deny,Allow
    Deny from all
    Allow from

Restart your Apache server after making these changes.   eNJoYYyyyyyy.....!!!