I am trying to display three different types of forms of the same page. One of the three will appear based on the selection. Right now my code has everything shown when you first reload the page and then when you select something it all disappears and nothing comes back. I am trying to use divs because the forms will perform the same action just with different parameters. It is a lot of code but the forms are the same thing just wrapped in a different div and I know they work. hopefully this will cut down on the amount of time you have to look at it.
Below is what I have so far:
Code:
<html>
<head>
<script type="text/javascript" language="javascript">
function choose()
{
document.getElementById('notes').style.display = 'none';
document.getElementById('tests').style.display = 'none';
document.getElementById('homework').style.display = 'none'; .....
i am building a website form which I would like the user to select a product of interest. Some products are three tiered and some are two tiered.
1. Example of three tier (3 dropdowns required only):Scooters (dropdown 1)Three Wheel Scooters (dropdown 2) Delux 503S Bird Scooter (dropdown 3)
2. Example of two tier (2 dropdowns required only):Standing Bikes (dropdown 1)Children 300 Series (dropdown 2)
If the user wants to submit their interest for one of the products, I need to have at most 3 dropdown menus. So in Example 1, I would have 3 dropdowns in my form. Dropdown 1: Scooters Dropdown 2: Three Wheel Scooters Dropdown 3: Delux 503S Bird Scooter.In Example 2, I would only need to use the first 2 dropdown menus. (Obviously the first dropdown would contain 'Scooters' and 'Standing Bikes' in the menu list)I would like to alter the code so that the second and third dropdowns are hidden until a selection from the first drop down is made. Once for example, 'Standing Bikes' is selected from the first dropdown menu, the second dropdown menu appears and the third remains hidden due to the fact that it is not required. If I selected Scooters from the first dropdown menu, the second dropdown would appear listing all items associated with this and at this point the third dropdown menu is hidden. If i select 'Three Wheel Scooter' from the second dropdown the third dropdown menu now appears listing all Three wheel Scooters such as 'Delux 503S Bird Scooter'.
I'm wanting to hide certain divs within a container. If the sub div DOESN'T have a checkbox which is selected in it, then it should be hidden when you click the link. eg: if #2 and #5 checbox only where selected then divs(sub_1,sub_3,sub_4) would be hidden when link was clicked.
I have a form with a drop down list box, few textboxes with labels and submit button. depending upon my selection I should be able to show hide textbox; assume items, 1,3,5 in the selection box shows the items other than the listbox and 2,4,6 items in the selction box if selected hides the labels and textboxes. but in all the case submit button should be present.
I want to have several forms on one page that are not displayed until a selection is made from the category drop down box(select element). The form displayed will depend on the selection made. Here is the code I have so far.
I want to have several forms on one page that are not displayed until a selection is made from the category drop down box(select element). The form displayed will depend on the selection made.
I am in the progress of building a new website; the layout and stuff is already done for the most part, but I am having a problem with the two order forms on my website. Well not the forms themselves, more with how they appear (and disappear).Like stated I have 2 forms on my website. When coming to my website they should be hidden (standard). When someone wants to order they press the link for order form A or form B.
Is it possible to load a page within the DIV for example I want form B to include extra-info.php. Is this possible?If I understand correctly the above would be possible with jQuery with use of hidden DIV's. But I really don't know much about Javascript to pull this of myself.
Ive got a form that is made of <feildsets>'s that when the user clicks submit it will validate the form before submitting it properly.
If an error is encountered it will display an error image and a user friendly error message. This code works fine However, theres a restet button, that when the user clicks it, it should wipe the form, and hide the error message. Code:
I am wondering if it is possible to have a popup form on entering a page and have users answer say maybe 3 questions and upon hitting submit for the 3rd question the survey hides and then on leaving the page to browse to a new one or on closing the browser the form would pop up again for users to answer a few more additonal questions.
I've got a dropdown and I need for it to open up a row directly below it if the user selects "Yes". I've tried all morning and cant get it to work at all.
When you click the text "info" in the column "comments", a row should be displayed below with text information that is related to the "comments". Need also to click the text "Info" again to hide the text information of comments. Problem: I don't know how to display the row when you click one of the comments with the text "info". When clicking one of the link the remaining rows with the text "info" should not be affected. In order words, the part should be independent Need also some help hiding the text information of comments.
There are some things that you also need to take account to: - The amount of data that will be displayed in the table will be changed from day to day. The data is taken from a xml file.- Would like the sourcode to be written in jQuery.- Only html, css and javascript is allowed in this context.- html code in tr and td will be generated by javscript code.The class "firstDataRow" is the added in the tr row that has the text information of commentsPlease remember that the text hide and show is only for temporary.
Getting myself back into jQuery and have an issue which I didn't previously fix, and was wondering if anyone would be able to assist me. I have multiple DIVs (up to 50 on one page) that I wish to individually be able to hide and close an extra DIV once pressing the 'Details' to show, and 'Hide' to hide the extra hidden DIV.
I have enabled a hover() event on a DIV that includes an H2 element that is always displayed and a child DIV that needs to be shown/hidden. This code works wonderfully on Firefox and IE. However, it's not working in Safari (I have not tested Opera or Chrome yet)Here's my (very simple) code:
I have a menu with a div displaying onmouseover, and hiding onmouseout, it works great except in IE if I click on the <select> tag, it triggers the mouseout event, interestingly enough the same does not happen when I click on a text field..
Code Example:
This is obviously not the real code, it's just to give you an idea, I don't think I can post the real code, cuz it's really long and complicated...
I'm using the prototype framework, and I'd like to keep it that way if possible...
I would like to be able to display either one or the other HTML table in the same place. I.e., there are 2 buttons on the screen. When the user clicks one button, the table A is displayed below. When the user clicks the other button, the table A disappears and the table B appears in the same place.
When I use the classic div tags followed by table code, they are displayed sequentially on the page, rather than in the same place.
I have a div (representing a form) with a number of images positioned absolutely within it. The images represent buttons and what I'd like to do is click on one of the images/buttons and the whole form to fade out with the exception of the selected button which merely changes it's opacity from 1 to 0.5 (to remind the user it was clicked). Here's the code I'm using:
However, despite referencing the elements in a number of ways (they have unique id's), every time I run this, $(this) won't show - the opacity is being set but it seems to remain steadfastly invisible whilst the parent div is invisible/hidden - am I barking up completely the wrong tree here ?
How can I make it so i can drag and drop usernames from one selection box to another?Here's the code of two selection boxes one of which would be populated with usernames and another is empty where you move the username into to register him as banned.
I have problem, the code cannot operate. The user must select in dropdown list having one display of image every time.
JS code var sel = document.getElementById("sw"); function f1(){ var imgs = ['chart1.cgi', 'chart2.cgi', 'chart3.cgi', 'chart4.cgi']; var im = document.getElementById("pic"); im.src = imgs[this.selectedIndex]; }
I am trying to figure ou how to have a page where a client can input some text, then select a font type and color and possibly an outline(?) and have the page display their text with their selections (I hope that makes since-like if they choose 'Hi' in blue text, veranda style it would actually display the text in blue in the font face chosen), and from what I gather, I may be able to achieve this using javascript with css, but I'm not sure where to start?
I have a lot of DIV tags on an HTML page. I want to group some of them so that I can hide them all together at once if needed. What's a good way to do this? I want this to be compatible with at least IE 5. Would it be a good idea to assign all DIV tags in the same group the same "title" attribute?
This is what I want to do, but I'm not sure if it's the correct approach, and I'm not sure how to set the style with javascript either:
<div title="groupA">hello world</div> <div title="groupB">from group b</div>
then with javascript set this style: div[title='groupA'] { display:none }
If this is the right approach, and is compatible with say IE 5 or 6, would someone tell me how to do it in javascript?
I currently have a page which, when the user clicks a button creates a new row displaying a form. I also have other forms on this page how to close a form using javascript? My code to create the table row and form are below...
myform = document.createElement("form"); myform.method = "post"; myform.action = "editdetails.php"; myform.id = "editemail"; myform.name = "editemail"; var a=document.getElementById('editdetailstable').insertRow(2); var b=document.getElementById('editdetailstable').insertRow(3); [Code]....
I have a checkbox that when clicked I want to hide all of the entierows in my table where those fields with a class of internalFieldequals True. The hiding part works well but when I uncheck thecheckbox the rows do not become visible again. So I guess my questionis how do I toggle the value of this checkbox (chkInternal) to hide/show these table rows?
I am new to jQuery and can't get this to work properly. I am loading content form a php page through an AJAX call. Based on the data that is returned I want to fade in a DIV or keep it hidden. Therefore I have a if construction that checks the data that was inserted in a DIV from the PHP page. If the PHP page returned 'No data' the DIV should remain hidden. The loading part works OK, but somehow the hiding or showing of the DIV doesn't work. What am I doing wrong? Is the syntax correct? This is what I have now:
What I want to do is have a page that only displays if javascript is enabled(or similar) in the sense that it tells users that js is not enabled and how to enable, what were doing is creating web forms and would only like them viewable if js is enabled so that we can validate client side and reduce server load. Main reason is validation client side, cause if the initial form works well we will expand it to include forms for every type of job we can. No idea to where to start as js is not a strong point.
