|
JavaScript - Textbox Onblur Adds 1 To Input
Hello,
I am new to JavaScript and I am asking for help with this problem. I have a three textboxes in a form. Using OnBlur, I am attempting to call a function to add one to an input textbox to add 1 to the cost. As the user enters text into textbox01, the number 1 appears in the input box about cost, as the user enters text into textbox02, the input box displays 2 and the user enters text into textbox03, the input box displays 3. My JavaScript is as follows: <script type="text/javascript"> //copies contents of first textbox to second textbox function copyValue() { var textbox1 = document.getElementById("textbox1"); var textbox2 = document.getElementById("textbox2"); var textbox3 = document.getElementById("textbox3"); var txtAttendee = document.getElementById("txtAttendee"); var input_A = document.getElementById("input_A"); textbox2.value = textbox1.value; txtAttendee.value = 1; input_A.value = 1; } </script> In the form I have this: <input type="text" id="textbox3" style="background-color:yellow" onblur="copyValue();" /> I would greatly appreciate ANY help with being able to calculate costs, perhaps using the JavaScript ++/-- operators. Thank you in advance for your time and assistance. Similar TutorialsHi, I have an input element (textbox) on a webpage, and capture the onblur event of the input (textbox) control to do validation. My problem is that when the page is closed or the user click on another window the onblur event of my textbox gets called too. I need the onblur event handler to be called only when the textbox loses focus b/c another element on the SAME webpage gets focus, but not when the user clicks on another window or closes the browser window. What is the right way to accomplish this? Thanks in advance, Richard Hi.. I have form and i want to input data using barcode and it will display on textbox and after input on the first textbox the focus will go to next textbox untill it will go on the last textbox and on the last textbox it will automatically save the data's on the database. How is it possible? here is my sample code: Code: <?php
error_reporting(0);
date_default_timezone_set("Asia/Singapore"); //set the time zone
$con = mysql_connect('localhost', 'root','');
if (!$con) {
echo 'failed';
die();
}
mysql_select_db("mes", $con);
?>
<html>
<head>
<script type="text/javascript">
function ini()
{
// Retrieve the code
var code =document.getElementById ("code_read_box1").value;
var code =document.getElementById ("code_read_box2").value;
var code =document.getElementById ("code_read_box3").value;
var code =document.getElementById ("code_read_box4").value;
var code =document.getElementById ("code_read_box5").value;
var code =document.getElementById ("code_read_box6").value;
// Return false to prevent the form to submit
return false;
}
</script>
</head>
<body onLoad="document.barcode.code_read_box1.focus()">
<form name=barcode onsubmit = "return ini()">
<input type="text" id="code_read_box1" value="" /><br/>
<input type="text" id="code_read_box2" value="" /><br/>
<input type="text" id="code_read_box3" value="" /><br/>
<input type="text" id="code_read_box4" value="" /><br/>
<input type="text" id="code_read_box5" value="" /><br/>
<input type="text" id="code_read_box6" value="" /><br/>
</form>
</body>
</html>
I need some help as this is driving me crazy. I have a onblur, focus with this code for the columns of footer filter. Code: $("tfoot input").keyup( function () {
/* Filter on the column (the index) of this element */
oTable.fnFilter( this.value, $("tfoot input").index(this) );
} );
$("tfoot input").each( function (i) {
asInitVals[i] = this.value;
} );
$("tfoot input").focus( function () {
if ( this.className == "search_init" )
{
this.className = "";
this.value = "";
}
} );
$("tfoot input").blur( function (i) {
if ( this.value == "" )
{
this.className = "search_init";
this.value = asInitVals[$("tfoot input").index(this)];
}
} );
I am clearing the input fields with this. Code: $("input:button").click(function(e) { $('#col1').val('');
$('#col2').val('');
$('#col3').val('');
$('#col4').val('');
$('#col5').val('');
Including a reset of the filters, but won't bore with that, it works, the filters for the columns are all released and reset. My issue is the tfoot fields are cleared just fine, but remain blank. The onblur values do not refill the fields until I click in, then click out of the input field. Do I need to adjust for the clearing of the input field in the original focus and onblur? Or do I need a better reset of the the .val('') statement with a tweak to let the onblur function to show. Thanks, any help really appreciated. Tom Hi is there a way to only allow a certain numeric amount to be entered into a text input? i.e, Like nothing over 20? Thanks What I want is when the button 'Total' is pressed, the total frame the pictures and frames appears in the textbox. Here is the code (sorry, it's long): <!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" /> <script language="javascript" src="jquery-1.3.2.js"></script> <title>Ivis's Picture Gallery</title> <script language="javascript"> var price1, price2, price3, price4, price5, price6, price7, price8, price9, price10; function price() { price1 = document.getElementById("price1").innerHTML=price1; price2 = document.getElementById("price2").innerHTML=price2; price3 = document.getElementById("price3").innerHTML=price3; price4 = document.getElementById("price4").innerHTML=price4; price5 = document.getElementById("price5").innerHTML=price5; price6 = document.getElementById("price6").innerHTML=price6; price7 = document.getElementById("price7").innerHTML=price7; price8 = document.getElementById("price8").innerHTML=price8; price9 = document.getElementById("price9").innerHTML=price9; price10 = document.getElementById("price10").innerHTML=price10; } function total() { var text = document.getElementById("txt1").value; text = bigImage + bigFrame; } function changeImageZebra() { $("#bigImage").hide(); $("#bigImage").attr("src", "ZooZebra.gif"); $("#bigImage").fadeIn(3000); } function changeImageTiger() { $("#bigImage").hide(); $("#bigImage").attr("src", "tiger.jpg"); $("#bigImage").fadeIn(3000); } function changeImageGraff() { $("#bigImage").hide(); $("#bigImage").attr("src", "graff.jpg"); $("#bigImage").fadeIn(3000); } function changeImageBDog() { $("#bigImage").hide(); $("#bigImage").attr("src", "boys with dog.jpg"); $("#bigImage").fadeIn(3000); } function changeImageSeal() { $("#bigImage").hide(); $("#bigImage").attr("src", "seal.jpg"); $("#bigImage").fadeIn(3000); } $(document).ready(function(){ $("#zebPic").mouseover(changeImageZebra); $("#tigPic").mouseover(changeImageTiger); $("#graffPic").mouseover(changeImageGraff); $("#bdogPic").mouseover(changeImageBDog); $("#sealPic").mouseover(changeImageSeal); }); function changeFrame1() { $("#bigFrame").hide(); $("#bigFrame").attr("src", "square.png"); $("#bigFrame").fadeIn(3000); } function changeFrame2() { $("#bigFrame").hide(); $("#bigFrame").attr("src", "square2.png"); $("#bigFrame").fadeIn(3000); } function changeFrame3() { $("#bigFrame").hide(); $("#bigFrame").attr("src", "square3.png"); $("#bigFrame").fadeIn(3000); } function changeFrame4() { $("#bigFrame").hide(); $("#bigFrame").attr("src", "square4.png"); $("#bigFrame").fadeIn(3000); } function changeFrame5() { $("#bigFrame").hide(); $("#bigFrame").attr("src", "square5.png"); $("#bigFrame").fadeIn(3000); } $(document).ready(function(){ $("#frame1").mouseover(changeFrame1); $("#frame2").mouseover(changeFrame2); $("#frame3").mouseover(changeFrame3); $("#frame4").mouseover(changeFrame4); $("#frame5").mouseover(changeFrame5); }); </script> </head> <body><h1>Frames</h1> <p> </p> <p><img src="ZooZebra.gif" id="zebPic" alt="" width="50" height="50" /><div id="price1">$100</div></p> <p><img src="tiger.jpg" id="tigPic" alt="" width="50" height="50" /><div id="price2">$110</div></p> <p><img src="graff.jpg" id="graffPic" alt="" width="50" height="50" /><div id="price3">$120</div></p> <p><img src="boys with dog.jpg" id="bdogPic" alt="" width="50" height="50" /><div id="price4">$130</div></p> <p><img src="seal.jpg" id="sealPic" alt="" width="50" height="50" /><div id="price5">$140</div></p> <p> </p> <hr /> <p> </p> <div id="sq1"><img src="square.png" id="frame1" width="100" height="100" /> Frame1</div><div id="price6">$50</div> <div id="sq2"><img src="square2.png" id="frame2" width="100" height="100" /> Frame2</div><div id="price7">$60</div> <div id="sq3"><img src="square3.png" id="frame3" width="100" height="100" /> Frame3</div><div id="price8">$70</div> <div id="sq4"><img src="square4.png" id="frame4" width="100" height="100" /> Frame4</div><div id="price9">$80</div> <div id="sq5"><img src="square5.png" id="frame5" width="100" height="100" /> Frame5</div><div id="price10">$90</div><hr /> <p> </p> <p><img src="ZooZebra.gif" name="bigImage" align="top" id="bigImage" /><img src="square.png" name="bigFrame" id="bigFrame" /></p> <p> <label> <input type="button" name="btn1" id="btn1" value="Total" onclick="total()" /> </label> <label> <input type="text" name="txt1" id="txt1" /> </label> </p> <p> <input type="button" name="btn2" id="btn2" value="To Checkout" /> </p> <p> </p> [<a href="galleryindex.htm">Back</a>] </body> </html> <html> <head> <meta http-equiv='Content-Type' content='text/html; charset=utf-8' /> <meta http-equiv='Content-Script-Type' content='text/javascript'> <script type = 'text/javascript'> function unselectall(form) { var i=0; for(i=0;i<=15;i++) { tdname = 'invbox'+i; if (document.getElementById && document.getElementById(tdname).style) { document.getElementById(tdname).style.borderColor = '#000000'; form.selected.value = 0; } else { i=20; } } } function selectthis(form, pos) { unselectall(form); var tdname = 'inventory'; document.getElementById(tdname).style.borderColor = '#ffff00'; form.selected.value = form.position1.value; } </script> </head> <body> <form id='inventorytable' method='post' action='addflowerlight.php'> <table id='inventory' border=1> <tr> <td id = 'invbox1' ><img src = 'images/Lights/6inv.jpg' onclick="selectthis('inventorytable', 1);"><input type = 'text' id = 'position1' value='6'></td></tr></table> <input type ='text' id='selected'> <input type ='submit' value='Equip Light'> </form> </body> </html> What am I doing wrong? The onclick wont trigger. Hi! I am quite new to the world of JavaScript as I have done basic corse for it... and I have learnt that best way to understand it is to play around with it... but now I am stuck with on of the problem!! Problem: How can we assign text box input values by user to a variable and display that variable back on another element of the same HTML document(dynamically)... Conditions: The value has to be stored as a JavaScript variable only. No server-side script is to be used and has to be done locally. Please help! hi, i am using <input type = "file" id = "upload"> in my html page. i want to disable the textbox of this control so that user cannot type any file location here. user can upload file only through browse button. is there a way to disable this textbox thru javascript? thnx Hi.. I just want to know how does it happen that when I scan the barcode using barcode scanner it will automatically put on the first textbox, then the focus will go to the next textbox and on the last textbox will automatically save the data to database. here is my sample form. PHP Code: <?php error_reporting(0); date_default_timezone_set("Asia/Singapore"); //set the time zone $con = mysql_connect('localhost', 'root',''); if (!$con) { echo 'failed'; die(); } mysql_select_db("mes", $con); $sr_date =date('Y-m-d H:i:s'); $sql = "SELECT sr_number FROM receiving_materials ORDER BY sr_date DESC LIMIT 1"; $result = mysql_query($sql, $con); if (!$result) { echo 'failed'; die(); } $total = mysql_num_rows($result); if ($total <= 0) { $currentSRNum = 1; $currentYear = (int)(date('y')); $currentMonth = (int)(date('m')); $currentDay = (int)(date('d')); $currentSRYMD = substr($row['sr_number'], 0, 6); $currentYMD = date("ymd"); if ($currentYMD > $currentSRYMD) { $currentSRNum = 1; } else { $currentSRNum += 1; } } else { //------------------------------------------------------------------------------------------------------------------ // Stock Number iteration.... $row = mysql_fetch_assoc($result); $currentSRNum = (int)(substr($row['sr_number'],0,3)); $currentSRYear = (int)(substr($row['sr_number'],2,2)); $currentSRMonth = (int)(substr($row['sr_number'],0,2)); $currentSRNum = (int)(substr($row['sr_number'],6,4)); $currentYear = (int)(date('y')); $currentMonth = (int)(date('m')); $currentDay = (int)(date('d')); $currentSRYMD = substr($row['sr_number'], 0, 6); $currentYMD = date("ymd"); if ($currentYMD > $currentSRYMD) { $currentSRNum = 1; } else { $currentSRNum += 1; } } //------------------------------------------------------------------------------------------------------------------ $yearMonth = date('ymd'); $currentSR = $currentYMD . sprintf("%04d", $currentSRNum); ?> <html> <title>Receiving Materials</title> <head> <link rel="stylesheet" type="text/css" href="kanban.css" /> <style type="text/css"> #SR_date{ position: relative; font-family: Arial, Helvetica, sans-serif; font-size: .9em; margin-left: 10px; width: auto; height: auto; float: left; top : 10px; } </style> </head> <body> <form name="receiving_form" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post"> <div id="SR_date"> <label>Date :</label> <input type="text" name="sr_date" value="<?php echo $sr_date; ?>" size="16" readonly="readonly" style="border: none;"> </div> <div id="SR_number"> <label>RM# :</label> <input type="text" name="sr_number" value="<?php echo $currentSR; ?>" size="9" readonly="readonly" style="font-weight: bold; border: none;"> </div> <div id="SI_number"> <label class="LLabelRM">SI/DR# :</label> <input type="text" name="si_num" id="si_num" class="LFieldRM" value="" size="25"> <br/></br/> <label class="LLabelRM">Supplier Name :</label> <input type="text" name="s_name" id="s_name" class="LFieldRM" value="" size="25"> <br/></br/> <label class="LLabelSecRM">PO # :</label> <input type="text" name="po_num" id="po_num" class="LFieldSecRM" value="" size="25"> <label class="LLabelSecRM">Quantity :</label> <input type="text" name="qty" id="qty" class="LFieldSec1RM" value="" size="25"> <br/> <br/> <label class="LLabelSecRM">Material Code :</label> <input type="text" name="mat_code" id="mat_code" class="LFieldSecRM" value="" size="25"> <label class="LLabelSecRM">Material Desc. :</label> <input type="text" name="mat_desc" id="mat_desc" class="LFieldSec1RM" value="" size="25"> <br/></br/> <label class="LLabelSecRM">WH Code :</label> <input type="text" name="wh_code" id="wh_code" class="LFieldSecRM" value="" size="25"> <label class="LLabelSecRM">BIN Location :</label> <input type="text" name="bin_loc" id="bin_loc" class="LFieldSec1RM" value="" size="25"> </div> </form> </body> </html> Thank you Hello. I've been teaching myself HTML and CSS for a while, and now I've moved into the world of Javascript (but I'm still very much a beginner). For practice, I've been building a sample sign up form for a mock website, and I'm having problems with the birthdate section. The idea I had was to have MM, DD, and YYYY be the default values of my 3 textboxes (as an example for users), then set the value to nothing when the box gained focus. That all works fine, but I ran into problems when I tried to write an if statement to set the value back to MM, DD, or YYYY if the value was still nothing when the user clicked away. As it is now it just replaces the text inputted into the textbox (which of course is not good). Any ideas for what the problem might be? Code: <form name="signup" action="javascript:void(0);" method="post">
<table>
<tr>
<td>Date Of Birth:</td>
<td>
<input name="DOBmonth" type="text" value="MM" size="2" style="color: #555555;" onFocus="clearDOBmonth()" onBlur="restoreDOBmonth()" />
<input name="DOBday" type="text" value="DD" size="2" style="color: #555555;" onFocus="clearDOBday()" />
<input name="DOByear" type="text" value="YYYY" size="4" style="color: #555555;" onFocus="clearDOByear()" /></td>
</tr>
<tr>
<td></td>
<td><button name="Submit" type="submit" style="font-size: 1em;">Sign Up</button></td>
</tr>
</table>
</form>
<script type="text/javascript" language="javascript">
<!--
document.signup.DOBmonth.value="MM";
document.signup.DOBday.value="DD";
document.signup.DOByear.value="YYYY";
function clearDOBmonth() { document.signup.DOBmonth.value="";}
function clearDOBday() { document.signup.DOBday.value="";}
function clearDOByear() { document.signup.DOByear.value="";}
function restoreDOBmonth()
{
if ('document.signup.DOBmonth.value = ""')
{
document.signup.DOBmonth.value = "MM";
// alert(document.signup.DOBmonth.value);
}
}
//-->
</script>
Another side question, if I set a variable equal to the value of a textbox, then change the value of the variable, does that also change the value of the textbox? or is the variable no longer associated with the textbox. Example: Code: var a = document.form.textbox.value; a = blue; does document.form.textbox.value = blue? or is var a now completely independent of the textbox value? Thanks! Hi, I have dynamic table with the fileds that have input boxes where X is the counter. Finaly I got unique id ABC1,ABC2,ABC3......... <table><tr> <td><input id=ABC<%=X%> value="<%=RS("Name")%>"></td> <td><input id=ABC<%=X%> value="<%=RS("Name")%>"></td> <td><input id=ABC<%=X%> value="<%=RS("Name")%>"></td> <td>...</td><td>...</td><td>...</td></tr></table> How to get value of each row onblur in javascript Thanks a lot, MZ There is a Js file i am including in my application that has a below function Code: function highlightInputs() {
var inputs = document.getElementsByTagName('input');
var i;
for (i=0; i<inputs.length; i++) {
inputs[i].onfocus = function() {
this.style.background = '#F6F6F6';
}
inputs[i].onblur = function() {
this.style.background = '#FFF';
}
}
}
addEvent (window, "load", highlightInputs);
Code: <INPUT TYPE="text" NAME="InvoiceDate_DT" id="InvoiceDate_DT" value="<?=($InvoiceDate_DT)?>" class="smtxtbox" onBlur="javascript:alert('test');">
Now in the same page, i have a textbox and i try to fire an onblur() event which is not getting fired. Onclick() works but onblur() doesnt..strange.. When i disable the .js file it gets fired. What is the problem?? Its on all the browsers Thanks I am trying to make an onblur that calls a function and passes it some text, for example: onblur = "function("Hello")" however this wont work as it is not even calling the function. I have tried all the different encapsulation tags I can think of but still no luck is there any way of doing it or can I assign the text to a variable and call the function in the onblur? Thanks.:confused: greetings, i have a function that sets the onfocus and onblur event for every item in a table which then tells it to the change the class name. for some reason this doesn't seem to be working with the <select> inputs. i have heard it has something to do with how the option list re-loads itself??? Code: function setTableActivation(){
tableDiv = document.getElementById("tables");
tables = tableDiv.getElementsByTagName("table");
count = tables.length;
for(var h=0;h<count;h++){
var table = tables[h];
table.accessKey = h;
table.onfocus = function(){tables[this.accessKey].className = "activeTable";};
table.onblur = function(){tables[this.accessKey].className = "searchreal";};
for(var i=0;i<table.rows.length;i++){
row = table.rows[i];
row.accessKey = h;
row.onfocus = function(){tables[this.accessKey].className = "activeTable";};
row.onblur = function(){tables[this.accessKey].className = "searchreal";};
for(var j=0;j<table.rows[i].cells.length;j++){
cell = table.rows[i].cells[j];
cell.accessKey = h;
cell.onfocus = function(){tables[this.accessKey].className = "activeTable";};
cell.onblur = function(){tables[this.accessKey].className = "searchreal";};
for (var k = 0; k < cell.childNodes.length; k++) {
if (cell.childNodes[k].nodeType == document.ELEMENT_NODE) {
cell.childNodes[k].accessKey = h;
cell.childNodes[k].onfocus = function(){tables[this.accessKey].className = "activeTable";};
cell.childNodes[k].onblur = function(){tables[this.accessKey].className = "searchreal";};
if(cell.childNodes[k].tagName == "SELECT"){
}
}
}
}
}
}
}
Hi, I'm a little rusty on my javascript. I'm trying to use onKeyUp and onBlur to validate html table field text entry. I'm using Firefox in Windows XP, and Javascript is turned on. Mind taking a look to see why it's not working? Thanks! -Jason Code: <html>
<head>
<title>javascript onKeyUp problem example</title>
<script type="text/javascript"><!--
//Validates full zip code when zip code field is left. If invalid, should pop an alert message.
function onBlur_Zip() {
var zipCodePattern = /^\d{5}$|^\d{5}-\d{4}$/;
if (zipCodePattern.test(document.getElementByID("zip").value) == -1) {
alert("Please enter a valid zip code.");
}
return false;
}
//Validates partial zip code. If invalid, should make table row background color yellow.
function onKeyPress_Zip() {
var zipCodePattern = /^\d{0,5}$|^\d{5}-\d{0,4}$/;
var val = document.getElementByID("zip").value;
alert(val);
if (zipCodePattern.test(document.getElementByID("zip").value) == -1) {
alert("onkeypress zip false");
document.getElementByID("zipRow").style.backgroundColor="yellow";
}
else {
alert("onkeypress zip true");
document.getElementByID("zipRow").style.backgroundColor="white";
}
return false;
}
// -->
</script>
</head>
<body>
<form><table border=1 cellpadding=5>
<tr id="zipRow">
<td>Test field:</td>
<td><input id="zip" type="text" name="zip" onKeyUp="javascript:onKeyPress_Zip()" onBlur="javascript:onBlur_Zip()" /></td>
</tr></table></form>
</body>
</html>
Hi, can someone show me why I cant get the onfocus and onblur to loop thru the function showTextContent() when entering the words one, two, three or four. I have tried for days, googled and lost a lot of hair trying to figure it out. http://www.data-affiliates.com/DL234...5/attempt.html Code: <html>
<!-- Created on: 08.08.2009 -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title></title>
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="author" content="sdfgdfg">
<meta name="generator" content="AceHTML 6 Pro">
<link rel="stylesheet" href="vid61.css" type="text/css" media="screen" />
<script type="text/javascript">
function toggle(id, status){
document.getElementById(id).style.visibility = status;
}
function myFocus(element)
{
if (element.value == element.defaultValue) {
element.value = '';
}
}
function myBlur(element) {
if (element.value == '') {
element.value = element.defaultValue;
}
}
function populateSearchField(){
var specialChars = "\\.+*?[^]$(){}=!<>|:,-=/";
var ignoreList = ["a", "the"];
var i, j, searchFld, keywords;
if (!(searchFld = document.getElementsByName('formcontent')[0])) return;
if (!(keywords = document.referrer.match(/[pq]=(.*?)&/))) return;
var preg_quote = function(str){return (str+'').replace(/([\\\.\+\*\?\[\^\]\$\(\)\{\}\=\!<>\|\:])/g, "\\$1");}
keywords = decodeURIComponent(keywords[1]).replace(new RegExp('[' + preg_quote(specialChars) + ']', 'g'), ' ').split(/[\+ ]/);
for (i = 0; i < keywords.length; i++){
for (j = 0; j < ignoreList.length; j++) if (!keywords[i] || (keywords[i] == ignoreList[j])) {
keywords.splice(i--, 1);
break;
}
}
searchFld.value = keywords.join(' ');
}
function keywordMatch(keywords, text) {
var result = 0;
for (var i in keywords) {
if (text.match(new RegExp("(^| )" + keywords[i] + "( |$)", "i"))) {
result++;
};
}
return result;
}
function showTextContent() {
var i, matches = [];
var div, divcontent, divs = document.getElementById("ts-1").getElementsByTagName('div');
var keywords = document.getElementsByName('formcontent')[0].value.split(' ');
for (i = 0; i < divs.length; i++) {
div = divs[i];
divcontent = div.lastChild.nodeValue;
if (keywordMatch(keywords, divcontent)) {
matches.push(div);
}
}
if (matches[0]) {
document.getElementById('take1000').innerHTML = matches.length + " matches / Treffer";
for (i = 0; i < matches.length; i++) {
matches[i].onmouseover(toggle('take1000', 'visible'));
matches[i].onmouseout = null;
}
}
else {
document.getElementById("ts-1").innerHTML = "" ;
matches[i].onmouseover(toggle('notake1000', 'visible'));
}
}
window.onload = function(){
populateSearchField();
showTextContent();
}
</script>
</head>
<body>
<div id="container">
<div id="notake1000">Keine Ergebnisse / No Matches</div>
<div id="take1000"></div>
<div id="ulent">Search this site / Diese Seite durchsuchen :</div><form><input type="text" name="formcontent" value="one" onmouseover="toggle('notake1000', 'hidden');toggle('take1000', 'hidden');" onfocus="myFocus(this); showTextContent();" onblur="myBlur(this); showTextContent();" style="font-family:Arial;color:#ffff40;text-align:center;font-size:12px;font-weight:bold;float:right;margin-left : auto;margin-right : 2px;border: 2px double #AFAFAF;background-color: #5F5F5F;padding:1px;height:18px;width:293px;" /></form>
<div id="ts-1" style="visibility:hidden;">
<div onmouseover="toggle('fo-test1', 'visible');" onmouseout="this.className='ts-1-1';toggle('fo-test1', 'hidden');" onmouseup="this.className='ts-1-3A';" class="ts-1-1"><object id="fo-test1" style="visibility:hidden;" type="application/x-shockwave-flash" data="peelawayok.swf" width="356" height="286"><param name="movie" value="peelawayok.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="menu" value="false" /></object>www.Ihre-domain.de<br />one</div>
<div onmouseover="toggle('fo-test2', 'visible');" onmouseout="this.className='ts-1-2';toggle('fo-test2', 'hidden');" onmouseup="this.className='ts-1-3A';" class="ts-1-2"><object id="fo-test2" style="visibility:hidden" type="application/x-shockwave-flash" data="peelawayok.swf" width="356" height="286"><param name="movie" value="peelawayok.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="menu" value="false" /></object>www.Ihre-domain.de<br />two</div>
<div onmouseover="toggle('fo-test3', 'visible');" onmouseout="this.className='ts-1-3';toggle('fo-test3', 'hidden');" onmouseup="this.className='ts-1-3A';" class="ts-1-3"><object id="fo-test3" style="visibility:hidden" type="application/x-shockwave-flash" data="peelawayok.swf" width="356" height="286"><param name="movie" value="peelawayok.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="menu" value="false" /></object><br />www.Ihre-domain.de<br />three</div>
<div onmouseover="toggle('fo-test4', 'visible');" onmouseout="this.className='ts-1-4';toggle('fo-test4', 'hidden');" onmouseup="this.className='ts-1-3A';" class="ts-1-4"><object id="fo-test4" style="visibility:hidden" type="application/x-shockwave-flash" data="peelawayok.swf" width="356" height="286"><param name="movie" value="peelawayok.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="menu" value="false" /></object><br />www.Ihre-domain.de<br />four</div>
</div>
</div>
</body>
</html>
okay. clearing a form. I have a clear button. when I push it, I want all the red text boxes and onblur messages to disappear. anyone have an idea on where i can start? heres javascript Code: function isFormValid()
{
var userF = document.getElementById('FName').value;
var userL = document.getElementById('LName').value;
var userPW = document.getElementById('pw').value;
var userPW2 = document.getElementById('pw2').value;
var userBDay = document.getElementById('BDay').value;
var userEmail = document.getElementById('email').value;
var NameFormat = /^[A-Za-z]{2,12}$/;
var PWFormat = /^[A-Za-z0-9]{6,12}$]/;
var BDayFormat = /^(\d{1,2})[\s\.\/-](\d{1,2})[\s\.\/-](\d{4})$/;
var EmailFormat = /^([\w-]{2,})@([A-z\d][-A-z\d]+)\.[A-z]{2,8}/;
var retVal = true;
var errorMsg = "";
if (!NameFormat.test(userF))
{
assignErrorClass("FName");
errorMsg = "First Name is required. 2-12 letters only\n";
retVal = false;
}
if (!NameFormat.test(userL))
{
assignErrorClass("LName");
errorMsg = errorMsg + "Last Name is required. 2-12 letters only\n";
retVal = false;
}
if (!PWFormat.test(userPW))
{
assignErrorClass("pw");
errorMsg = errorMsg + "Password is required. 6-12 letters or numbers only.\n";
retVal = false;
}
if (userPW2 == "")
{
assignErrorClass("pw2");
errorMsg = errorMsg + "Please Retype password.\n";
retVal = false;
}
if ((userPW != userPW2) && (userPW2 !== ""))
{
assignErrorClass("pw2");
errorMsg = errorMsg + "Passwords do not match.\n";
retVal = false;
}
if (userBDay == "")
{
assignErrorClass("BDay");
errorMsg = errorMsg + "Please Enter a Birthday.\n";
retVal = false;
}
if ((!BDayFormat.test(userBDay)) && (userBDay !== ""))
{
assignErrorClass("BDay");
errorMsg = errorMsg + "Incorrect Birthday format\n";
retVal = false;
}
if (badBirthday("BDay") && (userBDay !== "")) {
assignErrorClass("BDay");
retVal = false;
errorMsg = errorMsg + "Invalid Birthday\n";
}
if (userEmail == "")
{
assignErrorClass("email");
errorMsg = errorMsg + "Please Enter an Email address.\n";
retVal = false;
}
if ((!EmailFormat.test(userEmail)) && (userEmail !== ""))
{
assignErrorClass("email");
errorMsg = errorMsg + "Please Enter a valid Email address.\n";
retVal = false;
}
if (!retVal)
{
alert( errorMsg);
}
return retVal;
}
function assignErrorClass(objName)
{
var obj = document.getElementById(objName);
obj.className = "err";
}
function badBirthday( objName) {
var obj = document.getElementById(objName);
var dateStr = obj.value;
var mn = dateStr.split("/")[0];
var dy = dateStr.split("/")[1];
var yr = dateStr.split("/")[2];
var dateObj = new Date(yr,mn-1,dy); //JavaScript and PHP number the months 0 to 11.
if (dateObj.getFullYear() != yr || dateObj.getMonth()+1 != mn || dateObj.getDate() != dy) {
return true;
} else {
return false;
}
}
function checkFName()
{
var userF = document.getElementById('FName').value;
var elementF = document.getElementById('labelFName');
var NameFormat = /^[A-Za-z]{2,12}$/;
if (!NameFormat.test(userF))
{
elementF.innerHTML = "First Name is required. 2-12 letters only";
elementF.style.color = "red";
}
else
{
elementF.innerHTML = "";
elementF.style.color = "green";
}
}
function checkLName()
{
var userL = document.getElementById('LName').value;
var elementL = document.getElementById('labelLName');
var NameFormat = /^[A-Za-z]{2,12}$/;
if (!NameFormat.test(userL))
{
elementL.innerHTML = "Last Name is required. 2-12 letters only";
elementL.style.color = "red";
}
else
{
elementL.innerHTML = "";
elementL.style.color = "green";
}
}
function checkpw()
{
var userPW = document.getElementById('pw').value;
var elementPW = document.getElementById('labelpw');
var PWFormat = /^[A-z0-9]{6,12}$/;
if (!PWFormat.test(userPW))
{
elementPW.innerHTML = "Password is required. 6-12 letters or numbers only.";
elementPW.style.color = "red";
}
else
{
elementPW.innerHTML = "Good Password";
elementPW.style.color = "green";
}
}
function checkpw2()
{
var userPW2 = document.getElementById('pw2').value;
var userPW = document.getElementById('pw').value;
var elementPW2 = document.getElementById('labelpw2');
if ((userPW != userPW2) && (userPW2 !== ""))
{
elementPW2.innerHTML = "Passwords do not match.";
elementPW2.style.color = "red";
}
else if (userPW2 == "")
{
elementPW2.innerHTML = "Please Retype password.";
elementPW2.style.color = "red";
}
else
{
elementPW2.innerHTML = "Passwords Match";
elementPW2.style.color = "green";
}
}
function checkBDay()
{
var userBDay = document.getElementById('BDay').value;
var elementBDay = document.getElementById('labelBDay');
var BDayFormat = /^(\d{1,2})[\s\.\/-](\d{1,2})[\s\.\/-](\d{4})$/;
if (userBDay == "")
{
elementBDay.innerHTML = "Please enter A Birthday.";
elementBDay.style.color = "red";
}
else if ((!BDayFormat.test(userBDay)) && (userBDay !== ""))
{
elementBDay.innerHTML = "Please enter mm/dd/yyyy format.";
elementBDay.style.color = "red";
}
else if ((badBirthday("BDay")) && (userBDay !== ""))
{
elementBDay.innerHTML = "Please enter valid Birthday.";
elementBDay.style.color = "red";
}
else
{
elementBDay.innerHTML = "";
elementBDay.style.color = "green";
}
}
function checkEmail()
{
var userEmail = document.getElementById('email').value;
var elementEmail = document.getElementById('labelEmail');
var EmailFormat = /^([\w-]{2,})@([A-z\d][-A-z\d]+)\.[A-z]{2,8}/;
if ((!EmailFormat.test(userEmail)) && (userEmail !== ""))
{
elementEmail.innerHTML = "Please enter a Valid Email address.";
elementEmail.style.color = "red";
}
else if (userEmail == "")
{
elementEmail.innerHTML = "Please enter an Email address.";
elementEmail.style.color = "red";
}
else
{
elementEmail.innerHTML = "";
elementEmail.style.color = "green";
}
}
heres the html Code: <form action="mailto:hummdedum@felloff.com" method="post" name="form" onSubmit="return isFormValid();">
* First Name: <input type="text" name="FName" id="FName" onblur="checkFName();"/><label id="labelFName"></label><br />
* Last Name: <input type="text" name="LName" id="LName"onblur="checkLName();"/><label id="labelLName"></label><br />
* Password: <input type="password" id="pw" name="Password" onblur="checkpw();"/><label id="labelpw"></label><br />
*Re-type Password: <input type="password" name="2Password" id="pw2" onblur="checkpw2();" /><label id="labelpw2"></label><br />
I am a: <br />
<input type="radio" name="status" value="fresh" /> Freshman<br />
<input type="radio" name="status" value="soph" /> Sophomore<br />
<input type="radio" name="status" value="jr" /> Junior<br />
<input type="radio" name="status" value="sr" /> Senior<br />
I am taking classes in the: <br />
<input type="checkbox" name="semester" value="fall" /> fall time<br />
<input type="checkbox" name="semester" value="spring" /> Spring time <br />
My favorite element is:
<select name="element" id="element">
<option value="">select</option>
<option value="fire">Fire</option>
<option value="earth">Earth</option>
<option value="water">Water</option>
<option value="air">Air</option>
</select><br />
*Birthday: mm/dd/yyyy<input type="text" id="BDay" name="Birthday" onblur="checkBDay();"/><label id="labelBDay"></label><br />
*E-Mail: <input type="text" id="email" name="Email" onblur="checkEmail();"/><label id="labelEmail"></label><br />
<input type="submit" value="Submit" />
<input type="reset" value="Clear" />
</form>
css i guess would be Code: .err {
border: 2px solid #FF0000;}
#errMsg {
font-size: 110%;
color: #FF0000;}
super thanks!!!!!! -pumpkin I have a problem with one simple script, which works in every browser, just not in IE6 and IE7. You can see the script at http://bbtalk.eu/iframe.html - when you click on the iframe, you should see "clicked at the bottom". But it doesnt work in IE6 and IE7. Do anyone know how to fix that? Thank you
SoftDivScroll adds #anchorname if clicked from a different page yet it doesn't on the same page Quote: -home.php --#anchor1 services.php --#anchor2 when on home.php, you click the link for #anchor1 it doesn't add #anchor1 to the URL which is perfect. when on services.php, you click the anchor link for home.php#anchor1 you get home.php#anchor1, now when you refresh the page it scrolls to last anchor. Anyone else come accross this? Quote: one idea is an if then else or switch based on referrer, that means I need all the URLs in an array and only allow from pages within the array? emailed the developer using their contact form which seems non-working Realizing that form input placeholders aren't universally recognized among browsers, I began changing all of mine using onblur and onfocus handlers instead. As an example, I used the following code, which works in most cases: Code: <input type="text" name="example" maxlength="5" value="Example" onblur="if(this.value=='') this.value='Example';" onfocus="if(this.value=='Example') this.value='';"/> At first, I coded all of the inputs without a value attribute. But, when the page initially loaded, the fields would load empty, and the value/placeholder wouldn't appear until the field had been "focused" and then "blurred" again. Adding the value attribute seemed to correct that problem, again, for the most part. I have some text fields that appear only after I select a particular radio button or select option. Problem is, when the radio is clicked, the field appears, but even with the value attribute in place, the field appears void. I'm not sure what is different, or what I'm doing wrong. Here's the javascript code with the radio button (note:everything works except that the "placeholder" doesn't show when the field first appears): Code: function showfield() {
document.forms[0].otherRelation.value = "";
document.getElementById("newBox").style.display = "none";
var r = document.forms[0].relation;
var len = r.length;
for (var i =0; i<len; i++) {
if (r[i].checked && r[i].value == "Otherrelation" ) {
document.getElementById("newBox").style.display = "inline";
}
}
}
<input type="radio" name="relation" value="Otherrelation" onclick="showfield()"/>Other
<span id = "newBox" style="display:none">:
<input type = "text" name="otherRelation" size="35" value="Your Relationship" onblur="if(this.value=='') this.value='Your Relationship';" onfocus="if(this.value=='Your Relationship') this.value='';"/>
</span>
Thanks for any help. Sorry so long. |
|||||||