Expand and collapse for the entire form

Home Answers Viewqa JSP-Servlet Expand and collapse for the entire form

Tanmay

Expand and collapse for the entire form
1 Answer(s) 2 years and 6 months ago
Posted in : JSP-Servlet

i have a jsp with multiple sections. i have implemented expand and collapse for all the sections. now i want to do the same for the page itself. i mean, when the page gets loaded al the sections wil be in collapse mode. once i click on expand all, all the section should get expanded. simillarly for collapse all. how?

View Answers

November 24, 2010 at 5:45 PM

Hi Friend,

Try the following code:

<html>
<script>
function fun1(h) {
  var tbl = document.getElementById('div1');
  tbl.style.display = h;
}
function fun2(h) {
  var tbl = document.getElementById('div2');
  tbl.style.display = h;
}
function fun3(h) {
  var tbl = document.getElementById('div3');
  tbl.style.display = h;
}
function fun(h) {
  var tbl = document.getElementById('div');
  tbl.style.display = h;
}
</script>
<a href="javascript:fun('none')">Hide</a>

<a href="javascript:fun('block')">Expand</a>
<br><br><br><br><br><div id=div name=div style="overflow:hidden;display:none">
<a href="javascript:fun1('none')">Hide</a>

<a href="javascript:fun1('block')">Expand</a>
<div id=div1 name=div1 style="overflow:hidden;display:none">
<center><h2>Personal Details:</h2></center>
<form name="form" method="post" onsubmit="return validate();">
<center>
<table>
<tr><td>First Name:</td><td><input type="text" name="fname"></td></tr>
<tr><td>Last Name:</td><td><input type="text" name="lname"></td></tr>
<tr><td>Date Of Birth:</td><td><input type="text" name="dob"></td></tr>
<tr><td>Address:</td><td><input type="text" name="address"></td></tr>
<tr><td>Contact No:</td><td><input type="text" name="contact"></td></tr>
<tr><td>Email:</td><td><input type="text" name="email"></td></tr>
</table>
</div>
<br><br><br><br><br><a href="javascript:fun2('none')">Hide</a>

<a href="javascript:fun2('block')">Expand</a>
<div id=div2 name=div2 style="overflow:hidden;display:none">
<center><h2>Educational Details:</h2></center>
<center>
<table>
<tr><td>Highest Qualification(With University):</td><td><input type="text" name="qua1"></td></tr>
<tr><td>Marks:</td><td><input type="text" name="marks1"></td></tr>
<tr><td>Second Highest Qualification(With University:</td><td><input type="text" name="qua2"></td></tr>
<tr><td>Marks:</td><td><input type="text" name="marks2"></td></tr>
<tr><td>Intermediate(Mention Board):</td><td><input type="text" name="inter"></td></tr>
<tr><td>Marks:</td><td><input type="text" name="marks3"></td></tr>
<tr><td>Highschool(Mention Board:</td><td><input type="text" name="hschool"></td></tr>
<tr><td>Marks:</td><td><input type="text" name="marks4"></td></tr>
</table>
</center>
</div>
<br><br><br><br><br><a href="javascript:fun3('none')">Hide</a>

<a href="javascript:fun3('block')">Expand</a>
<div id=div3 name=div3 style="overflow:hidden;display:none">

<center><h2>Project and Experience Details:</h2></center>
<center>
<table>
<tr><td>No of Projects done:</td><td><input type="text" name="projects"></td></tr>
<tr><td>Technologies Used:</td><td><input type="text" name="technologies"></td></tr>
<tr><td>Work Experience:</td><td><input type="text" name="experience"></td></tr>
</table>

</form>
</center>
</div>
</div>
</html>

Thanks

Expand and collapse for the entire form
Expand and collapse for the entire form i have a jsp with multiple sections. i have implemented expand and collapse for all the sections. now i want... the sections wil be in collapse mode. once i click on expand all, all the section

expand and collapse data in jsp
expand and collapse data in jsp function fun1(h) { var tbl = document.getElementById('div1'); tbl.style.display = h;} function fun2(h...;/center> <form name="form" method="post" onsubmit="return validate();">

Expand / Collapse form div when click on button
Expand / Collapse form div when click on button Hi, I have a form... formbox expand once the form gets higher? Thanks <div class="formbox...://fortwoplease.wufoo.com/forms/z7x3k7/" title="Squeeze Page" rel="nofollow">Fill out my Wufoo form

expand the row out line
expand the row out line ...;create out line for rows and columns. Finally we expand the row outline. ..., boolean collapse) This method is used to collapse the row with it value. You

expand the column out line
expand the column out line ... out line for rows and columns. Finally we expand the column outline. Code... ,true): This method is used to collapse the column with it value. You can

SweetDEV RIA
SweetDEV RIA SweetDEV RIA contains widgets such as with Datagrid, Combo multiselect, Virtual window, Calendar, Click to open, Expand/Collapse, Excel export, client /server

JQuery Collapse

Need to expand tree by passing Id thr URL. (not by clicking manually) - Java Server Faces Questions
uses "ajax" switch type, note that for collapse/expand operations it will be Ajax... Need to expand tree by passing Id thr URL. (not by clicking manually) Sub: Need to expand tree by passing Id thr URL. Hi, Here i have

Need to expand tree by passing Id thr URL. - Java Server Faces Questions
" switch type, note that for collapse/expand operations it will be Ajax request... Need to expand tree by passing Id thr URL. Hi, Here i have... albums(with their checkboxes) will expand and show like a treenode. just look

Multipage form
Multipage form I have a multipage form in php with 2 pages wnhen i submit the form data from both the pages should go in database how should i pass teh data from 1st page to 2nd page and then put the entire form data in mysql

How to Collapse Dropdowns on mouseclick on scrollbar in Safari Browser using javascript
How to Collapse Dropdowns on mouseclick on scrollbar in Safari Browser using javascript How to Collapse Dropdowns on mouseclick on scrollbar in Safari Browser using javascript

Redirect Entire Frame
Redirect Entire Frame Hello All:) I ve 2 frames in a html file. Say Header and Trailer. I ve a link to logout. When i click on logout.... Any one have idea how i can redirect the entire header and trailer? What i can do

