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]...
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]...
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.
I'm using the following css code which wrapped around a dynamically populated field;<span class="ui-widget-header platform ui-corner-all"></span>
When the span is empty I want to hide it, and I've used this jquery to do this.
However, the ui-widget-header class appears to be stopping it from hiding - if I remove this class it hides fine.
I want to prevent submitting a form if any of the field is empty. also if possible I would like to validate some basic things. All I want to use JQuery: How do I do that? I have no way and google points me to plugins. The things I want to do are lightweight and I don't need plugin Here is my form:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Login in Site</title>
<link rel="stylesheet" type="text/css" href="/loginsys/site.css" />
[Code]...
I am trying to test a form whether the fields are empty or not. If so, displays warning, doesn't proceed. Here is my javascript , and the forms.
/* Validate Forms */
function validate(){
var notify = document.getElementById('notification1');
if ( null == document.getElementById('usrname').value ||
[Code]....
The problem is it works only for the passwd, but not for the usrname, meaning when the username is empty it shows the message as i wanted but right after showing the notification, it is going to the action page. Since it is returning false, it is not supposed to proceed. For passwd, it is fine, it shows the warning and stops without proceeding action.jsp.
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.
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]...........
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 RelatedI'm using a Javascript gallery (runs on Prototype library) that populates a caption field if the user has entered a caption for an image.
I need a little bit of code to hide the caption's div entirely if the user hasn't entered a caption for a particular image (var 'caption' is empty).
It's the bottom-right white box below the image, you'll have to click over to the second page of the gallery (NEXT) to see an example of an empty one that I want to hide:
[url]
Here's the CSS:
Here's the HTML:
I'm sure this isn't that hard, but I've spent more time trying to get that caption box to hide than setting up the gallery.
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!
<form name="form2" onSubmit="validateForm2()" action="" method="POST">
<table>
<tr>
<td> <select name="smonth"> <!--some options--> </select></td>
<td><input readonly="readonly" name="day" type="text" size="23"></td>
</tr>
[Code]...
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 ?
Is there a way of hiding a whole table row if a certain cell inside it is empty?
View 8 Replies View RelatedI 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,
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...
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]....
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 RelatedI am using the validate plugin with the defaultvalue plugin (empty fields given a default value and class of empty), and would like to use it together with the validator plugin. Is there a way to mark required fields with only the default value (and class empty) as invalid on submit?
E.g.: First_name field is required by validate, has a default value of "Enter your first name" and class of "empty" - how can I get the validator to mark this as invalid?
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
}});});
Hi everyone !
Here is my issue,I want to highlight the differents inputs within a form The script works perfectly with Google Chrome, but with Firefox and I.E the current input selection do not highlight .
[Code]...
I am building a registration page . If the user completes all the required field i load the info into the database but if there are missing fields I combined some javascript into php to display next to the empty field a note that it should be filled. This is my code...
View 3 Replies View RelatedThere 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 RelatedI am having a dickens of a time figuring out how to add an event handler that clears my text fields when the clear button is clicked. This is the code that I've done but to no avail.
var $ = function (id) {
return document.getElementById(id);}
var calculate_click = function () {
var investment = parseFloat( $("investment").value );
var annualRate = parseFloat( $("rate").value );
var years = parseInt( $("years").value );
$("futureValue").value = "";
if (isNaN(investment) || investment <= 0) {
alert("Investment must be a valid number\nand greater than zero.");
} else if(isNaN(annualRate) || annualRate > 20) {
alert("Annual rate must be a valid number\nand less than or equal to 20.");
} else if(isNaN(years) || years > 50) {
alert("Years must be a valid number\nand less than or equal to 50.");
} else {
var monthlyRate = annualRate / 12 / 100;
var months = years * 12;
var futureValue = 0;
for ( i = 1; i <= months; i++ ) {
futureValue = ( futureValue + investment ) *
(1 + monthlyRate);
}
$("futureValue").value = futureValue.toFixed(2);
}}
var clear_click = function () {
var investment = parseFloat();
var annualRate = parseFloat();
var years = parseInt();
}
window.onload = function () {
$("calculate").onclick = calculate_click;
$("investment").focus();
}
I'm trying to select my textarea only if it is not empty. I have used :empty for this purpose. This works find when you load the page, however if you start typing in it still considers the value as it was when the page loads.
Example. If my textarea is empty when I load the page, it will consider it empty. If I starting typing in, and check if it is empty it still say it is empty.
The same vice versa. If my textarea has text when the page loads, then i clear that data, it still consider it filled not empty.
So how to make the check of :empty in real time?
I am trying to check and see if three fields are empty and if they are then to alert the user saying to fill in one of the three fields. I tried this:
if (StreetNumber.value.length == 0) {
if (StreetName.value.length == 0) {
if (City.value.length == 0) {
alert("Please enter a street number, street name, or city.");
[Code]....
