|
JavaScript - Object.style.backgroundcolor="color|inherit|transparent"
Hi,
There is a live search on my web page but the box of available options which falls below the 'input' field has a transparent background color. How can it be changed to non-transparent? This line below makes the background white, but all the text on the page shines through, since the default is transparent. [CODE] document.getElementById("linksearch").style.backgroundColor="#FFFFFF"; [CODE] This instruction line does not help much 'cos I can't figure out the correct way to make it work: [CODE] Object.style.backgroundColor="color|inherit|transparent". [CODE] Thanks. Similar TutorialsHi and thanks in advance! Someone on this site made a form for me that hides and displays fields, depending on which variable is chosen from a given array. They did a very good job with it with one exception. It seems the code that is used to hide certain fields also hides the form data rather than posting it when the form is submitted. Here is the code for both the java (listed first) and the form itself. Code: // Funtion
// Description: show or hide element in the form according to selected element
//
function show_hide(){
if (!document.getElementById) return false;
fila = document.getElementById('tr_firstname');
fila.style.display = "none"; //hide
fila = document.getElementById('tr_firstname_data');
fila.style.display = "none"; //hide
fila = document.getElementById('tr_email');
fila.style.display = "none"; //hide
fila = document.getElementById('tr_email_data');
fila.style.display = "none"; //hide
fila = document.getElementById('tr_email');
fila.style.display = "none"; //hide
fila = document.getElementById('tr_email_data');
fila.style.display = "none"; //hide
fila = document.getElementById('tr_receipt_invoice');
fila.style.display = "none"; //hide
fila = document.getElementById('tr_receipt_invoice_data');
fila.style.display = "none"; //hide
fila = document.getElementById('tr_url');
fila.style.display = "none"; //hide
fila = document.getElementById('tr_url_data');
fila.style.display = "none"; //hide
fila = document.getElementById('tr_description_comments');
fila.style.display = "none"; //hide
fila = document.getElementById('tr_description_comments_data');
fila.style.display = "none"; //hide
var strtext ;
var nuoption= document.frmbodydata.csreason.length;
var nuindice = document.frmbodydata.csreason.selectedIndex;
var nuvalueSelect = document.frmbodydata.csreason.options[nuindice].value;
var strtextSelect = document.frmbodydata.csreason.options[nuindice].text;
if (nuvalueSelect==0 )
{
return;
}
fila = document.getElementById('tr_description_comments');
fila.style.display = ""; //show
fila = document.getElementById('tr_description_comments_data');
fila.style.display = ""; //show
if (nuvalueSelect==1 || nuvalueSelect==3 || nuvalueSelect==4 || nuvalueSelect==5 )
{
fila = document.getElementById('tr_firstname');
fila.style.display = ""; //show
fila = document.getElementById('tr_firstname_data');
fila.style.display = ""; //show
fila = document.getElementById('tr_email');
fila.style.display = ""; //show
fila = document.getElementById('tr_email_data');
fila.style.display = ""; //show
}
if (nuvalueSelect==2 || nuvalueSelect==3 || nuvalueSelect==4 || nuvalueSelect==5 )
{
fila = document.getElementById('tr_url');
fila.style.display = ""; //show
fila = document.getElementById('tr_url_data');
fila.style.display = ""; //show
}
if (nuvalueSelect==4 )
{
fila = document.getElementById('tr_receipt_invoice');
fila.style.display = ""; //show
fila = document.getElementById('tr_receipt_invoice_data');
fila.style.display = ""; //show
}
}
//
// Function
// Description: Validate the form for submit
//
function ValidateForm( form ) {
var nuindice = form.csreason.selectedIndex;
var nuvalueSelect = form.csreason.options[nuindice].value;
if (nuvalueSelect==0 )
{
return false;
}
valor = form.receipt_invoice.value;
if (!freturn(valor)) return false;
valor = form.description_comments.value;
if (!freturn(valor)) return false;
if (nuvalueSelect==1 || nuvalueSelect==3 || nuvalueSelect==4 || nuvalueSelect==5 )
{
valor = form.firstname.value;
if (!freturn(valor)) return false;
}
valor = form.lastname.value;
if (!freturn(valor)) return false;
valor = form.email.value;
if (!freturn(valor)) return false;
if (nuvalueSelect==2 || nuvalueSelect==3 || nuvalueSelect==4 || nuvalueSelect==4 )
{
valor = form.url.value;
if (!freturn(valor)) return false;
}
alert ("Thank you for your comment.")
return true
}
//
// Function
// Description: Function to return TRUE or FALSE for inclomplete data
//
/*function freturn(pbolvalue)
{
if( pbolvalue == null || pbolvalue.length == 0 || /^\s+$/.test(pbolvalue) )
{
alert ("Incomplete Data, check please.");
return false;
}else{
return true;
}
}
*/
function ReloadCaptchaImage(captchaImageId)
{
var obj = document.getElementById(captchaImageId);
var src = obj.src;
var date = new Date();
var pos = src.indexOf('&rad=');
if (pos >= 0) { src = src.substr(0, pos); }
obj.src = src + '&rad=' + date.getTime();
return false;
}
Code: <center> <form id="frmbodydata" name="frmbodydata" onsubmit="return ValidateForm(this);" action="http://www.SnapHost.com/captcha/WebFormSubmit.aspx" method="post"> <input id="SnapHostID" name="SnapHostID" value="2FMYX5LLTQZQ" type="hidden" />
<table align="center" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td>Reason for contact</td>
</tr>
<tr>
<td><select id="csreason" name="csreason" onchange="show_hide();" align="left"> <option value="0">Please Select One</option> <option value="1">Contact</option> <option value="2">Report Bad Link</option> <option value="3">Gallery Submission</option> <option value="4">Preferred Partner Submission</option> <option value="5">Link Exchange</option> </select></td>
</tr>
<tr id="tr_firstname" style="display:none;">
<td>First name/Last name</td>
</tr>
<tr id="tr_firstname_data" style="display:none;">
<td><input id="firstname" /><input id="lastname" align="left" type="text" /></td>
</tr>
<tr id="tr_email" style="display:none;">
<td>Email</td>
</tr>
<tr id="tr_email_data" style="display:none;">
<td><input id="email" size="30" maxlength="30" align="left" type="text" /></td>
</tr>
<tr id="tr_receipt_invoice" style="display:none;">
<td>Receipt/Invoice</td>
</tr>
<tr id="tr_receipt_invoice_data" style="display:none;">
<td><input id="receipt_invoice" name="receipt_invoice" size="15" maxlength="15" align="left" type="text" /></td>
</tr>
<tr id="tr_url" style="display:none;">
<td>URL</td>
</tr>
<tr id="tr_url_data" style="display:none;">
<td><input id="url" size="80" maxlength="80" align="left" type="text" /></td>
</tr>
<tr id="tr_description_comments" style="display:none;">
<td>Description/Comments</td>
</tr>
<tr id="tr_description_comments_data" style="display:none;">
<td><textarea id="description_comments" rows="10" cols="50" align="left"> </textarea></td>
</tr>
<tr>
<td><i>Enter security code</i></td>
<td>SECURITY CODE</td>
</tr>
<tr>
<td><input name="CaptchaCode" class="txtFields" maxlength="6" style="width:130px; height:28px; font-size:24px; text-align:center;" type="text" /></td>
<td><a href="http://www.SnapHost.com/captcha/ProCaptchaOverview.aspx"><img id="CaptchaImage" alt="Web Form Code" style="margin-left:20px; border:1px
solid #999999;" src="http://www.SnapHost.com/captcha/WebForm.aspx?id=2FMYX5LLTQZQ&ImgType=2" /></a> <br /> <a href="#" onclick="return ReloadCaptchaImage('CaptchaImage');"><span style="font-size:12px;">reload image</span></a></td>
</tr>
<tr>
<td align="center"><input src="http://www.theopenpussy.com/1/images/submit.gif" alt="Submit button" type="image" /></td>
</tr>
<tr>
<td></td>
</tr>
</tbody>
</table>
</form> </center>
Sorry for all the code! Is there anything I can do to maintain the hide and seek nature of the forms and show the data that is submitted, or am I stuck displaying all fields all the time? Hi, I'm trying to use a form which is existent on one of my sites and try re-creating a similar form on another site for the exact same purpose. Here is the URL for the form on our website Cast Iron Cookware Depot. I have everything duplicated but running into form validation errors. Right now without event entering any data into the form and also the verification code the form still gets submitted but ofcourse runs into "object expected" error at onsubmit="return validate(this);"> by IE Debugger. Below is the total code and would appreciate if any of you gurus point out where the mistake is and also why the exact same code is working on one site is not working on this site. Thanks much in advance. Please help me! ------------------------------------------------------------------------ Code:
<style>
.TableBG
{
background-color: #83a338;
color: #ffffff;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
}
.no
{
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #333333;
width: 35px;
text-align:right;
}
input, textarea {border: 1px inset #cccccc; font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; font-size: 12px;}
.input01 {width: 150px;}
.input02 {width: 250px;}
.button
{
background-color: #83a338;
color: #000000;
border: 1px outset #83a338;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; font-weight: bold; font-size: 12px;
}
</style><br />
<br />
<table width="600" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#FFFFFF" class="TableBG">
<tr>
<td bgcolor="#FFFFFF">
<FORM name="form1" method="POST" action="http://s.p8.hostingprod.com/@castironcookwaredepot.com/php/tellafriend.php" onsubmit="return validate(this);">
<FORM name="form1" method="POST" action="http://s.p4.hostingprod.com/@bestsafetyapparel.com/php/tellafriend.php" onsubmit="return validate(this);">
<table width="100%" border="0" cellpadding="5" cellspacing="0">
<tr>
<td class="TableBG"> </td>
<td class="TableBG"><strong>Your Name: </strong></td>
<td class="TableBG"><strong>Your Email: </strong></td>
</tr>
<tr>
<td colspan="3" height="5"></td>
</tr>
<tr>
<td> </td>
<td>
<input type="text" name="sName" class="input01" style="font-weight: bold;" /> </td>
<td>
<input type="text" name="sEmail" class="input02" size="40" style="font-weight: bold;" /> </td>
</tr>
<tr>
<td colspan="3" height="5"></td>
</tr>
<tr>
<td width="4%" class="TableBG"> </td>
<td width="36%" class="TableBG"> Your Friend's Name :</td>
<td width="60%" class="TableBG">Your Friend's Email:</td>
</tr>
<tr>
<td colspan="3" height="5"></td>
</tr>
<tr>
<td class="no"><strong>1.</strong></td>
<td>
<input type="text" name="name1" class="input01" /> </td>
<td>
<input type="text" name="email1" class="input02" size="40" /> </td>
</tr>
<tr>
<td class="no"><strong>2.</strong></td>
<td>
<input type="text" name="name2" class="input01" /> </td>
<td>
<input type="text" name="email2" class="input02" size="40" /> </td>
</tr>
<tr>
<td class="no"><strong>3.</strong></td>
<td>
<input type="text" name="name3" class="input01" /> </td>
<td>
<input type="text" name="email3" class="input02" size="40" /> </td>
</tr>
<tr>
<td class="no"><strong>4.</strong></td>
<td>
<input type="text" name="name4" class="input01" /> </td>
<td>
<input type="text" name="email4" class="input02" size="40" /> </td>
</tr>
<tr>
<td class="no"><strong>5.</strong></td>
<td>
<input type="text" name="name5" class="input01" /> </td>
<td>
<input type="text" name="email5" class="input02" size="40" /> </td>
</tr>
<tr>
<td class="TableBG"> </td>
<td colspan="2" class="TableBG">Your Message </td>
</tr>
<tr>
<td colspan="3" height="5"></td>
</tr>
<tr>
<td colspan="3" align="center">
<textarea name="comments" cols="65" rows="5" id="comments" style="width: 420px;"></textarea> </td>
</tr>
<tr>
<td class="TableBG"> </td>
<td colspan="3" class="TableBG">Enter Verification Code</td>
</tr>
<tr>
<td colspan="3" height="5"></td>
</tr>
<tr>
<td colspan="3" align="center" valign="absmiddle"><img src="http://s.p8.hostingprod.com/@castironcookwaredepot.com/php/captcha.php" align="absmiddle">
<input type="text" name="vercode" value="Enter Verification Code" onFocus="if(this.value=='Enter Verification Code') this.value='';" onBlur="if(this.value=='') this.value='Enter Verification Code';" size="25"/></td>
</tr>
<tr>
<td colspan="3" align="center">
<input type="submit" name="Submit" value=" Send Email " class="button" /> </td>
</tr>
</table>
</form>
</td>
</tr>
</table>
<script>
function validate(frm)
{
name = frm.sName;
email = frm.sEmail;
name1=frm.name1;
email1=frm.email1;
err_flag = 0;
if (name.value == "" || !removeSpaces(name.value))
{
alert ("Please enter proper Name!");
name.value="";
name.focus();
return false;
}
else if (email.value == "" || !validate_email(email.value))
{
alert ("Please enter proper Email!");
email.value="";
email.focus();
return false;
}
else if (name1.value == "" || !removeSpaces(name1.value))
{
alert ("Please enter proper Friend\'s Name!");
name1.value="";
name1.focus();
return false;
}
else if (email1.value == "" || !validate_email(email1.value))
{
alert ("Please enter proper Friend\'s Email!");
email1.value="";
email1.focus();
return false;
}
}
function validate_email(e)
{
var str=e;
var filter=/^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i
if (!filter.test(str))
return false;
else
return true;
}
function removeSpaces(string) {
var tstring = "";
string = '' + string;
splitstring = string.split(" ");
for(i = 0; i < splitstring.length; i++)
tstring += splitstring[i];
return tstring;
}
</script>
<br />
<br />
Regards Learner Hello there! I am completely new to these forums and to programming in general (however, I used to program some games, albeit not very good ones, on a version of BASIC that came with my Playstation 2 about 10 years ago hehe). I have a basic understanding of functions, loops, if/else/switch and an extremely basic understanding of objects/methods. I wanted to consolidate my knowledge by putting it to practical use so I have made a little text adventure game. At the moment it is horrendously non-user-friendly as it has just been me experimenting with functions, if/else statements etc. Anyway, below is my code and I have two specific questions regarding it (but general answers telling me how I could do things more efficiently OR telling me what I should consider studying would be very appreciate also :)). Firstly, I have a little inventory object up top and when the player picks up something in the game I change the inv item to "true" so they can use it later (it seemed logical!). I would really love to know how the user could type in "inv" and for their inventory to be shown back to them. i.e. How could I show only the "true" items of an object? I have tried coding this myself but I really am stumped for an answer. Secondly, you can see in the "north21" function within the "north2" function that I used a series of if/else statements instead of a switch. I would have much prefered to use a switch and then for the case of "go north" have an if/else statement to check if vineclear is true or not (so that they can pass through to the non-existent north3 room). Is this possible? You can use if/else statements within an if/else statement but it seemed when I tried doing that in a switch it didn't like it. I am running this script through an interpreter to play the "game". I understand that JS probably isn't the best for what I am trying to do, it was more just a "see what I can do" exercise more than anything. Thanks in advance for your help and please be nice to me, forums scare me generally :D testgame.txt I have to attach the code in a txt file as for some reason it wasn't displaying properly when I copied and pasted it here. Apologies! Reply With Quote 01-17-2015, 08:26 PM #2 Old Pedant View Profile View Forum Posts Supreme Master coder! Join Date Feb 2009 Posts 28,310 Thanks 82 Thanked 4,754 Times in 4,716 Posts Briefly: Code: // based on this:
var inv = {
sword: false,
shield: false,
vines: false
};
// try this:
function displayInventory( )
{
var list = [ ];
for ( var item in inv )
{
if ( inv[item] == true )
{
list.push( item );
}
}
if ( list.length == 0 )
{
return "You have no items in your inventory";
}
return "You have these items in your inventory:<ul><li>"
+ list.join("</li><li>") + "</ul>";
}
My code is designed for display in an HTML page, not for use in clumsy console.log( ) coding. prompt() and alert() and confirm() and document.write() and console.log() should be used ONLY when debugging, not for any real work. But if you must use console.log, then try this, to replace the code in italics: Code: return "You have these items in your inventory: " + list.join(",");
Below are the full Javascript and HTML to detect a browser and either display HTML5 or Flash video. However, the script is returning an error, 'document.getElementById(...)' is null or not an object. Any suggestions? Code: var deviceAgent = navigator.userAgent.toLowerCase();
$brwzr = deviceAgent.match(/(chrome|firefox|safari|msie 9.0)/);
if ($brwzr) {
document.getElementById("video_5").setAttribute("class", "on");
}
else {
document.getElementById("video_F").setAttribute("class", "on");
}
Code: <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Video Switch</title>
<script language="JavaScript" src="index/js/detect.js"></script>
<style>
<!--
.off {
display: none;
}
.on {
display: inline;
}
-->
</style>
</head>
<body>
<div id="video_5" class="off">HTML5!</div>
<div id="video_F" class="off">Flash!</div>
</body>
</html>
I am running on Magento eCommerce, however please don't turn away if you have no experience with it. Problem is with JavaScript. When one clicks on the button, nothing happens, when the page loads browsers in general display error message, that 'productAddtoCartForm' is null or not an object Here's the piece of code around the Add button: Code: <div class="product-view">
<div class="product-essential">
<form action="http://myhairpalace.com/index.php/default/checkout/cart/add/uenc/aHR0cDovL215aGFpcnBhbGFjZS5jb20vaW5kZXgucGhwL2RlZmF1bHQvaW5kaWFuLXJlbXktZnJvbnQvMTAwLWh1bWFuLWhhaXItbGFjZS1mcm9udC13aWctc3V6aWUuaHRtbD9fX19TSUQ9VQ,,/product/57/" method="post" id="product_addtocart_form" enctype="multipart/form-data">
<div class="no-display">
<input type="hidden" name="product" value="57� />
<input type=" hidden"="" id="related-products-field" product-shop"="">
<div class="product-name">
<h1>100% Human Hair Lace Front Wig-Suzie</h1>
</div>
<p class="email-friend"><a href="http://myhairpalace.com/index.php/default/sendfriend/product/send/id/57/cat_id/11/">Email to a Friend</a></p>
<p class="no-rating"><a href="http://myhairpalace.com/index.php/default/review/product/list/id/57/category/11/#review-form">Be the first to review this product</a></p>
<p class="availability in-stock">Availability: <span>In stock</span></p>
<div class="price-box">
<span class="regular-price" id="product-price-57">
<span class="price">$75.00</span> </span>
</div>
<ul class="add-to-links">
<li><a href="http://myhairpalace.com/index.php/default/wishlist/index/add/product/57/" class="link-wishlist">Add to Wishlist</a></li>
<li><span class="separator">|</span> <a href="http://myhairpalace.com/index.php/default/catalog/product_compare/add/product/57/uenc/aHR0cDovL215aGFpcnBhbGFjZS5jb20vaW5kZXgucGhwL2RlZmF1bHQvaW5kaWFuLXJlbXktZnJvbnQvMTAwLWh1bWFuLWhhaXItbGFjZS1mcm9udC13aWctc3V6aWUuaHRtbD9fX19TSUQ9VQ,,/" class="link-compare">Add to Compare</a></li>
</ul>
<div class="short-description">
<h2>Quick Overview</h2>
<div class="std">Suzie</div>
</div>
</div>
<div class="product-img-box">
<p class="product-image product-image-zoom">
<img id="image" src="http://myhairpalace.com/media/catalog/product/cache/1/image/9df78eab33525d08d6e5fb8d27136e95/l/a/lace_front-shan.jpg" alt="100% Human Hair Lace Front Wig-Suzie" title="100% Human Hair Lace Front Wig-Suzie"></p>
<p class="zoom-notice" id="track_hint">Double click on above image to view full picture</p>
<div class="zoom">
<img id="zoom_out" src="http://myhairpalace.com/skin/frontend/default/default/images/slider_btn_zoom_out.gif" alt="Zoom Out" title="Zoom Out" class="btn-zoom-out">
<div id="track">
<div id="handle"></div>
</div>
<img id="zoom_in" src="http://myhairpalace.com/skin/frontend/default/default/images/slider_btn_zoom_in.gif" alt="Zoom In" title="Zoom In" class="btn-zoom-in">
</div>
<script type="text/javascript">
//<![CDATA[
Event.observe(window, 'load', function() {
product_zoom = new Product.Zoom('image', 'track', 'handle', 'zoom_in', 'zoom_out', 'track_hint');
});
//]]>
</script>
<div class="more-views">
<h2>More Views</h2>
<ul>
<li>
<a href="#" onclick="popWin('http://myhairpalace.com/index.php/default/catalog/product/gallery/id/57/image/56/', 'gallery', 'width=300,height=300,left=0,top=0,location=no,status=yes,scrollbars=yes,resizable=yes'); return false;" title=""><img src="http://myhairpalace.com/media/catalog/product/cache/1/thumbnail/56x/9df78eab33525d08d6e5fb8d27136e95/l/a/lace_front-shan.jpg" width="56" height="56" alt=""></a>
</li>
</ul>
</div>
</div>
<div class="clearer"></div>
<div class="product-options" id="product-options-wrapper">
<script type="text/javascript">
//<![CDATA[
var DateOption = Class.create({
getDaysInMonth: function(month, year)
{
var curDate = new Date();
if (!month) {
month = curDate.getMonth();
}
if (2 == month && !year) { // leap year assumption for unknown year
return 29;
}
if (!year) {
year = curDate.getFullYear();
}
return 32 - new Date(year, month - 1, 32).getDate();
},
reloadMonth: function(event)
{
var selectEl = event.findElement();
var idParts = selectEl.id.split("_");
if (idParts.length != 3) {
return false;
}
var optionIdPrefix = idParts[0] + "_" + idParts[1];
var month = parseInt($(optionIdPrefix + "_month").value);
var year = parseInt($(optionIdPrefix + "_year").value);
var dayEl = $(optionIdPrefix + "_day");
var days = this.getDaysInMonth(month, year);
//remove days
for (var i = dayEl.options.length - 1; i >= 0; i--) {
if (dayEl.options[i].value > days) {
dayEl.remove(dayEl.options[i].index);
}
}
// add days
var lastDay = parseInt(dayEl.options[dayEl.options.length-1].value);
for (i = lastDay + 1; i <= days; i++) {
this.addOption(dayEl, i, i);
}
},
addOption: function(select, text, value)
{
var option = document.createElement('OPTION');
option.value = value;
option.text = text;
if (select.options.add) {
select.options.add(option);
} else {
select.appendChild(option);
}
}
});
var dateOption = new DateOption();
//]]>
</script>
<script type="text/javascript">
//<![CDATA[
var optionFileUpload = {
productForm : $('product_addtocart_form'),
formAction : '',
formElements : {},
upload : function(element){
this.formElements = this.productForm.select('input', 'select', 'textarea', 'button');
this.removeRequire(element.readAttribute('id').sub('option_', ''));
template = '<iframe id="upload_target" name="upload_target" style="width:0; height:0; border:0;"><\/iframe>';
Element.insert($('option_'+element.readAttribute('id').sub('option_', '')+'_uploaded_file'), {after: template});
this.formAction = this.productForm.action;
var baseUrl = 'http://myhairpalace.com/index.php/default/catalog/product/upload/';
var urlExt = 'option_id/'+element.readAttribute('id').sub('option_', '');
this.productForm.action = parseSidUrl(baseUrl, urlExt);
this.productForm.target = 'upload_target';
this.productForm.submit();
this.productForm.target = '';
this.productForm.action = this.formAction;
},
removeRequire : function(skipElementId){
for(var i=0; i<this.formElements.length; i++){
if (this.formElements[i].readAttribute('id') != 'option_'+skipElementId+'_file' && this.formElements[i].type != 'button') {
this.formElements[i].disabled='disabled';
}
}
},
addRequire : function(skipElementId){
for(var i=0; i<this.formElements.length; i++){
if (this.formElements[i].readAttribute('name') != 'options_'+skipElementId+'_file' && this.formElements[i].type != 'button') {
this.formElements[i].disabled='';
}
}
},
uploadCallback : function(data){
this.addRequire(data.optionId);
$('upload_target').remove();
if (data.error) {
} else {
$('option_'+data.optionId+'_uploaded_file').value = data.fileName;
$('option_'+data.optionId+'_file').value = '';
$('option_'+data.optionId+'_file').hide();
$('option_'+data.optionId+'').hide();
template = '<div id="option_'+data.optionId+'_file_box"><a href="#"><img src="var/options/'+data.fileName+'" alt=""><\/a><a href="#" onclick="optionFileUpload.removeFile('+data.optionId+')" title="Remove file" \/>Remove file<\/a>';
Element.insert($('option_'+data.optionId+'_uploaded_file'), {after: template});
}
},
removeFile : function(optionId)
{
$('option_'+optionId+'_uploaded_file').value= '';
$('option_'+optionId+'_file').show();
$('option_'+optionId+'').show();
$('option_'+optionId+'_file_box').remove();
}
}
var optionTextCounter = {
count : function(field,cntfield,maxlimit){
if (field.value.length > maxlimit){
field.value = field.value.substring(0, maxlimit);
} else {
cntfield.innerHTML = maxlimit - field.value.length;
}
}
}
Product.Options = Class.create();
Product.Options.prototype = {
initialize : function(config){
this.config = config;
this.reloadPrice();
},
reloadPrice : function(){
price = new Number();
config = this.config;
skipIds = [];
$$('.product-custom-option').each(function(element){
var optionId = 0;
element.name.sub(/[0-9]+/, function(match){
optionId = match[0];
});
if (this.config[optionId]) {
if (element.type == 'checkbox' || element.type == 'radio') {
if (element.checked) {
if (config[optionId][element.getValue()]) {
price += parseFloat(config[optionId][element.getValue()]);
}
}
} else if(element.hasClassName('datetime-picker') && !skipIds.include(optionId)) {
dateSelected = true;
$$('.product-custom-option[id^="options_' + optionId + '"]').each(function(dt){
if (dt.getValue() == '') {
dateSelected = false;
}
});
if (dateSelected) {
price += parseFloat(this.config[optionId]);
skipIds[optionId] = optionId;
}
} else if(element.type == 'select-one' || element.type == 'select-multiple') {
if (element.options) {
$A(element.options).each(function(selectOption){
if (selectOption.selected) {
if (this.config[optionId][selectOption.value]) {
price += parseFloat(this.config[optionId][selectOption.value]);
}
}
});
}
} else {
if (element.getValue().strip() != '') {
price += parseFloat(this.config[optionId]);
}
}
}
});
try {
optionsPrice.changePrice('options', price);
optionsPrice.reload();
} catch (e) {
}
}
}
function validateOptionsCallback(elmId, result){
var container = $(elmId).up('ul.options-list');
if (result == 'failed') {
container.removeClassName('validation-passed');
container.addClassName('validation-failed');
} else {
container.removeClassName('validation-failed');
container.addClassName('validation-passed');
}
}
var opConfig = new Product.Options({"80":{"447":0,"448":0,"451":0,"452":0,"449":0,"450":0,"454":0,"453":0}});
//]]>
</script>
<dl>
<dt><label>Color<span class="required"> *</span></label></dt>
<dd class="last">
<select name="options[80]" id="select_80" class=" required-entry product-custom-option" title="" onchange="opConfig.reloadPrice()"><option value="">-- Please Select --</option><option value="447">1 </option><option value="448">1B </option><option value="451">1B/30 </option><option value="452">1B/33 </option><option value="449">2 </option><option value="450">4 </option><option value="454">4/27 </option><option value="453">4/30 </option></select> </dd>
</dl>
<script type="text/javascript">
//<![CDATA[
enUS = {"m":{"wide":["January","February","March","April","May","June","July","August","September","October","November","December"],"abbr":["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]}}; // en_US locale reference
Calendar._DN = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"]; // full day names
Calendar._SDN = ["Sun","Mon","Tue","Wed","Thu","Fri","Sat"]; // short day names
Calendar._FD = 0; // First day of the week. "0" means display Sunday first, "1" means display Monday first, etc.
Calendar._MN = ["January","February","March","April","May","June","July","August","September","October","November","December"]; // full month names
Calendar._SMN = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]; // short month names
Calendar._am = "AM"; // am/pm
Calendar._pm = "PM";
// tooltips
Calendar._TT = {};
Calendar._TT["INFO"] = "About the calendar";
Calendar._TT["ABOUT"] =
"DHTML Date/Time Selector\n" +
"(c) dynarch.com 2002-2005 / Author: Mihai Bazon\n" +
"For latest version visit: http://www.dynarch.com/projects/calendar/\n" +
"Distributed under GNU LGPL. See http://gnu.org/licenses/lgpl.html for details." +
"\n\n" +
"Date selection:\n" +
"- Use the \xab, \xbb buttons to select year\n" +
"- Use the " + String.fromCharCode(0x2039) + ", " + String.fromCharCode(0x203a) + " buttons to select month\n" +
"- Hold mouse button on any of the above buttons for faster selection.";
Calendar._TT["ABOUT_TIME"] = "\n\n" +
"Time selection:\n" +
"- Click on any of the time parts to increase it\n" +
"- or Shift-click to decrease it\n" +
"- or click and drag for faster selection.";
Calendar._TT["PREV_YEAR"] = "Prev. year (hold for menu)";
Calendar._TT["PREV_MONTH"] = "Prev. month (hold for menu)";
Calendar._TT["GO_TODAY"] = "Go Today";
Calendar._TT["NEXT_MONTH"] = "Next month (hold for menu)";
Calendar._TT["NEXT_YEAR"] = "Next year (hold for menu)";
Calendar._TT["SEL_DATE"] = "Select date";
Calendar._TT["DRAG_TO_MOVE"] = "Drag to move";
Calendar._TT["PART_TODAY"] = ' (' + "Today" + ')';
// the following is to inform that "%s" is to be the first day of week
Calendar._TT["DAY_FIRST"] = "Display %s first";
// This may be locale-dependent. It specifies the week-end days, as an array
// of comma-separated numbers. The numbers are from 0 to 6: 0 means Sunday, 1
// means Monday, etc.
Calendar._TT["WEEKEND"] = "0,6";
Calendar._TT["CLOSE"] = "Close";
Calendar._TT["TODAY"] = "Today";
Calendar._TT["TIME_PART"] = "(Shift-)Click or drag to change value";
// date formats
Calendar._TT["DEF_DATE_FORMAT"] = "%b %e, %Y";
Calendar._TT["TT_DATE_FORMAT"] = "%B %e, %Y";
Calendar._TT["WK"] = "Week";
Calendar._TT["TIME"] = "Time:";
//]]>
</script>
<p class="required">* Required Fields</p>
</div>
<script type="text/javascript">decorateGeneric($$('#product-options-wrapper dl'), ['last']);</script>
<div class="product-options-bottom">
<div class="price-box">
<span class="regular-price" id="product-price-57_clone">
<span class="price">$75.00</span> </span>
</div>
<div class="add-to-cart">
<label for="qty">Qty:</label>
<input type="text" name="qty" id="qty" maxlength="12" value="1" title="Qty" class="input-text qty">
<button type="button" title="Add to Cart" class="button btn-cart" onclick="productAddToCartForm.submit()"><span><span>Add to Cart</span></span></button>
<p class="paypal-logo"><a id="ec_shortcut_c2e3fb1be4b9e9d53800cbc4d5f1e274" href="http://myhairpalace.com/index.php/default/paypal/express/start/">
<img src="https://fpdbs.paypal.com/dynamicimageweb?cmd=_dynamic-image&buttontype=ecshortcut&locale=en_US" alt="Checkout with PayPal">
</a>
<input type="hidden" id="pp_checkout_url" name="return_url" value="">
<script type="text/javascript">
//<![CDATA[
Event.observe('ec_shortcut_c2e3fb1be4b9e9d53800cbc4d5f1e274', 'click', function(event) {
$('pp_checkout_url').value = this.href;
productAddToCartForm.submit();
event.stop();
});
//]]>
</script></p> </div>
</div>
</form>
<script type="text/javascript">
//<![CDATA[
var productAddToCartForm = new VarienForm('product_addtocart_form');
productAddToCartForm.submit = function(){
if (this.validator.validate()) {
this.form.submit();
}
}.bind(productAddToCartForm);
//]]>
</script>
</div>
<div class="product-collateral">
<div class="box-collateral box-description">
<h2>Details</h2>
<div class="std">
Nautral Hairline 100% Human Hair Lace Front wig. </div>
</div>
<div class="box-collateral box-tags">
<h2>Product Tags</h2>
<form id="addTagForm" action="http://myhairpalace.com/index.php/default/tag/index/save/product/57/uenc/aHR0cDovL215aGFpcnBhbGFjZS5jb20vaW5kZXgucGhwL2RlZmF1bHQvaW5kaWFuLXJlbXktZnJvbnQvMTAwLWh1bWFuLWhhaXItbGFjZS1mcm9udC13aWctc3V6aWUuaHRtbD9fX19TSUQ9VQ,,/" method="get">
<div class="form-add">
<label for="productTagName">Add Your Tags:</label>
<div class="input-box">
<input type="text" class="input-text required-entry" name="productTagName" id="productTagName">
</div>
<button type="button" title="Add Tags" class="button" onclick="submitTagForm()">
<span>
<span>Add Tags</span>
</span>
</button>
</div>
</form>
<p class="note">Use spaces to separate tags. Use single quotes (') for phrases.</p>
<script type="text/javascript">
//<![CDATA[
var addTagFormJs = new VarienForm('addTagForm');
function submitTagForm(){
if(addTagFormJs.validator.validate()) {
addTagFormJs.form.submit();
}
}
//]]>
</script>
</div>
</div>
</div>
Magento uses Prototype framework and the problem has something to do with prototype.js file and indeed, when I debugged in Chrome, here's what came up: Now, the crux is that the error shows up only pages featuring products w/ options in dropdown menus: http://myhairpalace.com/index.php/de...inkerbell.html You are able to add Simple Products to cart just fine: http://myhairpalace.com/index.php/de...o-measure.html I would be incredibly grateful for ANY suggestions. This is a common issue, however, I haven't found anything ( yet ) that points out a solution that I can find in my code. As usual, this site works with every single browser known to man ...........except for any version of IE. I have tried using IE's devel tools to no avail ....though I'm a complete newb, so that isn't saying much. Code??? Here's the section IE complains about: Code: function display(str)
{
var nodeList = xmlDoc.getElementsByTagName("item");
var cnt = 0;
var list = "<hr />";
for(var i=0; i< nodeList.length; i++)
{
cnt++;
// Get vars from XML
title = nodeList[i].getElementsByTagName("title")[0].childNodes[0].nodeValue;
author = nodeList[i].getElementsByTagName("author")[0].childNodes[0].nodeValue;
pubDate = nodeList[i].getElementsByTagName("pubDate")[0].childNodes[0].nodeValue;
call = nodeList[i].getElementsByTagName("call")[0].childNodes[0].nodeValue;
cover = nodeList[i].getElementsByTagName("cover")[0].childNodes[0].nodeValue;
link = nodeList[i].getElementsByTagName("link")[0].childNodes[0].nodeValue;
summary = nodeList[i].getElementsByTagName("summary")[0].childNodes[0].nodeValue;
style = nodeList[i].getElementsByTagName("class")[0].childNodes[0].nodeValue;
page = nodeList[i].getElementsByTagName("page")[0].childNodes[0].nodeValue;
category = nodeList[i].getElementsByTagName("category")[0].childNodes[0].nodeValue;
I opened this with Firebug and I see nothing of interest. Specifically, IE complains about line 86: Code: summary = nodeList[i].getElementsByTagName("summary")[0].childNodes[0].nodeValue;
Thanks for reading ~ Bub **** UPDATE ***** Well ...it looks like I can't have null values in any elements ( in the xml document ). How do you experts satisfy this requirement in an elegant fashion. Since there is no data for certain elements, I'm looking for a reasonable failover solution. Empty quotes? ..... still experimenting. A script produces the xml file from a database so some elements do not have data for certain child elements. **** UPDATE 2 ***** Using the Unicode non-breaking space in the xml file for empty child elements. Works, but if you have a cooler solution, let me know. Thanks! Hi. I'm trying to make a web site with javascript validation...But I kind of hit a bump... Code: <html>
<head>
<script language="javascript">
<!--
function Val_bn_c(){
if(document.site.Bn_c_pr_n[1].checked){
document.site.Bn_c_p_n.style.display=""}
else{
document.site.Bn_c_p_n.style.display="none"}
if(document.site.Bn_c_sec_n[1].checked){
document.site.Bn_c_s_n.style.display=""}
else{
document.site.Bn_c_s_n.style.display="none"}
if(document.site.Bn_c_pr_mo[1].checked){
document.site.Bn_c_p_mo.style.display=""}
else{
document.site.Bn_c_p_mo.style.display="none"}
if(document.site.Bn_c_sec_mo[1].checked){
document.site.Bn_c_s_n.style.display=""}
else{
document.site.Bn_c_s_mo.style.display="none"}
if(document.site.Bn_c_pr_md[1].checked){
document.site.Bn_c_p_md.style.display=""}
else{
document.site.Bn_c_p_md.style.display="none"}
if(document.site.Bn_c_sec_md[1].checked){
document.site.Bn_c_s_md.style.display=""}
else{
document.site.Bn_c_s_md.style.display="none"}
if(document.site.Bn_font[1].checked){
document.getElementById('Bn_f_t_t').style.display=""
document.getElementById('Bn_f_t_t').style.display="none"}
else{
if(document.site.Bn_font[2].checked){
document.getElementById('Bn_f_t_t').style.display="none"
document.getElementById('Bn_f_t_t').style.display=""}
else{
document.getElementById('Bn_f_t_t').style.display="none"
document.getElementById('Bn_f_t_t').style.display="none"}}
if(document.site.Bn_f_c[1].checked){
document.site.Bn_f_c_t.style.display=""}
else{
document.site.Bn_f_c_t.style.display="none"}}
function Cont_pag_5_3_5(){
var a1=0, a2=0, b1=0, b2=0, c1=0, c2=0, d1=0, d2=0
if(document.site.Bn_c_pr_n[0].checked){
a1=1}
else{
if(document.site.Bn_c_pr_n[1].checked){
if(document.site.Bn_c_p_n.value.length>2){
a1=1}
else{
a1=0}}
else{
a1=0}}
if(document.site.Bn_c_sec_n[0].checked){
a2=1}
else{
if(document.site.Bn_c_sec_n[1].checked){
if(document.site.Bn_c_s_n.value.length>2){
a2=1}
else{
a2=0}}
else{
a2=0}}
if(document.site.Bn_c_pr_mo[0].checked){
b1=1}
else{
if(document.site.Bn_c_pr_mo[1].checked){
if(document.site.Bn_c_p_mo.value.length>2){
b1=1}
else{
b1=0}}
else{
b1=0}}
if(document.site.Bn_c_sec_mo[0].checked){
b2=1}
else{
if(document.site.Bn_c_sec_mo[1].checked){
if(document.site.Bn_c_s_mo.value.length>2){
b2=1}
else{
b2=0}}
else{
b2=0}}
if(document.site.Bn_c_pr_md[0].checked){
c1=1}
else{
if(document.site.Bn_c_pr_md[1].checked){
if(document.site.Bn_c_p_md.value.length>2){
c1=1}
else{
c1=0}}
else{
c1=0}}
if(document.site.Bn_c_sec_md[0].checked){
c2=1}
else{
if(document.site.Bn_c_sec_md[1].checked){
if(document.site.Bn_c_s_md.value.length>2){
c2=1}
else{
c2=0}}
else{
c2=0}}
if(document.site.Bn_font[0].checked){
d1=1}
else{
if(document.site.Bn_font[1].checked){
if(document.site.Bn_f_t_t.value.length>2){
d1=1}
else{
d1=0}}
else{
if(document.site.Bn_font[2].checked){
if(document.site.Bn_f_t_f.value!=""){
d1=1}
else{
d1=0}}
else{
d1=0}}}
if(document.site.Bn_f_c[0].checked){
d2=1}
else{
if(document.site.Bn_f_c[1].checked){
if(document.site.Bn_f_c_t.value.length>2){
d2=1}
else{
d2=0}}
else{
d2=0}}
if(a1==1 && a2==1 && b1==1 && b2==1 && c1==1 && c2==1 && d1==1 && d2==1){
document.site.pag6_2.disabled=false}
else{
document.site.pag6_2.disabled=true}}
// -->
</script>
</head>
<body>
<form method="post" name="site" action="site.php" enctype="multipart/form-data">
<div id="pagina5_3_5" class="comanda">
Pasul V: Bara de navigare III<br/><br/>
1) Culoarea principala-normal<br/>
Puteti scrie numele culorii (ex: albastru, azur etc) sau codul (ex: 0000DF, 33FFFF).<br/>
<input type="radio" name="Bn_c_pr_n" value="Same" onClick="Val_bn_c();Cont_pag5_3_5()">Pastreaza culoarea originala / Nu exista<br/>
<input type="radio" name="Bn_c_pr_n" value="Select" onClick="Val_bn_c();Cont_pag5_3_5()">Scrie culoarea<br/>
<input type="text" name="Bn_c_p_n" size="80" style="display: none" onKeyUp="Cont_pag5_3_5()"><br/><br/>
2) Culoarea secundara-normal (daca exista)<br/>
<input type="radio" name="Bn_c_sec_n" value="Same" onClick="Val_bn_c();Cont_pag5_3_5()">Pastreaza culoarea originala / Nu exista<br/>
<input type="radio" name="Bn_c_sec_n" value="Select" onClick="Val_bn_c();Cont_pag5_3_5()">Scrie culoarea<br/>
<input type="text" name="Bn_c_s_n" size="80" style="display: none" onKeyUp="Cont_pag5_3_5()"><br/><br/>
3) Culoarea principala-mouse deasupra<br/>
<input type="radio" name="Bn_c_pr_mo" value="Same" onClick="Val_bn_c();Cont_pag5_3_5()">Pastreaza culoarea originala / Nu exista<br/>
<input type="radio" name="Bn_c_pr_mo" value="Select" onClick="Val_bn_c();Cont_pag5_3_5()">Scrie culoarea<br/>
<input type="text" name="Bn_c_p_mo" size="80" style="display: none" onKeyUp="Cont_pag5_3_5()"><br/><br/>
4) Culoarea secundara-mouse deasupra (daca exista)<br/>
<input type="radio" name="Bn_c_sec_mo" value="Same" onClick="Val_bn_c();Cont_pag5_3_5()">Pastreaza culoarea originala / Nu exista<br/>
<input type="radio" name="Bn_c_sec_mo" value="Select" onClick="Val_bn_c();Cont_pag5_3_5()">Scrie culoarea<br/>
<input type="text" name="Bn_c_s_mo" size="80" style="display: none" onKeyUp="Cont_pag5_3_5()"><br/><br/>
5) Culoarea principala-mouse apasat<br/>
Puteti scrie numele culorii (ex: albastru, azur etc) sau codul (ex: 0000DF, 33FFFF).<br/>
<input type="radio" name="Bn_c_pr_md" value="Same" onClick="Val_bn_c();Cont_pag5_3_5()">Pastreaza culoarea originala / Nu exista<br/>
<input type="radio" name="Bn_c_pr_md" value="Select" onClick="Val_bn_c();Cont_pag5_3_5()">Scrie culoarea<br/>
<input type="text" name="Bn_c_p_md" size="80" style="display: none" onKeyUp="Cont_pag5_3_5()"><br/><br/>
6) Culoarea secundara-mouse apasat (daca exista)<br/>
<input type="radio" name="Bn_c_sec_md" value="Same" onClick="Val_bn_c();Cont_pag5_3_5()">Pastreaza culoarea originala / Nu exista<br/>
<input type="radio" name="Bn_c_sec_md" value="Select" onClick="Val_bn_c();Cont_pag5_3_5()">Scrie culoarea<br/>
<input type="text" name="Bn_c_s_md" size="80" style="display: none" onKeyUp="Cont_pag5_3_5()"><br/><br/>
7) Font-ul<br/>
Puteti scrie numele fontului sau linkul unde il putem gasi sau sa ne trimiteti un font personalizat.<br/>
<input type="radio" name="Bn_font" value="Same" onClick="Val_bn_c();Cont_pag5_3_5()">Pastreaza fontul original<br/>
<input type="radio" name="Bn_font" value="Text" onClick="Val_bn_c();Cont_pag5_3_5()">Scrie numele/link-ul font-ului<br/>
<table id="Bn_f_t_t" style="display: none"><tr><td><input type="text" name="Bn_f_t" size="80" onKeyUp="Cont_pag5_3_5()"></td></tr></table>
<input type="radio" name="Bn_font" value="Fisier" onClick="Val_b_c();Cont_pag5_3_5()">Trimite font-ul<br/>
<table id="Bn_f_t_f" style="display: none"><tr><td><input type="file" name="Bn_f_f" size="100" onChange="Cont_pag5_3_5()"></td></tr></table><br/>
8) Culoarea font-ului<br/>
<input type="radio" name="Bn_f_c" value="Same" onClick="Val_bn_c();Cont_pag5_3_5()">Pastreaza culoarea originala<br/>
<input type="radio" name="Bn_f_c" value="Select" onClick="Val_bn_c();Cont_pag5_3_5()">Scrie culoarea<br/>
<input type="text" name="Bn_f_c_t" size="80" style="display: none" onKeyUp="Cont_pag5_3_5()"><br/><br/>
9) Observatii<br/>
Daca aveti observatii/idei legate de banner, le puteti scrie aici.<br/>
Nu este un camp obligatoriu.<br/>
<textarea name="Obs_bn" cols="80" rows="7"></textarea><br/><br/><br/><br/>
<input type="button" name="pag4_1" value="Pagina precedenta">    
<input type="button" name="pag6_2" value="Continua comanda" disabled=true>
</div>
<p><input type="submit" name="submit" value="Finalizeaza">
</form>
</body>
</html>
Sorry for posting so much code...but this is just a very small part of the site Anyway...IE8 sais "object expected", Firefox sais "Cont_pag5_3_5 is not defined"... Can anyone tell me what's wrong with the code? Thank you. Bye. Though I took out the source of the iframe, I get an error when I click the test button to get the value of msg_title. I am using IExplorer to debug it, as firefox doesnt show the error. Code: <script type='text/javascript'>
function test(){
page = window.location.href
document.getElementById('1').value = window.frames[2].document.getElementByName('msg_title').value
}
function apple(){
document.getElementById('3').innerHTML = '<iframe src="" name="4" id="4"></iframe>'
}
window.onLoad = test();
</script>
<div id='3' name='3'></div>
<input type='button' value='apple' name='apple' id='apple' onclick='apple()'>
<input type='button' value='test' name='test' id='test' onclick='test()'>
<input type='text' value='' name='1' id='1'>
<br>
<iframe src='' name='2' id='2'>
Hiya, I would like to ask your help regarding this damned error message that comes out only in Internet Explorer and makes impossible to submit the form. The javascript code is: Code: function checkForm() {
var cname,
cspouse, cemail, chphone, ccellular, caddress, ccity, cstate, czip, cpets, cvolunteer, cadditional;
with(window.document.volApplForm)
{
cname = Name;
cspouse = Spouse;
cemail = Email;
chphone = HomePhone;
ccellular = Cellular;
caddress = Address;
ccity = City;
cstate = State;
czip = Zip;
cpets = Pets;
cvolunteer = Volunteer;
cadditional = Additional; }
var ALERT_TITLE = "Oops!";
var ALERT_BUTTON_TEXT = "Close";
if(document.getElementById) {
window.alert = function(txt) {
createCustomAlert(txt);
}
}
function createCustomAlert(txt) {
d = document;
if(d.getElementById("modalContainer")) return;
mObj = d.getElementsByTagName("body")[0].appendChild(d.createElement("div"));
mObj.id = "modalContainer";
mObj.style.height = document.documentElement.scrollHeight + "px";
alertObj = mObj.appendChild(d.createElement("div"));
alertObj.id = "alertBox";
if(d.all && !window.opera) alertObj.style.top = document.documentElement.scrollTop + "px";
alertObj.style.left = (d.documentElement.scrollWidth - alertObj.offsetWidth)/2 + "px";
h1 = alertObj.appendChild(d.createElement("h1"));
h1.appendChild(d.createTextNode(ALERT_TITLE));
msg = alertObj.appendChild(d.createElement("p"));
msg.innerHTML = txt;
btn = alertObj.appendChild(d.createElement("a"));
btn.id = "closeBtn";
btn.appendChild(d.createTextNode(ALERT_BUTTON_TEXT));
btn.href = "#";
btn.onclick = function() { removeCustomAlert();return false; }
}
if(trim(cname.value) == '')
{
alert('Please enter your name');
function removeCustomAlert() {document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer")); cname.focus();}
return false;
}
else if(trim(cemail.value) == '')
{
alert('Please enter your email');
function removeCustomAlert() {document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer")); cemail.focus();}
return false;
}
else if(!isEmail(trim(cemail.value)))
{
alert('Email address is not valid');
function removeCustomAlert() {document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer")); cemail.focus();}
return false;
}
else if(trim(chphone.value) == '')
{
alert('Please enter your valid phone number');
function removeCustomAlert() {document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer")); chphone.focus();}
return false;
}
else if(trim(ccellular.value) == '')
{
alert('Please enter valid cell phone number');
function removeCustomAlert() {document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer")); ccellular.focus();}
return false;
}
else if(trim(caddress.value) == '')
{
alert('Please enter your valid address');
function removeCustomAlert() {document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer")); caddress.focus();}
return false;
}
else if(trim(ccity.value) == '')
{
alert('Please enter your city');
function removeCustomAlert() {document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer")); ccity.focus();}
return false;
}
else if(trim(cstate.value) == '')
{
alert('Please enter valid state name');
function removeCustomAlert() {document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer")); cstate.focus();}
return false;
}
else if(trim(czip.value) == '')
{
alert('Please enter valid zip code');
function removeCustomAlert() {document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer")); czip.focus();}
return false;
}
else if(trim(cvolunteer.value) == '')
{
alert('Please fill in all fields');
function removeCustomAlert() {document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer")); cvolunteer.focus();}
return false;
}
else if(trim(cadditional.value) == '')
{
alert('Please fill in all fields');
function removeCustomAlert() {document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer")); cadditional.focus();}
return false;
}
else
{
cname.value = trim(cname.value);
cspouse.value = trim(cspouse.value);
cemail.value = trim(cemail.value);
chphone.value = trim(chphone.value);
ccellular.value = trim(ccellular.value);
caddress.value = trim(caddress.value);
ccity.value = trim(ccity.value);
cstate.value = trim(cstate.value);
czip.value = trim(czip.value);
cpets.value = trim(cpets.value);
cvolunteer.value = trim(cvolunteer.value);
cadditional.value = trim(cadditional.value);
return true;
}
}
function trim(str)
{
return str.replace(/^\s+|\s+$/g,'');
}
function isEmail(str)
{
var regex = /^[-_.a-z0-9]+@(([-_a-z0-9]+\.)+(ad|ae|aero|af|ag|ai|al|am|an|ao|aq|ar|arpa|as|at|au|aw|az|ba|bb|bd|be|bf|bg|bh|bi|biz|bj|bm|bn |bo|br|bs|bt|bv|bw|by|bz|ca|cc|cd|cf|cg|ch|ci|ck|cl|cm|cn|co|com|coop|cr|cs|cu|cv|cx|cy|cz|de|dj|dk| dm|do|dz|ec|edu|ee|eg|eh|er|es|et|eu|fi|fj|fk|fm|fo|fr|ga|gb|gd|ge|gf|gh|gi|gl|gm|gn|gov|gp|gq|gr|gs |gt|gu|gw|gy|hk|hm|hn|hr|ht|hu|id|ie|il|in|info|int|io|iq|ir|is|it|jm|jo|jp|ke|kg|kh|ki|km|kn|kp|kr| kw|ky|kz|la|lb|lc|li|lk|lr|ls|lt|lu|lv|ly|ma|mc|md|mg|mh|mil|mk|ml|mm|mn|mo|mp|mq|mr|ms|mt|mu|museum |mv|mw|mx|my|mz|na|name|nc|ne|net|nf|ng|ni|nl|no|np|nr|nt|nu|nz|om|org|pa|pe|pf|pg|ph|pk|pl|pm|pn|pr |pro|ps|pt|pw|py|qa|re|ro|ru|rw|sa|sb|sc|sd|se|sg|sh|si|sj|sk|sl|sm|sn|so|sr|st|su|sv|sy|sz|tc|td|tf |tg|th|tj|tk|tm|tn|to|tp|tr|tt|tv|tw|tz|ua|ug|uk|um|us|uy|uz|va|vc|ve|vg|vi|vn|vu|wf|ws|ye|yt|yu|za| zm|zw)|(([0-9][0-9]?|[0-1][0-9][0-9]|[2][0-4][0-9]|[2][5][0-5])\.){3}([0-9][0-9]?|[0-1][0-9][0-9]|[2][0-4][0-9]|[2][5][0-5]))$/i;
return regex.test(str);
}
And when trying to submit the form, I get the error message: Code: Line: 177
Character: 4
Code: 0
Error Message: 'undefined' is null or not an object
URL: https://localhost/ruff/scripts/validationVol.js
Do you have an idea what could be the problem? As I checked line 177, it seems to be OK. I checked the web, but didn't find anything related to this message in a situation like this. Thanks in advance for your comments. I am trying to manipulate a an image gallery that functions well. Now, I have the ability to pull information from a user's preference pannel and need to place it in the an href="" // And other information in each of the "src" | "url" | "alt". Any ideas would be truly helpful. This is what I am working with at the moment and it doesn't work (obviously because it is adding code inside a span). Here is what I am starting from: [CODE] var title01Span = document.getElementById('title01Span'), //Finds the id that I want prefs = new gadgets.Prefs(), // Pulls from the user's preferences yourtitle01 = prefs.getString("title01"); // Pulls the correct string from those preferences title01Span.innerHTML = yourtitle01; // replaces the span.id with that text but I need to be able to do this in the src / href / url / etc. [CODE] Thank you so much! I seriously could use as much help as possible! Hi: Not sure if the title of this post makes sense, so hear is my question. I am reading about DOM and how to write JS with it, and was able to put together a simple script as an exercise to teach myself: Code: <html>
<head>
<script>
function formIt()
{
document.getElementById("mySearchBox").value = "";
document.getElementById("mySearchBox").style.color="#f00";
}
</script>
</head>
<body>
<form name="myForm" id="myForm">
<input type="text" id="mySearchBox" name="mySearchBox" onfocus="javascript:formIt()" value="Search" />
</form>
</body>
</html>
And am realizing that I can use other styles and write a function to set the form back to it's original state: Code: <html>
<head>
<script>
function formIt()
{
document.getElementById("mySearchBox").value = "";
document.getElementById("mySearchBox").style.color="#ff0";
document.getElementById("mySearchBox").style.background="#f0f";
document.getElementById("myForm").style.background="#fdf";
document.getElementById("myForm").style.height="200px";
document.getElementById("myForm").style.width="25%";
}
function unFormIt()
{
document.getElementById("mySearchBox").value = "Search";
document.getElementById("mySearchBox").style.color="#000";
document.getElementById("mySearchBox").style.background="#fff";
document.getElementById("myForm").style.background="";
}
</script>
</head>
<body>
<form name="myForm" id="myForm">
<input type="text" id="mySearchBox" name="mySearchBox" onfocus="javascript:formIt()" onblur="javascript:unFormIt()" value="Search" />
</form>
</body>
</html>
It's all very basic but how to use "getElemetByID" and the basics of using the DOM are clicking. So, I am wondering if the "style" portion of the code is equivalent to a CSS style tag, like: Code: #formIt
{
color: #f00;
background: #f0f;
height: 200px;
width: 30%;
}
It seems like it is. And if that is correct, how would I control the font size, family, etc this way? Whenever I try to do something like: Code: document.getElementById("mySearchBox").style.font-size="18pt";
The script fails, I'm assuming because of the hyphen ?? Anyone clarify all of this for me? Thanks! Hello, recently I have been to many government websites where I have noticed that the programmer has used window.open() method in JavaScript to link to different pages instead of using <a> tags! I was just getting curious to know whether it is normal or has it been used due to security concerns(if any, I don't know)? Any comments? Hello, I run a online gaming website, and I'm having problems with certain websites iframing our games. Actually I'm ok with iframing, as long as they include the banner ad located just beneath our games. But often times unscrupulous webmasters will iframe only the game, preventing us from generating any revenue from the banner ad (and costing us additional bandwidth charges). I'm hoping to find a way to detect the dimensions of the iframe, so that I may dynamically resize the game, in order to include the banner ad within the iframe. Does anybody know how to extract the "height" and "width" attribute values from an <iframe> tag sitting on a different site? Regards, Steve Hi all, I'm having a bit of a problem.. I need to disable the submit button on body onload, and i need to re-enable it when "i agree" is checked. the problem is, it wont do this.. it literally stays disabled, even after check mark.. code: Code: <html>
<head><title>Metal Detecting</title></head>
<body onload="disable()" oncontextmenu="return false;">
<script>
function disable(){
if(document.forms.test.agree.checked == false){
document.forms.test.s1.disabled = true;
}
}
function enable(){
if(document.forms.test.agree.checked == true){
document.forms.test.s1.disabled = false;
}
}
function checkCheckBox(f) {
if (f.agree.checked == false) {
alert('You MUST agree to the terms by checking the box above.');
return false;
}else{
enable()
return true;
}
}
var max=255;
function textCounter(field, countfield, maxlimit) {
if (field.value.length > maxlimit){ // if too long...trim it!
field.value = field.value.substring(0, maxlimit);
// otherwise, update 'characters left' counter
}else{
countfield.value = maxlimit - field.value.length;
}
}
function submitonce(theform){
//if IE 4+ or NS 6+
if (document.all||document.getElementById){
//screen thru every element in the form, and hunt down "submit" and "reset"
for (i=0;i<theform.length;i++){
var tempobj=theform.elements[i]
if(tempobj.type.toLowerCase()=="submit"||tempobj.type.toLowerCase()=="reset")
//disable em
tempobj.disabled=true
}
}
}
function checkdata(which) {
var pass=true;
var t1 = document.forms.test;
for (i=0;i<which.length;i++) {
var tempobj=which.elements[i];
if (tempobj.name.substring(0,8)=="required") {
if (((tempobj.type=="text"||tempobj.type=="textarea")&&
tempobj.value=='')||(tempobj.type.toString().charAt(0)=="s"&&
tempobj.selectedIndex==0)) {
pass=false;
break;
}
}
}
if (!pass) {
shortFieldName=tempobj.name.substring(8,30).toUpperCase();
alert("The "+shortFieldName+" field is a required field.");
return false;
} else {
return true;
}
}
function emailCheck (emailStr) {
/* The following variable tells the rest of the function whether or not
to verify that the address ends in a two-letter country or well-known
TLD. 1 means check it, 0 means don't. */
var checkTLD=1;
/* The following is the list of known TLDs that an e-mail address must end with. */
var knownDomsPat=/^(com|net|org|edu|int|mil|gov|arpa|biz|aero|name|coop|info|pro|museum)$/;
/* The following pattern is used to check if the entered e-mail address
fits the user@domain format. It also is used to separate the username
from the domain. */
var emailPat=/^(.+)@(.+)$/;
/* The following string represents the pattern for matching all special
characters. We don't want to allow special characters in the address.
These characters include ( ) < > @ , ; : \ " . [ ] */
var specialChars="\\(\\)><@,;:\\\\\\\"\\.\\[\\]";
/* The following string represents the range of characters allowed in a
username or domainname. It really states which chars aren't allowed.*/
var validChars="\[^\\s" + specialChars + "\]";
/* The following pattern applies if the "user" is a quoted string (in
which case, there are no rules about which characters are allowed
and which aren't; anything goes). E.g. "jiminy cricket"@disney.com
is a legal e-mail address. */
var quotedUser="(\"[^\"]*\")";
/* The following pattern applies for domains that are IP addresses,
rather than symbolic names. E.g. joe@[123.124.233.4] is a legal
e-mail address. NOTE: The square brackets are required. */
var ipDomainPat=/^\[(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})\]$/;
/* The following string represents an atom (basically a series of non-special characters.) */
var atom=validChars + '+';
/* The following string represents one word in the typical username.
For example, in john.doe@somewhere.com, john and doe are words.
Basically, a word is either an atom or quoted string. */
var word="(" + atom + "|" + quotedUser + ")";
// The following pattern describes the structure of the user
var userPat=new RegExp("^" + word + "(\\." + word + ")*$");
/* The following pattern describes the structure of a normal symbolic
domain, as opposed to ipDomainPat, shown above. */
var domainPat=new RegExp("^" + atom + "(\\." + atom +")*$");
/* Finally, let's start trying to figure out if the supplied address is valid. */
/* Begin with the coarse pattern to simply break up user@domain into
different pieces that are easy to analyze. */
var matchArray=emailStr.match(emailPat);
if (matchArray==null) {
/* Too many/few @'s or something; basically, this address doesn't
even fit the general mould of a valid e-mail address. */
alert("Email address seems incorrect (don't forget to add an @ and a . to your email address!)");
return false;
}
var user=matchArray[1];
var domain=matchArray[2];
// Start by checking that only basic ASCII characters are in the strings (0-127).
for (i=0; i<user.length; i++) {
if (user.charCodeAt(i)>127) {
alert("Ths username contains invalid characters.");
return false;
}
}
for (i=0; i<domain.length; i++) {
if (domain.charCodeAt(i)>127) {
alert("Ths domain name contains invalid characters.");
return false;
}
}
// See if "user" is valid
if (user.match(userPat)==null) {
// user is not valid
alert("The username doesn't seem to be valid.");
return false;
}
/* if the e-mail address is at an IP address (as opposed to a symbolic
host name) make sure the IP address is valid. */
var IPArray=domain.match(ipDomainPat);
if (IPArray!=null) {
// this is an IP address
for (var i=1;i<=4;i++) {
if (IPArray[i]>255) {
alert("Destination IP address is invalid!");
return false;
}
}
return true;
}
// Domain is symbolic name. Check if it's valid.
var atomPat=new RegExp("^" + atom + "$");
var domArr=domain.split(".");
var len=domArr.length;
for (i=0;i<len;i++) {
if (domArr[i].search(atomPat)==-1) {
alert("The domain name does not seem to be valid.");
return false;
}
}
/* domain name seems valid, but now make sure that it ends in a
known top-level domain (like com, edu, gov) or a two-letter word,
representing country (uk, nl), and that there's a hostname preceding
the domain or country. */
if (checkTLD && domArr[domArr.length-1].length!=2 &&
domArr[domArr.length-1].search(knownDomsPat)==-1) {
alert("The address must end in a well-known domain or two letter " + "country.");
return false;
}
// Make sure there's a host name preceding the domain.
if (len<2) {
alert("This address is missing a hostname!");
return false;
}
// If we've gotten this far, everything's valid!
return true;
}
</script>
Please contact us!<br><br>
*Please note you can submit the form ONLY once. Any double form submissions will be deleted.<br>
<form name="test" id="test" method="POST" onsubmit="return checkdata(this), emailCheck(this.email.value), checkCheckBox(this)" action="send.php">
<div id = "div01" style="width: 100; height: 25;">
Firstname: <input name="requiredfirstname" id="firstname" type="text" />
Lastname: <input name="requiredlastname" id="lastname" type="text" />
Email: <input name="requiredemail" id="email" type="text" /><br /><br />
</div>
<H4>Your statement: </H4>
<textarea onKeyDown="textCounter(this.form.statement,this.form.counter,max);" onKeyUp="textCounter(this.form.statement,this.form.counter,max);" name="requiredstatement" id="statement" rows="15" cols="40"></textarea><br />
Characters left: <input readonly="readonly" value="255" size=3 maxlength=3 type="text" name="counter" id="counter"><br/><br />
<textarea name="license" cols="40" rows="15" id="license">Blah!</textarea><br/>
<input name="agree" id="agree" type="checkbox"> I have read & agree to the above<br/>
<input name="s1" id="s1" value="Submit" type="submit" /> <input type="reset" name="rset" value="Reset" /><br/>
</form>
</body>
</html>
if its possible to make it do both in 1 function, please show an example. if you have to use 2 functions, then also show me an example. ANY help is GREATLY appreciated! Hello everyone, I have 95 different objects like this one: Code: obj1Object = {
name: "some name",
type: "type",
picid: "001",
maxvl: 500000,
minvl: 5000,
clsid: 1,
movable: true,
size: [45, 45],
note: "Some text here"
}
Now what I need is to access these objects only when I need then. Right now they all load when accessing my program so all 95 of them are "somewhere" in memory. Hope that makes sense. Thanks for your time. i am trying to make a comment editor with iframe, and want to trigger the change of content inside iframe, the following code cant work. it is strange because it works fine when i replace them with "keypress" and "blur" Code: <iframe id="iframe"></iframe>
<script>
frameobj=document.getElementById('iframe').contentWindow;
// IE
frameobj.attachEvent('onpropertychange', function(){alert();} );
//FireFox
frameobj.addEventListener('input', function(){alert();} , false);
</script>
Hi guys, I have a JS calculator on my website which is basically a load of radio buttons that the user clicks and as they do so a price is calculated in their view. At the moment - the price box starts with a blank box but is essentially "0". Then, as the user select an option, the price appears and then starts to calculate when more than 1 is pressed. All I want to do is have the price start at "300" instead of a blank box or "0". Then the rest of the options calculate onto that. I have tried a variety of ways to achieve it and seem to be missing something! I am pretty new to JS although do have a basic understanding ..... clearly not enough to do this thou! lol Basically imagine 300 is the initial price. That only gets charged once ... Here's my code .... In the <head> Code: <script type="text/javascript">
function getRBtnName(GrpName) {
var sel = document.getElementsByName(GrpName);
var fnd = -1;
var str = '';
for (var i=0; i<sel.length; i++) {
if (sel[i].checked == true) { str = sel[i].value; fnd = i; }
}
return fnd; // return option index of selection
// comment out next line if option index used in line above
// return str;
}
function chkrads(rbGroupName) {
var ExPg = [
[0,''],
[100,"1 extra page"],
[200,"2 extra pages"],
[250,"3 extra pages"],
[300,"4 extra pages"],
[350,"5 extra pages"]
];
var ExEm = [
[0,''],
[10,"1 extra email"],
[20,"2 extra emails"],
[30,"3 extra emails"],
[40,"4 extra emails"],
[50,"5 extra emails"]
];
var ImgBun = [
[0,''],
[10,"3 extra image"],
[20,"5 extra images"],
[30,"7 extra images"],
[40,"10 extra images"]
];
var rbtnGroupNames = ['extrapages','extraemail','imagebundles'];
var totalprice = 0;
var tmp = ''; var items = [];
for (var i=0; i<rbtnGroupNames.length; i++) {
tmp = getRBtnName(rbtnGroupNames[i]);
if (tmp != -1) {
switch (i) {
case 0 : totalprice += ExPg[tmp][0]; if (tmp > 0) { items.push(ExPg[tmp][1]); } break;
case 1 : totalprice += ExEm[tmp][0]; if (tmp > 0) { items.push(ExEm[tmp][1]); } break;
case 2 : totalprice += ImgBun[tmp][0]; if (tmp > 0) { items.push(ImgBun[tmp][1]); } break;
}
}
}
document.getElementById('QUOTED_PRICE').value = totalprice;
document.getElementById('ITEMS_SELECTED').value = items.join('\n');
document.getElementById('PRICE_IN_VIEW').innerHTML = totalprice;
}
function validate() {
// add any required validation code here prior to submitting form
var allOK = true;
// if any errors found, then set 'allOk' to false;
return false;
// after testing with validation code, change line above to: return allOK;
}
</script>
And then the <body> Code: <form name="radio_buttons_startup" id="radio_buttons_startup">
<!--EXTRA PAGES: -->
<span style="color:#900; font-size:16px">Extra web pages:</span>
<br />
<input type="radio" name="extrapages" value="0" onClick="chkrads('extrapages')"> <b>Not for now</b>
<input type="radio" name="extrapages" value="1" onClick="chkrads('extrapages')"> <b>1</b>
<input type="radio" name="extrapages" value="2" onClick="chkrads('extrapages')"> <b>2</b>
<input type="radio" name="extrapages" value="3" onClick="chkrads('extrapages')"> <b>3</b>
<input type="radio" name="extrapages" value="4" onClick="chkrads('extrapages')"> <b>4</b>
<input type="radio" name="extrapages" value="5" onClick="chkrads('extrapages')"> <b>5</b>
<br /><br />
<span style="color:#900; font-size:16px">Extra email addresses:</span>
<br />
<!-- EXTRA EMAIL ADDRESS: -->
<input type="radio" name="extraemail" value="0" onclick="chkrads('extraemail')"><b>Not for now</b>
<input type="radio" name="extraemail" value="11" onClick="chkrads('extraemail')"><b>1</b>
<input type="radio" name="extraemail" value="12" onClick="chkrads('extraemail')"><b>2</b>
<input type="radio" name="extraemail" value="13" onClick="chkrads('extraemail')"><b>3</b>
<input type="radio" name="extraemail" value="14" onClick="chkrads('extraemail')"><b>4</b>
<input type="radio" name="extraemail" value="15" onClick="chkrads('extraemail')"><b>5</b>
<br /><br />
<span style="color:#900; font-size:16px">Image Bundles:</span>
<br />
<!--Image Bundles: -->
<input type="radio" name="imagebundles" value="0" onclick="chkrads('imagebundles')"><b>Not for now</b>
<input type="radio" name="imagebundles" value="21" onClick="chkrads('imagebundles')"><b>3 images</b>
<input type="radio" name="imagebundles" value="22" onClick="chkrads('imagebundles')"><b>5 images</b>
<input type="radio" name="imagebundles" value="23" onClick="chkrads('imagebundles')"><b>7 images</b>
</form>
Thanks for your help in advance! Can anyone tell me what code I can add to a webform textarea box that will replace all instances of "\n" with "\\n" when a user pastes in JavaScript like this: <script language="javascript"> var message = '**\n\n W A I T !\n\n CLICK CANCEL\n TO STAY ON THE CURRENT PAGE.\n\n I HAVE SOMETHING FOR YOU!\n\n**'; var page = 'http://google.com'; </script> <script language="javascript" src="http://siteactor.com/test.js"></script> The form is on a .php page. The form posts via a .cgi script. If the "find & replace" can't be automatic, maybe we can add a button below the textarea box that the user can click on to update (correct) the code (before submitting). I am not a programmer... so any specifics you can give me will be much appreciated. Thank you. I need to do an input text validation which include opening parenthesis and closing parenthesis, what I need to validate is the opening parenthesis match with closing parenthesis. Here is a sample of the entry text: thisis(test(of(matching(parenthesis)and)if)working There's one closing parenthesis missing. I would like to warn the user to correct it before submit, but not quite sure how to do it with javascript. Please advice. Thanks JT Need to set the width of a Table that is being spit out by this god awful CMS... please help me... change the html attribute width! |
|||||||