Changing Form Values And Hiding Fields Onclick?
Jun 6, 2009
I'm working on an ordering form which calculates the total order price using Javascript. I have a checkbox which I want to use to toggle the display of various items, and also reset the value of an item depending on whether or not it is checked.
Further details
I have a checkbox for the colour "Black" which, when checked, hides a SELECT, a bit of text, and "Quantity" field. It also resets the value of the "Quantity" field to zero.
When the "Black" checkbox is unchecked, the three items (SELECT, text and Quantity) are revealed again, and the Quantity field for "Black" is reset to zero and hidden.
The reason is that users can only either EITHER a black item or select from a list of colours. Black items are a different price to all others.
How the form works
When the user enters a quantity into a text field for each item, the price of that item is added to the total at the bottom of the form. When the form is submitted (with PHP validation), it emails the order to a salesperson. The price of each item (for emailing the order) is set using hidden form fields with defined values, while the order total is calculated using the id of each quantity field (e.g. "item_31_85.00").
What I need to know
I want to achieve the following when the "Black" checkbox is clicked:
Toggle the display of three items (SELECT field, text (in a DIV) and an INPUT)
Reset the value of the INPUT field (and reset a different INPUT when the checkbox is clicked again)
My current code
The code I'm currently using in the PHP form is below (truncated for readability):
Code:
<input type="checkbox" name="black" onclick="togglecontent('colour_box','colour_price','color_quantity','quantity_reset')" /> Black
[Code].....
Currently I can hide the SELECT and accompanying text when I check the "Black" checkbox, but it won't reset the INPUT value nor hide it. I've not yet attempted to do unhide and hide the Black text and input since I can't get this part working yet.
View 14 Replies
ADVERTISEMENT
Feb 4, 2010
I have a contact info form with about 16 fields. I need to hide a subset of fields for address when the end user either (1) tabs out of the subset group, (2) clicks anywhere outside the subset field group.
I do not want to hide the fields when the end-user is tabbing within the subset of address fields, yet the focusout handler is triggered when it shouldn't be.
[Code]...
View 2 Replies
View Related
Feb 6, 2007
In my list box if i select one item corresponding to that 4 fields has
to be appear below the list box and if i select another item only 1
field has to be appear below the list box and if i select another item
no fields has to be selected.
View 2 Replies
View Related
Nov 15, 2010
I have a button that needs to increase/decrease the value of a text field when clicked. This code is working in Internet Explorer and Chrome, but not Firefox.
Code:
<a onClick="scorebox1 = parseFloat(score1.value); score1.value = scorebox1 - myscore; scorebox1 -= myscore;"><img src="images/minus.png" alt="Subtract Point" border="0" /></a>
<input size="2" name="score1" style="font-size:24px; width:50px; text-align:center; color:#FF0000;" id="score1" value="0" />
[Code]....
View 4 Replies
View Related
May 11, 2009
First post here - I am trying to hide options in a form select field if they are empty. The code below works...but even I know it must be a horrid way of doing it! Anyone care to tidy it up for me? I would learn much from the experience,
[Code]...
View 3 Replies
View Related
Feb 14, 2011
So the following code hides/shows fields in a form when radio buttons are clicked, the problem is on the same form I have a checkbox and when said check box is selected the showing and hiding of the fields doesn't work.
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">[code]...........
View 3 Replies
View Related
Nov 2, 2011
I'm having trouble changing the font color of my labels ONLY when I stop the form from submitting due to blank fields. I'm not sure whether if just changing my CSS will achieve what I want, or am I going to have to add somethig to my if else statement, or both? I would think I would need to change CSS to :
label.onfocus {
color:red;
}
but a little confused on what else.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
[Code]...
View 21 Replies
View Related
Jul 27, 2010
Below is the html and js I have so far to dynamically place form fields on the form when a certain radio button is marked (Fixed hours). Problem is I can't get the fields to go away if the other radio button is marked (Variable hours). Solutions on what code my js needs to remove the fields when the opposite radio button is marked?
View 7 Replies
View Related
Jul 23, 2005
Why doesn't this work? :-
<BODY onkeydown="display(event)">
<input type="text" name="text1">
<script language="Javascript">
function display(event) {
document.text1.value = event.keyCode+' : '+String.fromCharCode(event.keyCode);
}
</script>
</BODY>
Error: document.text1 has no properties
I have to put it in a Form to get it to work :-
<BODY onkeydown="display(event)">
<form name="form1">
<input type="text" name="text1">
</form>
<script language="Javascript">
function display(event) {
document.form1.text1.value = event.keyCode+' : '+String.fromCharCode(event.keyCode);
}
</script>
</BODY>
View 1 Replies
View Related
Aug 10, 2010
I've created two form fields (username, password).When a user comes to the page, the word "Username" is shown in the first form field. The word "Password" is shown in the second field. When a user clicks inside the field, the word inside the field erases automatically, allowing them to type in their username. Everything above is working, except I'm running into some problems.
1st: I need to figure out a way to include an if statement, that displays "Username" once again, if they did not type anything in the username field, and they clicked outside of the field. This will be the case for the Password field as well.
2nd: If a user types in their username in the username field, then types in their password, but clicks on the Username field once again to fix a typo, it completely erases their username from the field, making them have to type it all again.
View 1 Replies
View Related
Jan 27, 2010
I have 4 text boxes that are supposed to load 4 seperate values of data from one field in one table from a database. The field is called interface_cropsettings (from the interface table) and these values have been concatenated and comma seperated in this field.
Code:
Once the form is filled out and saved, the data is inserted into the database and the values from these 4 text boxes are concatenated, comma seperated and inserted into that one field correctly.
(Example)
If the 4 text boxes have the following values:
In the database field they become:
However, if the form is closed and then re-opened, each text box displays the entire database field rather then each value seperated in the corresponding text box.
(Example)
All 4 text boxes display this:
I already know why the data appears like this in the form, my problem is that I'm not sure how to write the javascript to seperate the values into the correct corresponding fields, assuming javascript is what I should be using!
Also, this is kind of irrelevant but just in case you're wondering, this form is part of a cold fusion application!
View 2 Replies
View Related
Jul 23, 2005
i have a form and would like to check two fields.
if field 1 containes the letter 'c' and the other field contains
'undefined', then an error should apprear ina box on the screen.
can anyone point me a piece of code ?
View 2 Replies
View Related
Feb 14, 2009
I have a form that I am trying to loop through the elements of and come up with a total, when the form is submitted. The goal is to alert users that they have not entered a minimum or maximum number of choices before letting the form submit. The fields in question might be checkboxes in some cases (with a value of 1) or textboxes in others with user-submitted values. Here is a stripped down example...The html
<form class="phpws-form" id="elections_vote" action="index.php" method="post">
...
<input type="text" name="Candidate_Vote[2]" id="Candidate_Vote[2]" size="3" value="" />
<input type="text" name="Candidate_Vote[3]" id="Candidate_Vote[3]" size="3" value="" />[code]....
...problem is, is that total is always 0. I know I'm missing something, and I suspect that 'inputs' is not what I want it to be,
View 5 Replies
View Related
Feb 15, 2010
I want to do is add the values of seven text fields on a form and pop that value to an eighth field. I thought the code below would work, but I get "NaN" on the sum field.
Code:
function addHazWaste() {
document.getElementById('HazardousWaste').value = 0;
var HazWasteTotal = 0;
var HazWaste1 = 0;
var HazWaste2 = 0;
var HazWaste3 = 0;
var HazWaste4 = 0;
var HazWaste5 = 0;
var HazWaste6 = 0;
var HazWaste7 = 0;
HazWaste1 = parseInt(document.getElementById('HazardousWasteSentToLandfill').value,10);
HazWaste2 = parseInt(document.getElementById('HazardousWasteSentToWasteToEnergy').value,10);
HazWaste3 = parseInt(document.getElementById('HazardousWasteIncinerated').value,10);
HazWaste4 = parseInt(document.getElementById('HazardousWasteRecycled').value,10);
HazWaste5 = parseInt(document.getElementById('HazardousWasteReused').value,10);
HazWaste6 = parseInt(document.getElementById('BiohazardousWasteSentToLandfill').value,10);
HazWaste7 = parseInt(document.getElementById('BiohazardousWasteIncinerated').value,10);
HazWasteTotal = HazWaste1 + HazWaste2 + HazWaste3 + HazWaste4 + HazWaste5 + HazWaste6 + HazWaste7;
document.getElementById('HazardousWaste').value = HazWasteTotal;
}
If I run a separate function that just sets all form field values to zero (including the first line of this function). The summing works!!! Why won't it work the way I wrote it??? It won't work if I set the default value for the sum field to zero, either...
View 3 Replies
View Related
Dec 8, 2010
I am having some trouble trying to fix my math equation to calculate the total rent by aquiring values from my form fields. Converting the date fields to days and finding the number of days via two date fields is mainly where I am having trouble. Also, I am trying to have a window pop up before submission but the onclick event does not seem to function properly.Below is the math equation I have come up with:
//calculate days from date field
function calcTotal(date1, date2) {
//assign variables
[code]....
View 3 Replies
View Related
Jul 8, 2009
I am trying to assign values to a bunch of form fields. However, I don't want to loop through EVERY field in the form, just a specific subset of fields. The fields I am trying to change are all named similarly myField1, myField2, myField3.So, my thought is that I would like to use a for loop and loop through the appropriate fields by simply incrementing a variable and appending it to the end of the string "myField" in order to change the appropriate field.How can I evaluate "myField + iterator" into a useable reference to change the value of said field?
View 6 Replies
View Related
Nov 26, 2011
I designed a form having ten fields, will it be possible to have a jquery function that will make all the values in the form field to be displayed in a separate div outside the form by click of a button or a link?
View 3 Replies
View Related
Jan 17, 2010
I use jQueryUI's tabs and when a user changes a form in the tab, it promprts the user that a change has been made. My question is, how do I revert the values before being changed when the user presses 'OK' on my confirm() prompt?
View 1 Replies
View Related
Dec 2, 2010
I am creating a simple web form and am having trouble with a quick jQuery script I am using. A few of the fields on my form are not needed if the topic is not "Get a Quote" so I have a script that hides them if "Get a Quote" is not selected in a dropdown box. I does hide them if I select something else but when I go back to "Get a Quote" the fields do not reappear.
$(document).ready(function(){
$("#CAT_Custom_169338").change(function(){
if ($(this).val() == "Get A Quote" ) {
$(".showmore").slideDown("fast"); //Slide Down Effect
} else {
$(".showmore").slideUp("fast");
//Slide Up Effect
}});});
View 2 Replies
View Related
Oct 10, 2009
There are two input fields in a form, but only one of them is required, they are not required at the same time. Either A or B is required. ( A is required OR B is required). In other words, a user can input data to field A, or he can input data to filed B, but he can not input data to Both A and B at the same time. How to implement this constraint in Jquery form validation?
View 17 Replies
View Related
Feb 3, 2011
I need to get the values of two hidden fields and values that make a query in my database and return this column to a text field in the same form, I have already informed the forum here that can do that with Ajax, researched and made an example But it is not working.
I am sending the code below:
View 2 Replies
View Related
Jan 26, 2010
I just installed a javascript library (Walter Zorn drag and drop:URL... and one of the properties included is the ability to hide or show divs and images that have been made draggable, using the the following methods:if (window.dd && dd. elements) dd.elements. divID.show()I'm wondering if I wanted to make a single button that toggled between hiding and showing a DIV....how would I combine the two methods in a single onclick event? They both work perfectly as separate events on different buttons but I cannot figure out how to combine them.I'm hope there's some way to do this w/ the "else" statement but I don't know the proper syntax.
View 1 Replies
View Related
Jan 26, 2010
I just installed a javascript library (Walter Zorn drag and drop:ttp://www.walterzorn.com/dragdrop/dragdrop_e.htm) and one of the properties included is the ability to hide or show divs and images that have been made draggable, using the the following methods: if (window.dd && dd.elements)dd.elements.divID.show()and if(window.dd && dd.elements) dd.elements.divID.hide()I'm wondering if I wanted to make a single button that toggled between hiding and showing a DIV....how would I combine the two methods in a single onclick event, to toggle visibility? They both work perfectly as separate events on different buttons but I cannot figure out how to combine them. Any help would really be appreciated. I'm hope there's some way to do this w/ the "else" statement but I don't know the proper syntax.
View 1 Replies
View Related
Oct 11, 2006
I have been looking for the past 2 days for a script that I can add and delete table rows.
I have found a lot but so far all of them add an input field but I desperatly need a textarea or ideally a section of input fields.
I have tried to change the code from input to text area but none of them worked.
Have you come across to a similar script.
I would appreciate any contributions.
What I am trying to do is a page where the user will add their employees details so we can order business cards for them. So I have fileds such as, Name, Tel Num, Email, Cell etc.
View 4 Replies
View Related
Jan 24, 2011
I have this order form where the customers can change the quantity by intput in a text field.I would like to have the text field changed with select fields, but doing so in the form, the script is not doing anymore.Can anyone have a look and tell me what to change in the scritp to accept select fields in place of the text fields.
View 5 Replies
View Related
Jun 22, 2009
I've been searching for about an hour now trying to figure out how to do the following. I have a form I'm updating and I'm trying to create a checkbox or link that onclick/oncheck will update all fields in the form to the same value. I found the following code that does what I want EXCEPT I can't get it work with value[]. In the following code, MY form would have form fields like <input type="text" name=" shippingname []"> (note the []) because I'm looping thru multiple entries when I submit the form.
View 1 Replies
View Related
