JavaScript - Need Award Field To Have 4-5 Characters Or Error Is Displayed

Hi All,

In one of my php page I have a form where I am displaying a table. The First row is having the drop down and the second row is a text field. Now the problem is that based on the drop down value choosed I have to set some field in text field. For this I am calling a javascript function but when I am trying to set the value in the text field which is still not into picture when this function is called it is showing the error that the field is not defined.

Can Anyone tell how I can get access to a field which is yet not defined.
I even tried to make a hidden field before drop down and tried to set some value for that still I am facing the same problem.

Can anyone help me out ...

hiiii,
im new to javascripts . Can anyone help me to know that a javascript which is validating a phone number accepts only digits but if the text field is left empty it should accept the entry as an empty entry....


plz share knowledge u will be more knowledgeable

Hi folks.

Looking to see if anyone could tell me where I'm going wrong with this script...

I'm trying to have a field automatically filled with the day of the week ("Monday", "Tuesday", "Wednesday" and so on), upon the user selecting a date from the datepicker jQuery. If this isn't clear, I'll clarify further down the page.

Here is the script:
Code:

<script type="text/javascript">
jQuery(document).ready(function($){
$('input[name="item_meta[428]"]').change(function(){
var d = $('input[name="item_meta[428]"]').val();
var n = new Date(d).getDay();
if(n == 0)
val v = 'Sunday';
else if(n == 1)
val v = 'Monday';
else if(n == 2)
val v = 'Tuesday';
else if(n == 3)
val v = 'Wednesday';
else if(n == 4)
val v = 'Thursday';
else if(n == 5)
val v = 'Friday';
else if(n == 6)
val v = 'Saturday';
$('input[name="item_meta[429]"]').val(v).change(); 
});
});
</script>

I'm basically trying to say, if the user selected today (15/05/2012) in the field 428 it would fill the field 429 with "Tuesday".

Again, if the user selected 18/05/2012 in the field 428 then it would automatically fill field 429 with "Friday".

It's being done to work in conjunction with a wordpress plugin called Formidable Pro hence the item_meta[428] etc.

Any assistance would be greatly appreciated.

Sam.

I have a text field, call it income, that when the input is > 0 I need to dynamically show the next text box, and if it is blank hide the next text box. I would like to use onBlur but can't seem to get it to work.

Can I do this?

Help

Hi, I tried displaying few images as MENU using Javascript. These images are showed normally in Firefox and chrome except Internet Explorer. Help plz

Code:

function my_fav_quote_show_optin_form() {	

	if (!empty($_POST['my_fav_quote_email'])) {
	
		my_fav_quote_opt_in();
	}
		$out2 = '';
		
		$out = '<form action="" name="myform "method="post" id="requestQuote">';
		$out .= '<table style="padding="0px" width="40px">';
		$out .= '<tr><td>Name:*</td><td><input type="text" name="my_fav_quote_name" id="my_fav_quote_name"/></td></tr>';
		$out .= '';
		$out .= '<tr><td>Email:*</td><td><input type="text" name="my_fav_quote_email" id="my_fav_quote_email"/></td></tr>';
		
$out .= '';
		$out .= '<tr><td>Phone:*</td><td><input type="text" name="my_fav_quote_phone" id="my_fav_quote_phone"/></td></tr>';

$out .= '';

$out .= '<tr><td>Event Date(optional):</td><td><input type="text" name="my_fav_quote_date" id="my_fav_quote_date"/></td></tr>';
		$out .= '';

$out .= '<tr><td>Estimated Number of Guests(optional):</td><td><input type="text" name="my_fav_quote_guest" id="my_fav_quote_guest"/></td></tr>';
		$out .= '';

$out .= '<tr><td>Desired Price Range Per Person (optional):</td><td><input type="text" name="my_fav_quote_rate" id="my_fav_quote_rate"/></td></tr>';
		$out .= '';
		$out .= '<tr><td style="vertical-align: middle;">Message:<br>(List your special requests, any food allergies , event description , special menu items that are not listed or any other information you think will helpful) </td><td><textarea placeholder=""  name="my_fav_quote_message" id="my_fav_quote_message"></textarea></td></tr>';
		$out .= '';
		$out .= '<tr><td>Security code:*</td><td><img src='.get_bloginfo('wpurl').'/wp-content/plugins/quote-cart/captcha.php?width=60&height=30&characters=5" /></td></tr>';
		$out .= '';
		$out .= '<tr><td>Input Above Security Code He *</td><td><input type="text" name="security_code" id="security_code" size="5"></td></tr>';
		$out .= '';

		$out .='<tr><td colspan="2">';
		if ( function_exists( 'my_fav_quote_display' ) ){
			$out .= my_fav_quote_display();
		}



		if ( function_exists( 'my_fav_quote_display3' ) ){
			$out .= my_fav_quote_display3();
		}
		
		
		$out .='</td></tr>';
		$out .= '<tr><td colspan=2 align=center><input type="submit" value="Request Quote" onclick="return chk_validation()" style="background-color:#000;color:#FFF;padding:5px;margin-top:10px;border:none;cursor:pointer;"/>  
		<input type="button" onclick="formReset()" value="Reset form" />

</td></tr>';
		
		$out .='</table></form>';
		echo $out;
		?>
			<script language="javascript" type="text/javascript">
		//<![CDATA[
				function validate_email(field,alerttxt)
				{
				
				  apos=field.indexOf("@");
				// alert(apos);
				  dotpos=field.lastIndexOf(".");
				   //alert(dotpos);
				  if (apos<1||dotpos-apos<2)
					{ return false;}
				  else {return true;}
				  
				}
				function chk_validation()
				{
					if(document.getElementById("my_fav_quote_name") && document.getElementById("my_fav_quote_name").value == '')
					{
						alert("Please Enter Name");
						document.getElementById("my_fav_quote_name").focus();
						return false;
					}
					
					if(document.getElementById("my_fav_quote_email").value == '')
					{
						alert("Please Enter Email");
						document.getElementById("my_fav_quote_email").focus();
						return false;
					}
					else
					{
					
					//alert(validate_email(document.getElementById("my_fav_quote_email").value,"Not a valid e-mail address!");
						if (validate_email(document.getElementById("my_fav_quote_email").value,"Please enter valid e-mail address!")==false)						{
						alert("Please enter valid e-mail address!");
						document.getElementById("my_fav_quote_email").focus();
						return false;
						}
					}
					if(document.getElementById("security_code").value == '')
					{
						alert("Please Enter Security Code");
						document.getElementById("security_code").focus();
						return false;
					}
					if(document.getElementById("quotes").value == '')
					{
						alert("Please add atleast one request quote");
						document.getElementById("quotes").focus();
						return false;
					}
					//return true;
				}

				
				
				//]]>
	
			</script>
<?php

}

can we reset the display functions data when we click on reset button?

Hello everyone!
Hi, I am a complete beginner at Javascript(started a few days ago) and was having trouble with some functions. I'm trying to get the inputs required to change based on an option selected in a drop down menu. I was intending to run different scripts based on whatever is chosen but when I ran a test using an alert function, I realized my code isn't working. I went online and found really confusing stuff like "running a for loop through an array to make a dynamic select feature". Still confused any help would be appreciated.
My code thus far:

Code:

<html>
<head>
<title>Practice</title>
<script language="javascript">
function myScript()
{
var loanType = document.form1.loan.options.text
if (loanType == "Bank A")
{
alert("Working")
}
}
</script>
</head>
<body>
<form name="form1">
<select id="loan" name="loan" onchange="myScript">
<option></option>
<option>Bank A</option>
<Option>Bank B</Option>
</select>
</form>
</body>
</html>

Reply With Quote




01-29-2015, 12:02 PM #2
vwphillips View Profile View Forum Posts Visit Homepage

Senior Coder Join Date Mar 2005 Location Portsmouth UK Posts 4,540 Thanks 3 Thanked 513 Times in 500 Posts

Code:

<html>
<head>
<title>Practice</title>
<script language="javascript">
function myScript()
{
var s=document.form1.loan,loanType = s.options[s.selectedIndex].text
if (loanType == "Bank A")
{
alert("Working")
}
}
</script>
</head>
<body>
<form name="form1">
<select id="loan" name="loan" onchange="myScript();">
<option></option>
<option>Bank A</option>
<Option>Bank B</Option>
</select>
</form>
</body>
</html>

or better

Code:

<html>
<head>
<title>Practice</title>
<script language="javascript">
function myScript(s)
{
if (s.value == "Bank A")
{
alert("Working")
}
}
</script>
</head>
<body>
<form name="form1">
<select id="loan" name="loan" onchange="myScript(this);">
<option></option>
<option value="Bank A" >Bank A</option>
<Option value="Bank B">Bank B</Option>
</select>
</form>
</body>
</html>

Can anyonle pls explain me why the return function is not returning the result as intended? I appreciate you help


OUTPUT
======

Student : Doe,John
eMail : johndoe@gmail.com
Course ID : COIN-070B.01
--------------------------------
function task() { var title = ["Assignment1", "Assignment2", "Assignment3", "Assignment4", "Assignment5", "Mid Term", "Finals"]; var points = [30, 30, 28, 27, 29, 41, 45]; for (var i = 0; i < points.length; i++) { titlePoints += title[i] + (" : " + points[i] + "\n"); } return titlePoints; }


Code:

<head>
<title>Variable - Examples 1</title>
   <script type="text/javascript">
	function Student(firstName, lastName, email,courseID){
		this.firstName = firstName;
		this.lastName = lastName;
		this.email = email;
		this.courseID = courseID;
                 this.assignments = task; 
	}
	
	Student.prototype = {
		constructor : Student,
		toString : studentInfo
	};
	
	 function task(){
		var title = ["Assignment1","Assignment2","Assignment3","Assignment4","Assignment5","Mid Term", "Finals"]
		var points = [30, 30, 28, 27, 29,41,45];
                var titlePoints = "";
		for (var i=0; i < points.length; i++){
			titlePoints += title[i] + " : " + points[i] + "\n";
		}
		return titlePoints; 
	} 
	
	
	function studentInfo(){
			 return "Student : " + this.lastName + "," + this.firstName + "<br>"+ "eMail : " + this.email + "<br>" + "Course ID : " + this.courseID + "<br>" + "--------------------------------" + "<br>" + this.assignments;
	}
	var student = new Student("John", "Doe", "johndoe@gmail.com","COIN-070B.01");
	
   </script>
</head>
<body>
	<script type="text/javascript">    
		document.writeln(student.toString());
	</script>
</body>
</html>

Hello.
I have a <div> html element which contains other html tags, as well as plain text inside those tags. How do I grab only the content within the div that will actually be displayed in the browser, and put it in a Javascript string variable?

Thanks in advance.

Hi Experts,

I have designed an online registration system for a non profit in ASP/SQL. After the members register for classes they are automatically redirected to an invoice page with class fees. At the bottom of the page I have a Total Fees field of all the classes. The member is supposed to pay this amount to our organization.

Question:
We decided to do an online payment this year and would like to calculate a 2% additional amount on the Total Fees. This amount is paid to the Payment Merchant site. We cannot afford to lose the 2% since we are a non profit.

Would really appreciate if someone can tell me how to
1) Add a new field under the Total field
2) And calculate the 2% additional fees and do a Grand Total.

Thanks in advance.

I have two drop down fields. When I select any value in the first drop down i want the second dropdown to automatically populate the value related to the first one. For e.g i have the first field as name and the second field as measured in. If I select 'Potato' in the first dropdown then the second drop down should populate 'kg'. Please help.

Hi, I am a complete beginner at Javascript(started a few days ago) and was having trouble with some functions. I'm trying to get the inputs required to change based on an option selected in a drop down menu. I was intending to run different scripts based on whatever is chosen but when I ran a test using an alert function, I realized my code isn't working. I went online and found really confusing stuff like "running a for loop through an array to make a dynamic select feature". Still confused any help would be appreciated.
My code thus far:
<html>

<head>

