|
JavaScript - Creating A Payment Form Which Calculates Prices
Hi,
Im looking to make a payment form that calculates the prices as you go along, similar to this i just dont know how to go about it, is there software that can be used? thanks alot, Dan Similar TutorialsHi everyone, I am converting a program that displays the payment options as a list of check boxes to a drop down list. I have tried using onBlur(), etc. but the program is displaying my error that says I didn't select a payment method. Here is the code, thanks for any hints or help! Code: <html>
<head>
<title>Order form</title>
<meta http-equiv="Content-Type" content="text/javascript">
<script type="text/javascript">
function total()
{
var subtotal=0;
var total=0;
var adjustment=1;
payment=false;
var elmnts=document.payform.elements;
for (var x=0; x<(document.payform.elements['item[]'].length); x++)
{
if (document.payform.elements['item[]'][x].checked)
{
subtotal=subtotal+parseFloat(document.payform.elements['item[]'][x].value);
}
}
for (var x=0; x<(document.payform.pay.length); x++)
{
if (document.payform.pay[x].checked)
{
adjustment=document.payform.pay[x].value;
payment=true;
}
}
if (payment)
{
total=subtotal*adjustment;
total = total.toFixed(2);
document.payform.display.value="subtotal: "+subtotal+"\rAdjustment: "+adjustment+"\rTotal: "+total;
}
else
{
window.alert("Please choose payment type.");
}
}
</script>
</head>
<body>
<form name="payform">
<table border="0" cellpadding="5">
<tr>
<td width="250" valign="top">
<b>Please buy some stuff!</b><br />
<input type="checkbox" name="item[]" value="14.99" />Chang $14.99<br />
<input type="checkbox" name="item[]" value="12.99" />Chartreuse verte $12.99<br />
<input type="checkbox" name="item[]" value="13.99" />Gnocchi di nonna Alice $13.99<br />
<input type="checkbox" name="item[]" value="14.99" />Gudbrandsdalsost $14.99<br /><br />
<b>Choose payment methods</b><br />
<select name = "pay" size = 0>
<option value = "0"></option>
<option value = "1.2">Monday order (20% service charge)</option>
<option value = "1.1">Personal check (10% service charge)</option>
<option value = ".8">Visa (preferred -- 20% discount)</option>
<option value = "1.2">MasterCard (10% discount)</option>
<option value = "1.2">Discover (10% discount)</option>
</select>
<br /><br />
<input type="button" value="Process Order" onClick="total()" />
<input type="reset" value="Reset Form" />
</td></tr>
<tr>
<td width="200" valign="bottom">
<textarea name="display" rows="5" cols="35"></textarea></td>
</tr>
</table>
</form>
</body>
</html>
I am no javascript expert, very much a beginner. I am trying to incorporate some into a web-based form. The problem is the button I created to add extra fields does not work, and I can't find exactly where the problem is. I'm in need of some help from a javascript guru. Help me enjoy my Friday afternoon by solving this! The javascript is mostly borrowed and slightly altered, the "additem" I wrote myself so that is probably where the problem lies! Here is the html: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1"/>
<title></title>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/>
<link rel="stylesheet" type="text/css" href="style.css"/>
<script type="text/javascript">
function showAsset(id,str)
{
if (str=="")
{
document.getElementById("assetinfo"+id).innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("assetinfo"+id).innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","getasset.php?q="+str,true);
xmlhttp.send();
}
var noFields = "5";
function additem()
{
var fieldrow = document.createElement('tr');
var fieldcolumn1 = document.createElement('td');
var fieldinput = document.createElement('input');
fieldinput.name = "asset";
fieldinput.onChange = "showAsset("+noFields+",this.value)";
var fieldcolumn2 = document.createElement('td');
fieldcolumn2.id = "assetinfo"+noFields;
fieldcolumn1.appendChild(fieldinput);
var fieldcolumns = fieldcolumn1 + fieldcolumn2;
fieldrow.appendChild(fieldcolumns);
var addbefore = document.getElementById('fieldend');
document.body.insertBefore(fieldrow, addbefore);
noFields = noFields++;
}
</script>
</head>
<body>
<form>
<table>
<tr>
<td><input name="asset" onChange="showAsset(1,this.value)"></td>
<td id="assetinfo1"></td>
</tr>
<tr>
<td><input name="asset" onChange="showAsset(2,this.value)"></td>
<td id="assetinfo2"></td>
</tr>
<tr>
<td><input name="asset" onChange="showAsset(3,this.value)"></td>
<td id="assetinfo3"></td>
</tr>
<tr>
<td><input name="asset" onChange="showAsset(4,this.value)"></td>
<td id="assetinfo4"></td>
</tr>
<tr>
<td><input name="asset" onChange="showAsset(5,this.value)"></td>
<td id="assetinfo5"></td>
</tr>
<tr id="fieldend">
<td><input id="addfield" type="button" value="add item" onClick="addfield()"></td>
</tr>
</table>
</form>
</body>
</html>
Here is the associated getasset.php: Code: <?php
$q=$_GET["q"];
$con = mysql_connect('localhost', 'root', 'root');
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("assettracking", $con);
$sql="SELECT * FROM assets WHERE assetID = '".$q."'";
$result = mysql_query($sql);
while($row = mysql_fetch_array($result))
{
echo "<b>".$row['make'] ." ".$row['model'] ." - ".$row['serialnumber']."</b> | Status: ".$row['statusID']." | Comments: ".$row['comments'];
}
mysql_close($con);
?>
I'm a non-web programmer being forced to do some web programming. My immediate problem is that, on submission of a form, I need to be able to open a url (that I control) with the filled-in form values appended to the new url. In other words, I need to be able to do the equivalent of : Code: <form>
<input name="key1" type="text"/>
<input name="key2" type="text"/>
<input type="button" value="Submit" onclick="window.open('http://new.domain.com/newpage.html?key1=val1&key2=val2')"/>
</form>
I would really like to do this without server-side code. Pointers? TIA 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" xml:lang="en" lang="en">
<head>
<title>
Project 2
</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="content-language" content="en-us" />
<link rel="stylesheet" href="../jsfiles/js_styles.css" type="text/css" />
<script type="text/javascript">
/* <![CDATA[ */
function checkForNumber(fieldValue) {
var numberCheck = isNaN(fieldValue);
if (numberCheck == true) {
window.alert("You must enter a numeric value!");
return false;
}
return true;
}
function calculate()
var shipping = 0;
var total = 0; {
if (document.forms[0].hand_tool.value != document.forms[0].hand_tool.value == true)
(document.forms[0]item1.value == 20); {
&& document.forms[0].shipping.value == (shipping + 5); {
&& (document.forms[0].total.value = document.forms[0].hand_tool.value + document.forms[0].shipping.value)
}
}
function confirmSubmit() {
if (document.forms[0].first_name.value = "null") {
window.alert("You have not entered the requested Customer Information.");
return false;
}
else if (document.forms[0].last_name.value = "none" || document.forms[0].city.value = "" || document.forms[0].state.value = "none") {
window.alert("You have not entered the requested Customer Information.");
return false;
}
var pmntMethod = false
for (var j=0; j<3; ++j) {
if (document.forms[0].credit_card[j].checked == true) {
pmntMethod = true;
break;
}
}
if (pmntMethod != true) {
window.alert("You must select a method of payment.");
return false;
}
return true;
}
function confirmReset() {
var resetForm = window.confirm("Are you sure you want to reset the form?");
if (resetForm == true)
return true;
return false;
}
/* ]]> */
</script>
</head>
<body>
<!-- Your XHTML here -->
<h1>Purchase Order</h1>
<form action="FormProcessor.html" method="get" enctype="application/x-www-form-urlencoded" onsubmit="return confirmSubmit();" onreset="return confirmReset();">
<h3>Products</h3>
<table>
<tr>
<td>
<p>Hand Tools <br />$20.00<img src="handtools.gif" alt="Hand Tools" class="img" /></p>
</td>
<td>
<select name="hand_tool" size="1">
<option value="hand_tool">Hand Tool</option>
<option value="saw">Saw</option>
<option value="hammer">Hammer</option>
<option value="screwdriver">Screwdriver</option>
<option value="wrench">Wrench</option>
<option value="pliers">Pliers</option>
</select>
</td>
<td>
<p>Power Tools <br />$30.00<img src="powertools.gif" alt="Power Tools" class="img" /></p>
</td>
<td>
<select name="power_tool" size="1">
<option value="power_tool">Power Tool</option>
<option value="circular_saw">Circular Saw</option>
<option value="sabre_saw">Sabre Saw</option>
<option value="drill">Drill</option>
<option value="belt_sander">Belt Sander</option>
<option value="table_saw">Table Saw</option>
</select>
</td>
</tr>
</table>
<h3>Shipping Fees</h3>
<table>
<tr>
<td>Item 1: <input type="text" name="item1" value="" onchange="calculate();" /></td>
<td>Item 2: <input type="text" name="itme2" value="" onchange="calculate()" /></td>
</tr>
<tr>
<td>Shipping: <input type="text" name="shipping" value="" /></td>
<td>Total: <input type="text" name="total" value="" /></td>
</tr>
</table>
<h3>Customer Information</h3>
<p>First Name
<input type="text" name="first_name" value="FirstName" onclick="document.forms[0].first_name.value = '';" onchange="confirmSubmit();"/>
Last Name
<input type="text" name="last_name" value="LastName" onclick="document.forms[0].last_name.value = '';" onchange="confirmSubmit();" /></p>
<p>Street Address 1
<input type="text" name="address1" value="Address1" onclick="document.forms[0].address1.value = '';" onchange="confirmSubmit();" /></p>
<p>City
<input type="text" name="city" value="City" onclick="document.forms[0].city.value = '';" onchange="confirmSubmit();" />
State
<input type="text" name="state" value="State" onclick="document.forms[0].state.value = '';" onchange="confirmSubmit();" />
Zip
<input type="text" name="zip" value="Zip" onchange="return checkForNumber(this.value);" onclick="document.forms[0].zip.value = '';" /></p>
<p>Phone
<input type="text" name="phone" value="Phone" onchange="return checkForNumber(this.value);" onclick="document.forms[0].phone.value = '';" />
Fax
<input type="text" name="fax" value="Fax" onclick="document.forms[0].fax.value = '';" onchange="return checkForNumber(this.value);" /></p>
<p>Payment Method?
<input type="radio" name="credit_card" />Visa
<input type="radio" name="credit_card" />MasterCard
<input type="radio" name="credit_card" />American Express</p>
<p>Credit Card Number<input type="text" name="cardNumber" value="CardNumber" size="50" onclick="document.forms[0].cardNumber.value = '';" onchange="return checkForNumber(this.value);" /></p>
<table>
<tr>
<td>
<p>Expiration Month</p>
</td>
<td>
<select name="month" size="1" style="width: 200px">
<option value="months">Month</option>
<option value="january">January</option>
<option value="february">February</option>
<option value="march">March</option>
<option value="april">April</option>
<option value="may">May</option>
<option value="june">June</option>
<option value="july">July</option>
<option value="august">August</option>
<option value="september">September</option>
<option value="october">October</option>
<option value="november">November</option>
<option value="december">December</option>
</select>
</td>
<td>
<p>Expiration Year</p>
</td>
<td>
<select name="expiration" size="1">
<option value="2009">2009</option>
<option value="2010">2010</option>
<option value="2011">2011</option>
<option value="2012">2012</option>
<option value="2013">2013</option>
<option value="2014">2014</option>
</select>
</td>
</tr>
</table>
<p><input type="image" alt="Graphical image of a submit button" src="submit.gif" onchange="confirmSubmit()" /></p>
<p><input type="reset" value="Reset Purchase Order Form" onchange="confirmReset();" /></p>
</form>
<!-- your XHTML validation icon-->
<p>
<a href="http://validator.w3.org/check?uri=referer"><img
src="http://www.w3.org/Icons/valid-xhtml10"
alt="Valid XHTML 1.0 Strict" height="31" width="88"
style="border: 0px;" /></a>
<a href="http://jigsaw.w3.org/css-validator/check/referer">
<img src="http://www.austincc.edu/jscholl/images/vcss.png"
alt="Valid CSS!" height="31" width="88" style="border: 0px;" /></a>
</p>
</body>
</html>
Hi, I'm trying to automatically generate a new <option> tag in a html form using the below code, but it's not working. Does anyone have any ideas? The get_lightboxes function is being called via the add_to_lightbox functon. Javascript: function get_lightboxes(title, new_lightbox_id){ var new_option = document.createElement('option'); new_option.text = title; new_option.value = new_lightbox_id; var select_box = document.getElementByID('lightbox_select'); try { select_box.add(new_option, null); } catch(ex) { select_box.add(new_option); } } HTML: <form method="post" action="<?=$_SERVER['PHP_SELF']?>" name="lightbox_form" onsubmit="add_to_lightbox('<?=$_GET['id']?>', '<?=$_GET['media_urn']?>', lightbox_select_<?=$_GET['id']?>.value); return false;"> <input type="hidden" name="submitted" value="1" /> <input type="hidden" name="user_email_<?=$_GET['id']?>" value="<?=$_GET['user_email']?>" /> <input type="hidden" name="record_id_<?=$_GET['id']?>" value="<?=$_GET['id']?>" /> <input type="hidden" name="media_urn_<?=$_GET['id']?>" value="<?=$_GET['media_urn']?>" /> <h2>Add/Delete from existing lightbox:</h2> <p> <select name="lightbox_select_<?=$_GET['id']?>" id="lightbox_select"> <? foreach ($get_lightboxes as $lightbox) : ?> <? $lightbox_id = $lightbox["lightbox_id"]; ?> <? $title = $lightbox["title"]; ?> <? if(strlen($title) > 25) $title = substr($title, 0, 25) . "…"; ?> <option value="<?=$lightbox_id?>"><?=$title?></option> <? endforeach; ?> </select> <input type="submit" name="submit" value="Add" /> </p> </form> Hi everyone, The following code has an onblur event in the input fields so that if someone clicks out of the field without typing something in it, the original label, ie. 'First name' is reinserted into the field. The field is also being validated by some php code, however the onblur event creates a problem because the form still submits even if a name isn't typed into the field. It's assuming that 'First name' is an entry and therefore isn't validating it correctly. It was suggested that on the submit event of the form, there would be a function that checks if the value is First Name then return false, but then otherwise return true. As my javascript skills are very basic, I wondered if someone could help me with this code to solve this issue? Appreciate any help. Code: <input id="firstname" name="firstname" type="text" value="First name" onfocus="if (this.value == 'First name') this.value=''" onblur="if (this.value == '') this.value='First name'" />
<?php
if (ValidatedField('index_965','index_965')) {
if ((strpos((",".ValidatedField("index_965","index_965").","), "," . "1" . ",") !== false || "1" == "")) {
if (!(false)) {
?>
<span style="color: red"> First name is required </span>
<?php //WAFV_Conditional index.php index_965(1:)
}
}
}?>
Code: <!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">
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
<title>Make10-1 Oakwood Mortgage</title>
<script type="text/javascript">
<!--Hide from old browsers
var thisMsg = " ** See us for your auto loan financing needs!!! ** "
var beginPos =0
function scrollingMsg()
{
msgForm.scrollingMsg.value = thisMsg.substring(beginPos,thisMsg.length)+ thisMsg.substring(0,beginPos)
beginPos=beginPos+1
if (beginPos > thisMsg.length)
{
beginPos=0
}
window.setTimeout("scrollingMsg()",200)
}
function Calc(LoanCalc) {
var salesAmount=parseInt(LoanCalc.SaleAmt.value,10)
if (isNaN(salesAmount) || (salesAmount <= 0)) {
alert("Please enter a valid Sales Amount.")
LoanCalc.SaleAmt.value=" "
LoanCalc.SaleAmt.focus()
}
else {
var DownPayment=parseFloat(LoanCalc.DownPmt.value)/100
if (isNaN(DownPayment) || (DownPayment <= 0) || DownPayment > 100) {
alert("The Down Payment Rate is not a valid number!")
LoanCalc.DownPmt.value = ""
LoanCalc.DownPmt.focus()
}
else {
var loanRate=parseFloat(LoanCalc.Rate.value)
if (isNaN(loanRate) || (loanRate <= 0)) {
alert("The interest rate is not a valid number!")
LoanCalc.Rate.value = " "
LoanCalc.Rate.focus()
}
else {
var loanYears = LoanCalc.Years.value
var loanYears = parseInt(loanYears,10)
if (isNaN(loanYears) || (loanYears == 0)) {
alert("Please select the number of years from the list and click Calculate!")
LoanCalc.Years.focus()
}
else {
AmtDown = salesAmount * DownPayment
var loanAmount = salesAmount - AmtDown
LoanCalc.LoanAmt.value = dollarFormat(loanAmount.toFixed(2))
var monthlyPmt = monthly(loanAmount, loanRate, loanYears)
LoanCalc.Payment.value = dollarformat(monthlyPmt.toString())
}
}
}
}
}
function monthly(loanAmount,loanRate,loanYears) {
var interestRate = loanRate/1200
var Pmts = loanYears * 12
var Amnt = loanAmount * (interestRate / (1 - (1 / Math.pow(1+interestRate,Pmts))))
return Amnt.toFixed(2)
}
function dollarFormat(valuein) {
var formatValue = ""
var formatDollars = ""
formatAmt = valuein.split(".",2)
var dollars = formatAmt[0]
var dollarLen = dollars.length
if (dollarLen > 3) {
while (dollarLen > 0) {
tempDollars = dollars.substring(dollarLen - 3,dollarLen)
if (tempDollars.length == 3) {
formatDollars = ","+tempDollars+formatDollars
dollarLen = dollarLen - 3
} else {
formatDollars=tempDollars+formatDollars
dollarLen = 0
}
}
if (formatDollars.substring(0,1) == ",")
dollars = formatDollars.substring(1,formatDollars.length)
else
dollars = formatDollars
}
var cents = formatAmt[1]
var formatValue="$"+dollars+"."+cents
return formatValue
}
function popUpAd() {
open("make10-1notice.html","noticeWin","width=520,height=270")
}
function lastModified() {
dateDisplay.innerHTML="<span style='font-family:Arial, Helvetica, sans-serif; font-size:9px; font-weight:bold'>This document was last modified "+document.lastModified.substring(0,10)+"</span>"
}
//-->
</script>
<style type="text/css">
<!--
body {
background-image: url(financial_symbol.jpg);
}
-->
</style>
</head>
<body onload="scrollingMsg(); popUpAd(); lastModified()">
<div align="center">
<p align="center"><img src="make10-1banner.jpg" width="750" height="120" alt="banner" /></p>
<form id="msgForm" action="">
<p style="text-align:center"><input type="text" name="scrollingMsg" size="25" /></p>
</form>
</div>
<div style="font-family:Arial, Helvetica, sans-serif">
<h3 align="center">Home Loan Payment Calculator</h3>
<form id="LoanCalc" action="">
<table width="346" align="center" cellspacing="3">
<tr>
<td align="right">
<span style="color:#cc0000">*</span>Sale Price:
</td>
<td><input type="text" name="SaleAmt" id="SaleAmt" size="9" /></td>
</tr>
<tr>
<td align="right">
<span style="color:#cc0000">*</span> Down Payment as a percent
</td>
<td><input name="DownPmt" type="text" id="DownPmt" size="4" />
%</td>
</tr>
<tr>
<td align="right">
<span style="color:#cc0000">*</span> Interest Rate (e.g. 5.9):
</td>
<td><input type="text" name="Rate" id="Rate" size="4" /> %
</td>
</tr>
<tr>
<td align="right">
<span style="color:#cc0000">*</span> Select Number of Years:
</td>
<td><select name="Years" id="Years">
<option selected="selected">Select Years</option>
<option value="10">10</option>
<option value="15">15</option>
<option value="20">20</option>
<option value="25">25</option>
<option value="30">30</option>
<option value="40">40</option>
</select></td>
</tr>
<tr>
<td align="right">
<input name="button" type="button" value="Calculate" onclick="Calc(LoanCalc)" />
</td>
<td>
<input name="Reset" type="reset" />
</td>
</tr>
<tr>
<td align="right">
<span style="color:#cc0000">*</span> Loan Amount
</td>
<td>
<input name="LoanAmt" type="text" id="LoanAmt" size="9" />
</td>
</tr>
<tr>
<td align="right">
<span style="font-weight:bolder">Monthly Payment</span>:
</td>
<td><input type="text" name="Payment" id="Payment" size="12" /></td>
</tr>
</table>
<p style="color:#cc0000; text-align:center">* Indicates a required field.</p>
</form>
</div>
<div id="dateDisplay" style="margin-left:5%">
</div>
</body>
</html>
I need someone to link this: thiswebsite.com/12.html then someone clicks on a link, and the url would go to thiswebsite.com/12_1.html The link script has to subtract the ".html" from the original url, then add "_1.html" to the new url. I am pretty sure this is a simple script to make, I just do not have the time to google this and figure this out. I will pay $5 to anyone who fix this problem for me. you can post the solution here, with your paypal email so I can pay you, or email me the solution at hotgoat145@yahoo.com and tell me your paypal email so I can pay you. Im looking for a javascript code, because .htaccess does not work for me. it has to be in javascript, where it is like this <script language='JavaScript' type='text/javascript'> document.write('<a hr'+'ef="ht'+'tp://w'+'ww.mysite'+'.com/1.php">My Site</a>'); </script> Only I have to be able to subtract .php from the URL, and add _2.html to the final URL Here is what I am talking about: Go to this website: http://tehcake.com/video/30rock/2x14%20-%20Copy.html Do you see where it says Backup Links: 1 2 I need it to link to http://tehcake.com/video/30rock/2x14%20-%20Copy(2).html So it does (url of webpage [minus] file extension [plus] (2).html) it should be in javascript or something that can be written in the webpage. Hi All, I need to create a page that is in a sense a Payment Calculator. What it needs to do is take a balance and divide it by a user selected number of months and then display how much must be paid each month to pay off the balance in that time period. How would i set this up to work dynamically so if they decide they want a different number of months it will allow them to change it? I would appreciate any help provided! Thanks Justin i need to create a div as i click down and move while pressing the mouse button and the div will increase in size as i move the mouse while still pressing the mouse button. how can i accomplish this task Hi i am looking to create a js pop up to display an amazon widget which relates to an item on my page. so i've found this on the net http://blazonry.com/javascript/windows.php but im not very javascript minded and dont know where to start. so i have tried this Code: <img src="images/listen.png" border="0" alt="Preview Songs" title="Preview Songs" onclick="window.open("song_preview.php?id=<?php echo $row['ASIN']?>","Window1","menubar=no,width=430,height=360,toolbar=no");" />
but it loads a blank pop up at the same time the page loads up and not when an image is clicked? plus when i first loaded the page it said pop up blocked which sucks!! on the example i didnt get that, any reason why??? any help is appreciated thanks Luke Hey All, I've currently working on making a calendar for my website. How do I go about creating a password for it? So that the admin can add events to it. Cheers Guys!!! Hello, The following web page is an essay, but there is JavaScript code in the head area: http://www.pinyinology.com/content/content3c.html You can see the 'Press F5 to reset' command, and please try it to see what happens. What I like is to create another command 'Click here to reset'. Therefore, there will be two commands for the reset task. Then it becomes: Click here or press F5 to reset. The press F5 stuff in the code is as follows; Code: //Typewriting code
message='<span id="inTxt">wen<sup>2</sup></span>';
pos=0;
maxlength=message.length+1;
function writemsg()
{
if (pos<maxlength)
{
txt=message.substring(pos,0);
document.getElementById('edit').innerHTML=txt;
pos++;
timer=setTimeout('writemsg()', 20);
}
}
//Typewriting code2 own addition
message2='<span id="inTxt2">wen<sup>2</sup>闻. ven<sup>2</sup>:文纹. win<sup>2</sup>:蚊. vin<sup>2</sup>:雯.';
pos=0;
maxlength=message2.length+1;
function writemsg2()
{
if (pos<maxlength)
{
txt=message2.substring(pos,0);
document.getElementById('listing').innerHTML=txt;
pos++;
timer=setTimeout('writemsg2()', 20);
}
}
Below is the complete code. It may help. Code: function KeyDown()
{
var key=window.event.keyCode;
if (key==8)
{
window.event.returnValue=false;
var r=document.selection.createRange();
r.collapse(false);
r.move("character",-1);
r.collapse(false);
var p=r.parentElement();
if (p.nodeName.toLowerCase()=="sup"){
p.outerHTML="";
return;
}
window.event.returnValue=true;
}
}
function KeyPress()
{
var key=window.event.keyCode;
window.event.returnValue=false;
if (key>=48 && key<=57)
{
var r=document.selection.createRange();
r.collapse(false);
var d=r.duplicate();
d.moveStart("character",-1);
var c=d.text;
var p=d.parentElement();
var b=/[A-Za-z]/.test(c);
//b=b || p.nodeName.toLowerCase()=="sup";
if (b)
{
d.collapse(false);
var s=String.fromCharCode(key);
s=(p.nodeName.toLowerCase()=="sup")? s:"<SUP>"+s+"</SUP>";
d.pasteHTML(s);
d.collapse(false);
d.select();
return;
}
}
if (!(key in {37:1,38:1,39:1,40:1}))
{
var r=document.selection.createRange();
r.collapse(false);
p=r.parentElement();
if (p.nodeName.toLowerCase()=="sup")
{
var s=p.outerHTML;
p.removeNode(true);
r.pasteHTML(s);
r.collapse(false);
r.select();
}
}
window.event.returnValue=true;
}
//Below for status line
myMsg = " Happy Chinese typing !"
var i = 0;
function scrollMsg()
{
window.status = myMsg.substring(i,myMsg.length) + myMsg.substring(0,i);
if (i < myMsg.length)
{
i++
}
else
{
i = 0
}
setTimeout("scrollMsg()",120)
}
function stoptimer()
{
clearTimeout(timer);
}
//Following function is for the appreciation window
function newWindow() {
catWindow = window.open('appr2.html', 'catwin','width=395,height=235, scrollbars=yes');
catWindow.focus();
}
//Typewriting code
message='<span id="inTxt">wen<sup>2</sup></span>';
pos=0;
maxlength=message.length+1;
function writemsg()
{
if (pos<maxlength)
{
txt=message.substring(pos,0);
document.getElementById('edit').innerHTML=txt;
pos++;
timer=setTimeout('writemsg()', 20);
}
}
//Typewriting code2 own addition
message2='<span id="inTxt2">wen<sup>2</sup>闻. ven<sup>2</sup>:文纹. win<sup>2</sup>:蚊. vin<sup>2</sup>:雯.';
pos=0;
maxlength=message2.length+1;
function writemsg2()
{
if (pos<maxlength)
{
txt=message2.substring(pos,0);
document.getElementById('listing').innerHTML=txt;
pos++;
timer=setTimeout('writemsg2()', 20);
}
}
function stoptimer()
{
clearTimeout(timer);
}
Thanks in advance for your help. I have asked to create a chatbox, which acts just like a messenger which I type a text in the textbox and press send to show output to the messagebox. However, in my code, I have 2 bugs which is bothering me. The first one is whenever I press spacebar, a "+" sign appear. The second is the first text disappeared whenever I type the second text. Please help me. Code: <html>
<head>
<title>Untitled</title>
<script language="JavaScript" type="text/javascript">
<!--
var isShift=null;
var isNN = (navigator.appName.indexOf("Netscape")!=-1);
var OP = (navigator.appName.indexOf("Opera")!=-1);
if(OP)isNN=true;
var key;
function shift(event){
key = (isNN) ? event.which : event.keyCode;
if (key==16)isShift=1;
}
function process(event){
key = (isNN) ? event.which : event.keyCode;
if(document.layers&&event.modifiers==4){
isShift=1;
}
if (key==13&&isShift!=1){
document.myForm.submit();
}
if (key!=16)isShift=null;
}
function retrieve(){
document.myForm.text1.focus();
if(location.search.length>0){
blubb=unescape(location.search.split('=')[1]);
document.myForm2.text2.value=blubb;
}
}
//-->
</script>
</head>
<body onload="retrieve()">
<form name="myForm">
<textarea name="text1" onkeypress="process(event)" onkeydown="shift(event)" cols="50" rows="7"></textarea><input type="submit" accesskey="s" value="Send">
</form><br><br>
This second textarea is just to show, that the line breaks "arrive":<br>
<form name="myForm2">
<textarea name="text2" cols="50" rows="7"></textarea>
</form>
</body>
</html>
hi i am new to javascript. i make a mcq quiz website in one of server side script. now for that website i want to make count down timer so when that quiz starts the user will have 5 minutes to complete that quiz if use does not able to complete quiz in given time then quiz should disable and shows the user score how can i achieve this hi I am trying to create a textarea. There is a default text inside textarea. so when user clicks inside textarea then submit button appears and default text disappears and when user clicks somewhere else or outside textarea then it gets back to original state i.e, default text appears back and submit button disappears. here is what i did sofar. in this code when i click inside textarea then submit button does appear but text does not erase and when i click outside then button remains in sight. Code: <!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
#submit {
visibility: hidden;
}
</style>
</head>
<body>
<form>
<label>Message:</label>
<textarea name="message" id="message" rows="5" cols="30">write message here!</textarea><br />
<input type="button" name="submit" id="submit" value="submit" />
</form>
</body>
<script type="text/javascript" src="lib/jquery-1.4.min(Production).js"></script>
<script>
var flag = false;
$(document).ready(function () {
$('#message').click(function () {
flag = true;
$('#submit').css('visibility','visible');
if(flag == true) {
//alert(flag);
var msg = $('#message').val();
//alert(msg);
msg = "";
//alert(msg);
}
});
});
</script>
</html>
So yeah, I'm making a science fair project, and need to know if someone could make the script below work into being invincible. Code:
<Style Type="Text/CSS">
<!--
Input{}
.blokje{
Height:48px;
Width:48px;
Font-Size:16pt;
Font-Weight:900;
Font-Family:Comic Sans MS,Arial,Verdana;
Text-Align:Center;
}
.knopje{
Width:144px;
}
-->
</Style>
</HEAD>
<!-- STEP TWO: Copy this code into the BODY of your HTML document -->
<BODY>
<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
<!-- Original: Rob van der Ven (vennie@wanadoo.nl) -->
<!-- Web Site: http://home.wanadoo.nl/vennie -->
<Center>
<Form>
<Input Type="Button" Title="Click here to play again" Name="beurten" Width="164px" Class="knopje" Value="Player 1" onClick="wie = 'Player 1'; initieer()">
<Table CellPadding="0" CellSpacing="0" Border="0">
<Script Language="JavaScript">
<!--//
for (i = 1; i < 10; i++) {
if (i % 3 == 1) {document.write('<Tr>');}
document.write('<Td><Input Type="Button" Name="' + i + '" Value=" " Class="blokje" onClick="wijzig(this.form,this)"></Td>');
if (i % 3 == 0) {document.write('</Tr>');}
}
//-->
</Script>
</Table>
<Input Type="CheckBox" Title="Click here to change from 2 players or computergame" Name="automaat" Value="2 players" Id="autmat" onClick="if (this.value == 'Computer') {this.value = '2 players'; auto = 0} else {this.value = 'Computer'; auto = 1}; wie = 'Player 1'; initieer();"><Label For="autmat">against the computer</Label>
<Table CellPadding="0" CellSpacing="0" Border="1">
<Tr BgColor="Silver">
<Td Align="Center"> Player 1 </Td>
<Td Align="Center"> Player 2 </Td>
<Td Align="Center"> Tie </Td>
</Tr>
<Tr BgColor="Silver">
<Td Align="Center"><Input Style="BackGround-Color:Transparent;Border:Solid 0px;Text-Align:Center" Type="Text" Size="3" ReadOnly Title="Player 1" Name="speler1" Value="0"></Td>
<Td Align="Center"><Input Style="BackGround-Color:Transparent;Border:Solid 0px;Text-Align:Center" Type="Text" Size="3" ReadOnly Title="Player 2" Name="speler2" Value="0"></Td>
<Td Align="Center"><Input Style="BackGround-Color:Transparent;Border:Solid 0px;Text-Align:Center" Type="Text" Size="3" ReadOnly Title="Tie" Name="Tie" Value="0"></Td>
</Tr>
</Table>
</Form>
</Center>
<Script Language="JavaScript">
<!--//
timerID = xtal = ytal = ztal = auto = 0;
wie = 'Player 1';
function initieer(){
clearTimeout(timerID);
cel = new Array(0,0,0,0,0,0,0,0,0,0);
aanv = new Array(); strat = verd = leeg = aanv;
beurt = wissel = 1; wint = keren = 0;
document.forms[0].speler1.value = xtal;
document.forms[0].speler2.value = ytal;
document.forms[0].tie.value = ztal;
if (wie != 'Start') {
for (i in cel) {
cel[i] = 0; if (i > 0) {document.forms[0].elements[i].value = ''};
}
}
document.forms[0].beurten.value = wie;
}
function zetten() {
clearTimeout(timerID);
if (aanv[0] > 0) {
slag = aanv[Math.floor(Math.random() * 10) % aanv.length]
} else if (verd[0] > 0) {
slag = verd[Math.floor(Math.random() * 10) % verd.length];
} else if (strat[0] > 0) {
slag = strat[Math.floor(Math.random() * 10) % strat.length];
} else {
slag = leeg[Math.floor(Math.random() * 10) % leeg.length];
}
if (beurt == 0 && slag > 0) {document.forms[0].elements[slag].click()};
}
function win() {
if ( cel[1] + cel[2] + cel[3] == 3 ||
cel[4] + cel[5] + cel[6] == 3 ||
cel[7] + cel[8] + cel[9] == 3 ||
cel[1] + cel[4] + cel[7] == 3 ||
cel[2] + cel[5] + cel[8] == 3 ||
cel[3] + cel[6] + cel[9] == 3 ||
cel[1] + cel[5] + cel[9] == 3 ||
cel[3] + cel[5] + cel[7] == 3
) {
if (confirm("Player 1: You win !!!\nDo you want to play again?"))
{
wint = 1;
xtal++; wie = 'Player 1'; timerID = setTimeout('initieer()',800)
} else {
xtal++; wie = 'Start'; timerID = setTimeout('initieer()',800)
};
}
if ( cel[1] + cel[2] + cel[3] == 30 ||
cel[4] + cel[5] + cel[6] == 30 ||
cel[7] + cel[8] + cel[9] == 30 ||
cel[1] + cel[4] + cel[7] == 30 ||
cel[2] + cel[5] + cel[8] == 30 ||
cel[3] + cel[6] + cel[9] == 30 ||
cel[1] + cel[5] + cel[9] == 30 ||
cel[3] + cel[5] + cel[7] == 30
) {
if (confirm(((auto == 1) ? ('Computer wins, sorry') : ('Player 2: You win !!')) + "!\nDo you want to play again?")) {
ytal++; wie = 'Player 1'; timerID = setTimeout('initieer()',800)
} else {
ytal++; wie = 'Start'; timerID = setTimeout('initieer()',800)
};
}
}
function wisselen(beurt){
if (wissel == 1) {
if (beurt == 0) {
beurt = 1;
wie = "Player " + 1
}
else {
if (auto == 0) {beurt = 0;
wie = "Player " + 2} else {beurt = 0; wie = "Computer";}
}
if (keren == 9
) {
if (confirm("Tie!!!\n\nDo you want to play again?")) {
ztal++; wie = 'Player 1'; timerID = setTimeout('initieer()',800)} else
{ztal++; wie = 'Start'; timerID = setTimeout('initieer()',800)};
}
}
else {
beurt = beurt;
}
wissel = 1;
return(beurt);
}
function wijziging(klik) {
plek = cel[klik]; geklikt = klik;
if (plek == 0){
if (beurt == 0){
xo = "O";
plek = 10;
} else {
xo = "X";
plek = 1;
}
cel[klik] = plek; keren++;
}
else {
if (plek == 10){
xo = "O";}
if (plek == 1){
xo = "X";}
wissel = 0
}
return(xo);
}
function verdedig() {leeg = new Array(); verd = new Array();
for (i = 1; i < 10; i++) { oud = cel[i]; cel[i] = 1;
if ( (cel[1] + cel[2] + cel[3] == 3 ||
cel[4] + cel[5] + cel[6] == 3 ||
cel[7] + cel[8] + cel[9] == 3 ||
cel[1] + cel[4] + cel[7] == 3 ||
cel[2] + cel[5] + cel[8] == 3 ||
cel[3] + cel[6] + cel[9] == 3 ||
cel[1] + cel[5] + cel[9] == 3 ||
cel[3] + cel[5] + cel[7] == 3) && oud == 0
) { verd[verd.length] = i}
cel[i] = oud;
if (cel[i] == 0) {
if (keren != 1) {leeg[leeg.length] = i} else
if (cel[5] == 0) {leeg[0] = 5; leeg[1] = 10 - geklikt} else
if (i % 2 != 0) {leeg[leeg.length] = i}
};
}
}
function aanval() {aanv = new Array();
for (i = 1; i < 10; i++) { oud = cel[i]; cel[i] = 10;
if ( (cel[1] + cel[2] + cel[3] == 30 ||
cel[4] + cel[5] + cel[6] == 30 ||
cel[7] + cel[8] + cel[9] == 30 ||
cel[1] + cel[4] + cel[7] == 30 ||
cel[2] + cel[5] + cel[8] == 30 ||
cel[3] + cel[6] + cel[9] == 30 ||
cel[1] + cel[5] + cel[9] == 30 ||
cel[3] + cel[5] + cel[7] == 30) && oud == 0
) { aanv[aanv.length] = i}
cel[i] = oud;
}
}
function strategie() {strat = new Array();
for (i = 1; i < 10; i++) { oud = cel[i]; cel[i] = 10;
if ( (cel[1] + cel[2] + cel[3] == 20 ||
cel[4] + cel[5] + cel[6] == 20 ||
cel[7] + cel[8] + cel[9] == 20 ||
cel[1] + cel[4] + cel[7] == 20 ||
cel[2] + cel[5] + cel[8] == 20 ||
cel[3] + cel[6] + cel[9] == 20 ||
cel[1] + cel[5] + cel[9] == 20 ||
cel[3] + cel[5] + cel[7] == 20) && oud == 0
) {
if (keren != 3) {strat[strat.length] = i} else if (i % 2 != 0) {strat[strat.length] = i}
}
cel[i] = oud;
}
}
function wijzig(form,element){
wijziging(element.name);
element.value = xo;
beurt = wisselen(beurt);
form.beurten.value = wie;
verdedig(); aanval(); strategie(); win();
if (auto == 0 || wint == 1) {return} else {
timerID = setTimeout('zetten()',600)
}
}
initieer();
Hi everyone, I want the source code of creating forum in JavaScript language.ASAP
If anyone is planning on buying "ICAB4225B Automate Processes" in relation to a TAFE/College/School course, I suggest getting the teacher to actually READ the book before they use it. Tonight has been a HE-Double Hockeysticks (Not sure on language in this forum) of fixing mistakes the book has made. Double commars inplace of singles, singles inplace of doubles, single brackets, whole chunks of text that are wrong. In one place in the book it tells me to copy the text in blod and there is none. Anyway.... The code that the book has made me piece together over the last few questions has left me with: Code: <script type = "text/javascript">
{
var counter = 0
var NoOfItems
var ItemsNames = new Array()
NoOfItems = prompt ("How many items do you want to hock?","");
for (NameCount=0; NameCount<NoOfItems; NameCount++)
{
ItemNames [NameCount] = prompt ("What are the names of your items?","");
}
document.write ("<form name='myform'><br><table>");
while ( counter < NoOfItems)
{
document.write ("<tr><td><value>Enter the price of the " + ItemNames [count] + "</td><td><input type='text' name='" + ItemNames [count] + "'></td></tr>");
counter++
}
document.write ("<tr><td><input type='submit' value='Submit Details' onClick='validateform'</td></tr></table></form>");
}
</SCRIPT>
The problem I am having it with the Array. I dont think that var = new Array is correct but thats what my text book is telling me. Any help? I have searched and scoured the web looking for a script like this. I have found different scripts that do certain aspects of what I am looking for, but not ONE that does it all. I am hoping you can help bring my search to an end! I need a script that when a user tries to leave a page, either by typing in a URL in the address bar or clicking an external link they get a Javascript (not pop up window) dialog box asking if they would like to complete a survey. If they click OK they are then redirected to the survey page. If they click cancel it allows them to go on their way to the external link. It needs to be able to decipher between internal and external links. The script needs to work with both IE and FF. This is a must. Safari would be a plus. I would like, BUT IS IN NO WAY A NECESSITY, for the script to also be cookie based in that the user doesn't see it if they've seen it within 7 or 14 days. I really hope you all can help me here as I am lost! If you need any other info from me please let me know! |
|||||||