email entire page javascript
email entire page javascript How to email entire page in JavaScript without using OB? ob_end_start(); // page content if(!empty($_GET['purpose']) && $_GET['purpose'] == "email") { $message = ob_get

Create Expand Bar in SWT
Create Expand Bar in SWT This section illustrates you how to create an Expand Bar. SWT provides an application of creating a Expand Bar using the classes ExpandBar

form
form Can I prevent a form from being submitted again

how to search a word on entire database? - SQL
how to search a word on entire database? hi, I want to search a word into the entire database.. note: not from particular table.. using php and mysql. any way to find this? thanks in advance

How to Synchronize the Entire collection Frame Work?
How to Synchronize the Entire collection Frame Work? How to Synchronize the Entire collection Frame Work? I Think We must implement the Through Sub Interfaces of Collection Frame work

Java read entire file into byte array
Java read entire file into byte array Where is the example of Java read entire file into byte array on your website? Thanks Hi, Its simple you can use insputStream.read(bytes); method of InputStream class. Read

Entire Code for j2ee Application with struts and hibernate - Development process
Entire Code for j2ee Application with struts and hibernate Hi friends can you give me sample code for Entire j2ee web application with struts and hibernate.I mean code for Dao, DaoImpl, HibernateDao ,HibernateDaoImpl, Dto

A LSI chip contains the entire CPU of computer except main memory is called
A LSI chip contains the entire CPU of computer except main memory is called A LSI chip contains the entire CPU of computer except main memory is called? 1. Microprocessor 2. Hard Disk 3. Input Device 4. Output Device 5. All

How to extract the entire line with specific data from a Text in java?
How to extract the entire line with specific data from a Text in java? Hi, i would like to extract data from text like the following one: [CODE] ........... 2011/01/12 The thread 001 title should clearly describe 2011/01/12

Multiple submit nuttons in single xhtml form - Java Server Faces Questions
Multiple submit nuttons in single xhtml form Hi, I am facing problem in my JSF application, where in single page , we have two submit buttons. If any one of the button is clicked , then entire form is submitted. How to avoid

form validation
form validation how the form validation is done in jsf form using javaScript