<title>Practice</title>
<script language="javascript">
function myScript()
{
var loanType = document.form1.loan.options.text
if (loanType == "Bank A")
{
alert("Working")
}

}

</script>

</head>

<body>
<form name="form1">
<select id="loan" name="loan" onchange="myScript">
<option></option>
<option>Bank A</option>
<Option>Bank B</Option>
</select>
</form>
</body>
</html>





Reply With Quote




01-08-2015, 10:52 AM #2
Primus View Profile View Forum Posts

New Coder Join Date Oct 2014 Posts 92 Thanks 0 Thanked 14 Times in 14 Posts

Code:

<script>
    function myScript()
	{
		var selectedIndex = document.form1.elements.loan.options.selectedIndex; // returns 0-2 in this case
		var loanType = document.form1.elements.loan.options[selectedIndex].value; // returns the value of the selected item
		if (loanType == "Bank A")
		{
			alert("Working")
		}

	}	
</script>
<form name="form1">
<select id="loan" name="loan" onchange="myScript()">
<option></option>
<option>Bank A</option>
<option>Bank B</option>
</select>
</form>

Maybe not the best way, but it does the trick.





Reply With Quote

01-08-2015, 11:43 AM #3
Philip M View Profile View Forum Posts

Supreme Master coder! Join Date Jun 2002 Location London, England Posts 18,371 Thanks 204 Thanked 2,573 Times in 2,551 Posts

You have quite a lot of obsolete code:-

1) It is obsolete to assign a name to a form and permitted only for the sake of backwards compatibility.
2) <script language=javascript> is long deprecated and obsolete. Use <script type = "text/javascript"> instead (in fact also deprecated but still necessary for IE<9).
3) Scripts should normally be placed right in front of the </body> tag. Any script can optionally go in the head if you wrap it inside a load event listener so that it can't run before the page loads.
4) Use the value of a select box option, not the text.
5) It is recommended that you place the opening brace following the function, if, else, for, while, do, switch, and try statements on the same line and not on the following line. Apart from that every Javascript statement should be followed by a semi-colon (;). It is quite possible to disregard this advice, but if you do one day it will rise up and bite you in the undercarriage.


Code:

<html>
 <head>
 <title>Practice</title>
 </head>

 <body>
 <form>
 <select id="loan" name="loan" onchange="myScript()">
 <option value = "">Chosoe...</option>
 <option value = "Bank A">Bank A</option>
 <Option value = "Bank B">Bank B</Option>
 </select>
 </form>

<script type = "text/javascript">

 function myScript()  {
 var loanType = document.getElementById("loan").value;
 if (loanType == "Bank A")  {
 alert("Working")
 }
 }

 </script>

 </body>
 </html>

If you really want to use the option text ...

Code:

<html>
 <head>
 <title>Practice</title>
 </head>

 <body>
 <form>
 <select id="loan" name="loan" onchange="myScript(this)">
 <option value = "">Choose...</option>
 <option value = "Bank A">Bank A</option>
 <Option value = "Bank B">Bank B</Option>
 </select>
 </form>

<script type = "text/javascript">

function myScript(element)  {
var loanType = element.options[ element.selectedIndex ].text;
if (loanType == "Bank A")  {
alert("Working")
}
}

 </script>

 </body>
 </html>

The Warrington players can hang their heads high. - Commentator, BBC Radio 2

Hello,
I am fairly new to javascript so patience is appreciated. I have some javascript I need to execute that is located in an SSI footer. The purpose of the code is to find out what domain the page was loaded at and then to tailor some links to match. Because of how the hosting environment is set up (which I have no control over) when the links don't match the domain they aren't included. I also have to use a complete url (as opposed to relative url) because the footer is included in many different web pages. The problem is that the code is executed but it also is displayed as plain text in firefox. The test site is http://test.ci.edina.mn.us

Help!

The code is:
Code:

<script type="text/javascript">
  var domainName, strOut;
  domainName = document.domain;
  strOut = '<link rel="stylesheet" type="text/css" href="http://' + domainName + '/js/jquery.fancybox/jquery.fancybox.css" media="screen" />';
  document.write(strOut);
  strOut = '<script src="http://' + domainName + '/js/jquery-1.3.2.min.js" type="text/javascript"></script>';
  document.write(strOut);
  strOut = '<script src="http://' + domainName + '/js/jquery.fancybox/jquery.fancybox-1.2.1.js" type="text/javascript"></script>';
  document.write(strOut);
  strOut = '<script src="http://' + domainName + '/js/jquery.easing.1.3.js" type="text/javascript"></script>';
  document.write(strOut);
</script>

Hi, I am new to this forum but I am in dire need of help. I am sorry if this isn't they way you normally do things. I read through some of the rules, but it is late and I am in a hurry. Any help would be greatly appreciated.

I need the image file names in my array to be shown in the text box. I am not quite sure how to do this. I have been trying for some time but cannot figure it out. Here is my code.

<head>
<title>Asn4CStartup.htm by Todd Bowman</title>
<style type="text/css" >
h1, h2, h3 {font-family: 'arial black';}
.controls { font-family: 'arial black'; font-size:10pt;}
</style>
<script type="text/javascript">
/* <![CDATA[ */
// Note: variables declared inside a function
// using the var keyword are all local variables. It means that these
// variables are only known inside the function. Other functions cannot see
// the values.
// On the other hand if a variable is declared outside any function, these are global
// variables. The values of global variables are available in all other functions.
// Other function can change the values of global variables.

// Declare a global var n:
var n=0; // we will use this global variable to keep track of exactly which element of the array
// is being displayed now. When the user clicks Next button, we will add 1 to n and
// then display the image file in the nth element of the array

// Declare a global array that will contain the names of image files.
var imgArray = new Array();

// The following function will be triggered on the onload event of the page.
function fillArray()
{
// alert ("Hello on load");
imgArray[0]="Bus1.jpg";
imgArray[1]="Bus2.jpg";
imgArray[2]="Fam1.jpg";
imgArray[3]="Fam2.jpg";
imgArray[4]="Honey1.jpg";
imgArray[5]="Honey2.jpg";
imgArray[6]="Map1.png";
// for ( i in imgArray)
// alert (imgArray[i]);

}

function showNext()
// This function will be triggered on click of the Next button
{ // alert ("Hello showNext");
// alert(n);
n = n+1;
//alert (n);
if (n > imgArray.length-1)
{ alert ('You are already on the last image');
n = n-1;
}
else
document.getElementById('imgPic').src='images/'+imgArray[n];

} // end showNext()

function showPrevious()
// This function will be triggered on click of the Previous button
{
// alert("Hello Previous");
// alert(n);
n = n-1;
// alert (n);
if (n < 0)
{ alert ('You are already at the first image');
n = n+1;
}
else
document.getElementById('imgPic').src='images/'+imgArray[n];
} // end showPrevious()
function showFirst()
//This function will be triggered on click of the First button
{

// alert (n);
if (n == 0)
{ alert ('You are already on the first image');
}
else
document.getElementById('imgPic').src='images/'+imgArray[0];
}
function showLast()
{
// alert (n);
if (n > imgArray.length-1)
{ alert ('You are already on the last image');
}
else
document.getElementById('imgPic').src='images/'+imgArray.length-1;
}
/* ]]> */
</script>
</head>

<body onload="fillArray();">
<div>
<h1> Asn4CStartup.htm by Mesbah Ahmed </h1>
<h2>Windsurf Image Navigation </h2>
Name of the image file shown below: &nbsp <input type="text" id="imageName" size="20" readonly="readonly" /> <br/><br/>

<img id="imgPic" src = "images/Bus1.jpg" alt="picture" width="500px" height="350px" /> <br/>
<input type="button" value="Next" class="controls"
onclick="showNext();" />
<input type="button" value="Previous" class="controls"
onclick="showPrevious();" />
<input type="button" value="First" class="controls" onclick="showFirst();" />
<input type="button" value="Last" class="controls" onclick="showLast();" />
<br/>
<p>
<img src="http://www.w3.org/Icons/valid-xhtml11.png"
alt="Valid XHTML 1.1!" height="31px" width="88px" />