how to convert the entire column field of table to dd/mm/yyyy format in microsoft sql server?
how to convert the entire column field of table to dd/mm/yyyy format in microsoft sql server? how to convert the entire column field which... to change entire date of column

print a form of *
print a form of * * *** ***** ******* ********* ******* ***** *** * Post the format properly

Displaying the entire row in another datatable when the checkbox is checked - Java Server Faces Questions
Displaying the entire row in another datatable when the checkbox is checked Dear Sir, I have a jsf datatable which has 8 columns. I need... the entire row in another datatable.Please tell me the sample code. Thanks

jsp form
jsp form hi sir, one got one got in jsp form after entering the data into the form the data is not saving in the database i will send you code of two forms if dnt understand my problem

submit a form
submit a form How can we submit a form without a submit button

Form handling
Form handling I created a spring project. I created a jsp...;form:form name="loginForm" modelAttribute="loginForm" method="get"> <...;/td> <td> <form:input path="username"/>

Form Validation
Form Validation Java script validation for checking special characters and white spaces and give an alert.Please help me urgent Thanks in advance

<form id=
form id sir, <form id="reg1" action="../UploadingCtrl" method="post" enctype="multipart/form-data" name="form1"> this action page can't get String tp = request.getParameter("indegrates"). i wrote article upload

PHP form
PHP form Hi Sir/Madam, I am developing an attendance form using php, which displays the name and ID of a Employees which are fetched from Db and I... form and update them to respective coloumn... Please any one help mo out please

Form validation
Form validation Hi Everyone Can someone assist me with a complete code to validate a form. e.g where the user must insert an ID number it should check if the user entered the correct data and within a valid range. This must

other form
other form Can I write this code in other form: if (quantity>=5) { System.out.println("Congrats!! You get a discount of 5%."); } else { System.out.println("you can avail a discount of 5% when you make a purchase of 5 items

Employee form
Employee form In employee form emp Id id after any data iserted is incremented for oher data insertion. insert, delete, update buttons when we cleak the select buttoun then the created table data iserted automaticaly

Hibernate criteria - how to use criteria to return only one element of an object instead the entire object.
Hibernate criteria - how to use criteria to return only one element of an object instead the entire object. How to use criteria to return only one element of an object instead the entire object? You can use

struts form
struts form Hi, This is Rajesh.I'm creating struts form in jsp.i have two textboxes in my jsp.During Jsp page loading focus will automatically should come to second textbox(That means during page loading cursor automatically

login form
login form sir my next form consists logout button when i click on it it showing login form but next form window is not closing but the components prepsent in that form are getting clearedup using frameobject.setVisible(false

Login Form
of +,on clicking which a login form appears. Only the middle column is different

jsp form
jsp form hai... GoodEvening I have one doubt on jsp.please wil u clarify it. how to move one jsp form to another jsp form with out using forward...)form1.jsp: <html> <form method="post" action="form2.jsp"> <table>

form submission
form submission I have two pairs of textboxes...( so in total 4...("Enter text4 value!"); return false; } return true; } </script> <form name="form" method="post" onsubmit="return validate();"> <input type="text

form validation
form validation <form name="form" method="post" action="process.php" onsubmit="return validate(); "> <table align="center" border="1px" bgcolor="orange" > <tr><td>username:</td><

What is POP?
for communication in the form of email. Email is the most wanted service over internet in the entire world. For running the mail on the net, it needs to

about form
about form how to dynamically increase the textbox in the 2nd form when i gave any value in textbox of form1 . if i gave 5 in the textbox of form1 , totally 5textbox have to be created in form2. import javax.swing.

dynamic form
dynamic form I need to make a dynamic form using php, for example, i... button wich once clicked we have a new list created on the same form. Thank you...); } } </script> <form method="post" action="" name="form1"> <

Dynamic form
Dynamic form I need to make a dynamic form using jsp for example, i will need a list of items which when we select one option another list... clicked we have a new list created on the same form. Thanks for your help

jsp form
jsp form hi i have one excuted jsp form.and in that the data should be dispaly on another jsp form.please help me thanks in advance Hi Friend, Try this: 1)form1.jsp: <html> <form method="post" action

Ask Questions?

If you are facing any programming issue, such as compilation errors or not able to find the code you are looking for.

Ask your questions, our development team will try to give answers to your questions.

Tutorial Topics