<img src="http://jigsaw.w3.org/css-validator/images/vcss-blue.png"
alt="Valid CSS!" height="31px" width="88px" />
</p>
</div>
</body>
</html>

Good Day,

I am very new to JavaScript and I am working on an assignment that is almost finished, but I have a problem getting the result to work. When I enter the two values and then hit submit, nothing is returned. I am guessing that either my code is incorrect or I have used the wrong ids maybe.

Basically, the user enters 2 parameters (hourly wage and hours worked) and the first function turns the parameters into the gross pay (depends on if the hours are standard pay or if overtime is involved).

The second function takes the gross pay and does the tax amounts for local, state and federal. Then it adds all taxes to give a total of tax amount paid.

The input for the parameters is done by <input> tag. The return reslut is supposed to be just the number which is the total amount of taxes to be taken out. This all has to be done by <input> tags.

Could someone look over the html and JS and help me find where the problem is at. The instructor said we could use ? : operator for determining the pay rates, but I found it easier to do if/else staements because I was not sure how you would script that. Any help would be great.

Thanks

HTML Code
Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Calculate Tax Amount</title>
<link href="style.css"  rel="stylesheet" type="text/css">
<script type="text/javascript" src="calculateGross.js"></script>
<script type="text/javascript" src="calculateTax.js"></script>

</head>

 <body>
 <table width="60%" border="0" cellpadding="0" cellspacing="2" align="center" class="view">
  <tr>
  	<td colspan="3" class="textview">Calculate the gross pay:</td>
	 
  </tr>
  <tr>
    <td class="labeltext">Pay rate(dollars per hour)</td>
	<td>:</td>
    <td><input type="text" name="payrate" id="payrate" class="textval"></td>
  </tr>
  <tr>
    <td class="labeltext">Hours worked</td>
	<td>:</td>
    <td><input type="text" name="hours" id="hours" class="textval"></td>
  </tr>
   <tr>
    <td colspan="3" align="center"><input type="button" name="" value="Submit" onclick="return calculate(); "> 
    </td>
  </tr>
</table>
<br>
<br>
<table width="60%" border="0" cellpadding="0" cellspacing="2" align="center" class="view">
  <tr>
  	<td colspan="3" class="textview">Total Tax Paid:</td>
	 <tr>
	 	</tr>
    <td class="labeltext">Grand Total of Taxes</td>
	<td>:</td>
    <td><input type="text" name="total" id="totalTax" class="textval" disabled="disabled"></td>
  </tr>
  </table>
</body>
</html>

First Function JS
Code:

function calculate() {  

	var payRate = document.getElementById("payrate").value;
	var hoursWorked = document.getElementById("hours").value;
	var oTime;
	var oPay;
	var oHour;
	var grossPay;
	
	if(hoursWorked > 40)
	{
		oTime	=	 Number ( hoursWorked ) - 40;
		oPay	=	 Number ( ( payRate ) * 1.5 ) * oTime;
		oHour	=	 Number ( hoursWorked )- Number ( oTime );

	    grossPay	=	 Number ( payRate ) * Number ( oHour )
		 + Number ( oPay );
	}
	else 
 
 		grossPay	=	 Number ( hoursWorked ) * Number ( payRate );
		
}

The second function JS
Code:

function calculateTax(gross) {
	
	var gross;
	var localTax;
	var localTaxBal;
	var stateTax;
	var stateTaxBal;
	var fedTax;
	var fedTaxBal;
	var totalTax;
	
	localTax    = Number ( gross ) * 2/100;
	localTaxBal = Number ( gross ) - Number ( localTax );
	
	stateTax    = Number ( localTaxBal ) * 8/100; 
	stateTaxBal = Number ( localTaxBal ) - Number ( stateTax );
	
	fedTax    	= Number ( stateTaxBal ) * 31/100;
	fedTaxBal 	= Number ( stateTaxBal ) - Number ( FedTax );
	
	totalTax	= Number ( localTax.toFixed(2) ) + Number ( stateTax.toFixed(2) ) + Number ( fedTax.toFixed(2) );
	 
	return totalTax.toFixed(2);
	
}