JavaScript - Can You Operate Correctly This Image Cropper With Ie6? (demo)

Hi Guys, I'm trying to do up a contact form that after a user submits the information, the drop down contact box will slide back up instead of redirecting to another page. The script works fine in Chrome and Safari, but Firefox and IE keeps redirecting to the php page. Hope someone can shed some light here, thanks!

Html form:

Code:

	<div class="left">
				<!-- Login Form -->
				<form class="clearfix" action="contactengine.php" name="cform" method="post">
					<h4>Drop us a mail</h4>
					<label class="grey" for="emailName">Name:</label>
					<input class="field" type="text" name="emailName" id="emailName" value="" size="23" />
					<label class="grey" for="emailFrom">Email Address:</label>
					<input class="field" type="text" name="emailFrom" id="emailFrom" value="" size="23" />
					<label class="grey" for="message">Message:</label>
                    <textarea type="text" name="message" id="message" size="23"></textarea>
        			<div class="clear"></div>
					<input type="submit" rows="" cols="" name="submit" value="Submit" class="bt_register" />
					<span id="messageSent">Message sent successfully!</span>
				</form>
				<script language="JavaScript" type="text/javascript">
//You should create the validator only after the definition of the HTML form
  var frmvalidator  = new Validator("cform");
  frmvalidator.addValidation("emailName","req","Please enter your Name");
  frmvalidator.addValidation("emailName","maxlen=20",	"Max length for Name is 20");
  
  frmvalidator.addValidation("emailFrom","maxlen=50",	"Max length for email is 50");
  frmvalidator.addValidation("emailFrom","req","Please enter your Email");
  frmvalidator.addValidation("emailFrom","email","Please enter a valid email");

</script>
			</div>
			<div class="left right">			
				<!-- Register Form -->
					<h4>Contact Details</h4>				
					<p class="grey"><b>XXX<br /></b>XXX<br />XXX<br />XXX</p>
					<p class="grey">T: 999<br />F: 999</p>
					<h5>Stalk Us</h5>
					<a href="index.html"><img src="misc/fb.png" border="0" alt="Facebook" /></a> <a href="index.html"><img src="misc/twit.png" border="0" alt="Twitter" /></a>
										</div>
					</div>
					</div> 

	<!-- The tab on top -->	
	<div class="tab">
		<ul class="login">
			<li class="left">&nbsp;</li>
			<li>Hello there</li>
			<li class="sep">|</li>
			<li id="toggle">
				<a id="open" class="open" href="#">Contact Us</a>
				<a id="close" style="display: none;" class="close" href="#">Close Panel</a>			
			</li>
			<li class="right">&nbsp;</li>
		</ul> 
	</div> <!-- / top -->

The Slider JS:

Code:

$(document).ready(function() {
	
	// Expand Panel
	$("#open").click(function(){
		$("div#panel").slideDown("slow");
	
	});	
	
	// Collapse Panel
	$("#close").click(function(){
		$("div#panel").slideUp("slow");	
	});		
	
	// Switch buttons from "Hey There | Contact us" to "Close Panel" on click
	$("#toggle a").click(function () {
		$("#toggle a").toggle();
	});		
	
   //submission scripts
  $('div#panel').submit( function(){
		//statements to validate the form	
		var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
		var email = document.getElementById('emailFrom');
		if (!filter.test(emailFrom.value)) {
			$('.email-missing').show();
		} else {$('.email-missing').hide();}
		if (document.cform.emailName.value == "") {
			$('.name-missing').show();
		} else {$('.name-missing').hide();}	
		if (document.cform.message.value == "") {
			$('.message-missing').show();
		} else {$('.message-missing').hide();}		
		if ((document.cform.emailName.value == "") || (!filter.test(email.value)) || (document.cform.message.value == "")){
			return false;
		} 
		
		if ((document.cform.emailName.value != "") && (filter.test(email.value)) && (document.cform.message.value != "")) {
			//hide the form
			$('.div#panel').hide();
		
			//show the loading bar
			$('.loader').append($('.bar'));
			$('.bar').css({display:'block'});
		
			//send the ajax request
			$.post('contactengine.php',{emailName:$('#emailName').val(),
							  emailFrom:$('#emailFrom').val(),
							  message:$('#message').val()},
		
			//return the data
			function(data){
			  //hide the graphic
			  $('.bar').css({display:'none'});
			  $('.loader').append(data);
			});
			
			//waits 2000, then closes the form and fades out
			$("#messageSent").show("slow");
			setTimeout('$("#toggle a").toggle(); $("div#panel").slideUp("slow")', 2000);
			
			//stay on the page
			return false;
		} 
  });
		
});

The PHP Code:

PHP Code:
<?php

$EmailFrom = "xxx@xxx.com";
$EmailTo = "xxx@xxx.com";
$Subject = Trim(stripslashes($_POST['Webmail'])); 
$Name = Trim(stripslashes($_POST['emailName'])); 
$Email = Trim(stripslashes($_POST['emailFrom'])); 
$Message = Trim(stripslashes($_POST['message'])); 

// validation
$validationOK=true;
if (!$validationOK) {
  print "<meta http-equiv=\"refresh\" content=\"0;URL=error.htm\">";
  exit;
}

// prepare email body text
$Body = "";
$Body .= "Name: ";
$Body .= $Name;
$Body .= "\n";
$Body .= "Email Adress: ";
$Body .= $Email;
$Body .= "\n";
$Body .= "Message: ";
$Body .= $Message;
$Body .= "\n";

// send email 
$success = mail($EmailTo, Webmail, $Body, "From: <$EmailFrom>");

// redirect to success page 
if ($success){
  print "<meta http-equiv=\"refresh\" content=\"0;URL=success.html\">";
}
else{
  print "<meta http-equiv=\"refresh\" content=\"0;URL=error.htm\">";
}
?>

I have some javascript code:

first it gets string of the url in the address bar

then it splits the string at the ? and grabs the right half

it then makes an IFrame go to that string(which is yet another url I would manually insert)

here is the code:
Code:

function redirect(){
	var raw=window.document.location.href;
	if(content_address_start=raw.indexOf("?")!=-1){
		var content_address=raw.split("frame.html?")[1];
		window.document.getElementById('content').src=content_address;
	}
}

'content' is the id of the IFrame, and frame.html is the html file this code is inside.

Ok, so everything works perfectly when I test this code offline, but as soon as I load it to my website, and the .src line occurs, it just loads a blank page in the IFrame. What could be causing this? Perhaps certain sites will not allow themselves to be inside iframes? Much thanks in advance. I hope I gave enough information and relayed my problem clearly.

EDIT: It seems that the code works on other sites, just not youtube. Why would it do this and are there any ways around it?

IE, Chrome, and Safari all display this page correctly: http://eataustineat.com/testfolder2/

here is what i mean by Firefox displays it incorrectly

in firefox:
1) type 'f' into the search field
2) you should move over to a youtube video
3) now click the Search tab at the bottom
4) you should notice the a portion of the video remains visable.

the site uses jquery for the slider.
what should I be looking for?

I thought this would be simple. Evidently it's not

With the date below (and it being 11.45 on the 27th as I type this), the counter returns the correct number of hours/mins/seconds remaining, but shows 33 days.

It seems to be adding 31 days to the count, but I can't figure out where

Code:

function countdown(){
	
	var bigday	= new Date(2009,10,29,14,30,0,0);
	var today	= new Date();
	
	var difference = bigday - today;
	
	var remaining = Math.floor(difference/1000);	// want seconds, not milliseconds
	
	var days = Math.floor(remaining/86400);
	remaining = remaining % 86400;
	
	var hours = Math.floor(remaining/3600);
	remaining = remaining % 3600;
	
	var minutes = Math.floor(remaining/60);
	remaining = remaining % 60;
	
	seconds = Math.floor(remaining);
	var out = days + " days, " + hours + " hours, " + minutes + " minutes and " + seconds + " seconds left...";
	
	$('#countdown').text(out);
	
	setTimeout(countdown, 1000);
}

I have a form and javascript that doesn't work correctly. I think there's a problem with the javascript, but it's possible the form is the culprit. I'm new at this.

Here is the form code for a search boxx:
Code:

 <form id="search" method="get" name="search" action="promotions.html">
         <input type="text" size="15" name="ws" maxlength="500" value="pen, keychain, etc." onfocus="this.value='';return false;"  />
         <button type="submit" value="Search">Go</button>
         <input type="hidden" name="ID" value="64857723-2161-4778-BDEB-3EE622F6CFF3" />

       </form>

Here is the javascript that's in the head of /promotions.html:
Code:

<script type="text/javascript">
	function FrameRedirect()
	{
		var q = window.location.search;
		q = (q.length > 1) ? q.substring(1, q.length) : 0;
		var s = q.substring(0, 2);
		switch (s)
		{
			case 'ws':
			q = 'http://www.asiconnection.com/ProductSearch/LinkInQS.aspx?'+q;
			document.getElementById('Content').className = 'active';
			break;
			case 'bn':
			q = q.substring(3,q.length);
			document.getElementById('RD2').className = 'active';
			break;
			default:
			document.getElementById('RD1').className = 'active';
			break;
		}
		iframe = '<iframe id="frame" src="'+q+'" width="780" scrolling="yes" frameborder="0" height="500"></iframe>';
		document.getElementById('Content').innerHTML = iframe;
	}

</script>

The search box code is suppose to send the inputted search word to the javascript on /promotions.html page and then load the search results http://www.asiconnection.com/Product.../LinkInQS.aspx into the iframe on that page. The only thing that appears in that iframe is "Oops. Firefox cannot find productsearch"

Can someone help me figure this out? Thanks in advance.

I would like this image gallery to sit behind everything else. right now white shows through on either side. Any help would be greatly appreciated.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="Generator" content="Get Hosting With Joe (13.0.1.020)">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8">
<title>Home</title>
<script type="text/javascript" src="wpscripts/jquery.js"></script>
<script type="text/javascript" src="wpscripts/jquery.timers.js"></script>
<script type="text/javascript" src="wpscripts/jquery.wpgallery.js"></script>

<script type="text/javascript">
var nImgNum_pg_2 = 0;
wp_imgArray_pg_2 = new Array();
wp_imgArray_pg_2[nImgNum_pg_2++] = new wp_galleryimage("wpimages/6ec6f779d991.jpg", 844, 369, "wpimages/6ec6f779d991t.jpg", "");
wp_imgArray_pg_2[nImgNum_pg_2++] = new wp_galleryimage("wpimages/8dcdb90c2d41.jpg", 844, 370, "wpimages/8dcdb90c2d41t.jpg", "");
</script>
<style type="text/css">
body {margin: 0px; padding: 0px;}
</style>
<script type="text/javascript" src="wpscripts/jspngfix.js"></script>
<script type="text/javascript">
var blankSrc = "wpscripts/blank.gif";
</script>

<script type="text/javascript">
$(document).ready(function() {

$('#wp_gallery_pg_2').wpgallery({
	imageArray: wp_imgArray_pg_2,
	nTotalImages: nImgNum_pg_2,
	nGalleryLeft: 77,
	nGalleryTop: -183,
	nGalleryWidth: 844,
	nGalleryHeight: 842,
	nImageDivLeft: 0,
	nImageDivTop: 0,
	nImageDivWidth: 844,
	nImageDivHeight: 842,
	nControlBarStyle: 0,
	nControlBarExternalTop: 10,
	bNavBarOnTop: false,
	bShowNavBar: false,
	nNavBarAlignment: 0,
	strNavBarColour: 'none',
	nNavBarOpacity: 1.0,
	nNavBarIconWidth: 24,
	nNavBarIconHeight: 24,
	bShowCaption: false,
	bCaptionCount: true,
	strCaptionColour: '#ffffff',
	nCaptionOpacity: 0.6,
	strCaptionTextColour: '#000000',
	nCaptionFontSize: 12,
	strCaptionFontType: 'Courier New,Arial,_sans',
	strCaptionAlign: 'center',
	strCaptionFontWeight: 'normal',
	bShowThumbnails: false,
	nThumbStyle: 1,
	nThumbPosition: 0,
	nThumbLeft: 30,
	nThumbTop: 732,
	nThumbOpacity: 0.5,
	nTotalThumbs: 2,
	nThumbSize: 40,
	nThumbSpacing: 10,
	bThumbBorder: false,
	strThumbBorderColour: '#000000',
	strThumbBorderHoverColour: '#ffffff',
	strThumbBorderActiveColour: '#ffffff',
	bShowThumbnailArrows: false,
	nThumbButtonSize: 24,
	nThumbButtonIndent: 50,
	nColBorderWidth: 2,
	nTransitionStyle: 1,
	nStaticTime: 3044,
	nTransitTime: 1015,
	bAutoplay: true,
	loadingButtonSize: 38,
	bPageCentred: true,
	nPageWidth: 1000,
	nZIndex: 100,
	loadingButtonSrc: 'wpimages/wpgallery_loading_1.gif',
	blankSrc: 'wpscripts/blank.gif',
	rewindButtonSrc: 'wpimages/wpgallery_rewind_0.png',
	prevButtonSrc: 'wpimages/wpgallery_previous_0.png',
	playButtonSrc: 'wpimages/wpgallery_play_0.png',
	pauseButtonSrc: 'wpimages/wpgallery_pause_0.png',
	nextButtonSrc: 'wpimages/wpgallery_next_0.png',
	forwardButtonSrc: 'wpimages/wpgallery_forward_0.png',
	thumbRewindButtonSrc: 'wpimages/wpgallery_rewind_0.png',
	thumbForwardButtonSrc: 'wpimages/wpgallery_forward_0.png',
	rewindoverButtonSrc: 'wpimages/wpgallery_rewind_over_0.png',
	prevoverButtonSrc: 'wpimages/wpgallery_previous_over_0.png',
	playoverButtonSrc: 'wpimages/wpgallery_play_over_0.png',
	pauseoverButtonSrc: 'wpimages/wpgallery_pause_over_0.png',
	nextoverButtonSrc: 'wpimages/wpgallery_next_over_0.png',
	forwardoverButtonSrc: 'wpimages/wpgallery_forward_over_0.png',
	thumboverRewindButtonSrc: 'wpimages/wpgallery_rewind_over_0.png',
	thumboverForwardButtonSrc: 'wpimages/wpgallery_forward_over_0.png',
	strRewindToolTip: 'Reverse',
	strPreviousToolTip: 'Previous',
	strPlayToolTip: 'Play',
	strPauseToolTip: 'Pause',
	strNextToolTip: 'Next',
	strForwardToolTip: 'Forward',
	strThumbRewindToolTip: 'Reverse',
	strThumbForwardToolTip: 'Forward'
});

})
</script>

</head>

<body text="#000000" style="background-color:#ffffff; text-align:center; height:1200px;">
<div style="background-color:transparent;text-align:left;margin-left:auto;margin-right:auto;position:relative;width:1000px;height:1200px;">
<div id="wp_gallery_pg_2" style="position:absolute; left:77px; top:-183px; width:844px; height:842px; overflow:hidden;"></div>
<img src="wpimages/wp7d3e6c5d_06.png" width="997" height="1197" border="0" alt="" onload="OnLoadPngFix()" style="position:absolute;left:0px;top:3px;">
</div>
</body>
</html>

Hi,

I wonder if someone can help! I am not a JavaScript programmer at all, so I cant really see what I am doing wrong with the following code...

Just to explain I have 2 fields on a form that retrieve monetary data from a mysql database. The data is a monetary value e.g. 12.59. Which works fine as normal. I have been asked to hide this value depending on what the customers preferences are set to i.e Show Price = Yes or Show Price = No. Hopefully that makes sense. After lots of deliberation I realised that I couldnt hide the fields because the database called an error saying the price data was missing. So I thought change the field type to a 'password field' and the price data would still be accepted by the database. This thankfully worked and didnt break the php code.

So I found some javascript code, chopped and pasted it and came up with the following script. This is called with an onclick event through a link.

<script language="JavaScript">
function changetype(){
var myTextField = document.getElementById('hf_showmobprices');
if(myTextField.value == "Yes")
document.getElementById('price1jd').type='password';
document.getElementById('price2jd').type='password';
else
return false;
}

I thought the above would work but it doesn't. If I take out one of the lines "document.getElementById('price2jd').type='password';", then it does work. After more playing around I thought, create a function caller as shown below but again that doesnt work. The first function works but the second function doesnt seem to work. I shoved in an alert just to check that the second function was being called and it is. So what I gather is It seems to convert the first price field to a password type field but not the second field. Does anyone know why? is it some thing to do with the getElement and can only run once? I am using FireFox 3.6 if that will help

<script type="text/javascript">
function checkprefs() {
price1();
price2();
}
</script>
<script language="JavaScript">
function price1(){
var myTextField = document.getElementById('hf_showmobprices');
if(myTextField.value == "Yes")
document.getElementById('price1jd').type='password';
else
return true;
}
</script>
<script language="JavaScript">
function price2(){
var mynewtestField2 = document.getElementById('hf_showmobprices');
if(mynewtestField2.value == "Yes")
document.getElementById('price2jd').type='password';
else
alert("alert2")
}
</script>

Any guidance would be much appreciated


john

I am returning the present time - then using the .substr to remove all digits except the last two on the right (i.e effectively returning the value 32 from 65344532) I am then looping, subtracting 11 from that number until the value is less than 11. The intent being to then return the value from the appropriate matching array ID

I have an array sl1
sl1[0]; sl1[1]; sl1[2]; sl1[3]; sl1[4]; sl1[5];
sl1[6]; sl1[7]; sl1[8]; sl1[9]; sl1[10];

The problem arises with evaluating two digit numbers beginning with zero - In cases where the last two numbers are greater than 09, the looping returns a 1 digit number for valuse less than 10, in cases where the last two digits begin with zero the loop will not begin. I have attempted to use the switch(n) to determine if any 01, 02, 03 ... etc exists but this is not evaluating correctly - is this due to using the date/time object and if so is there a good way to convert this to either a numeric or string datatype where the case can be evaluated correctly? Thanks in advance!
--------

I am working with using Javascript to create a page that scales and keeps its aspect ratio (much like a Flash page would). After a lot of trial and error, I have a prototype up with a couple of problems.

It loads correctly once in I.E. Reloading, or opening a new browser, will also load the page correctly. But visiting a different page and coming back causes the width attributes to break. This happens with the non-aspect-ratio version in pure HTML also, but I was hoping that this problem would be solved by establishing values based on javascript variables.

As for Firefox, the problem is more or less exactly the opposite. The page loads up all wonky the first time, and a reload or resize will fix it for every time afterward.

To see what I'm talking about, you can take a look at
http://www.jonesmfgmusic.com/testpag...lem_width.html

For the HTML only version, see
http://www.jonesmfgmusic.com/testpag...blem_html.html

I'm guessing this is something to do with the order in which the data is loaded, so that once the information is all cached, it stops functioning in IE, and starts functioning in FF... can anyone confirm whether I'm on the right track with that, or how to fix it if I am?

I'm most concerned by the fact that the width attribute is behaving as it does in IE. That looks like some kind of Microsoft bug to me, and I need a way around it. As for Firefox, I am guessing if I can just get it to load all of the correct information ahead of time, the page should come up correctly, but I just can't think how to do that.

Hiya,
I'm looking for some guidance on a part of some coding practice I'm stuck on!

I've created a shopping cart using javascript, the items save to the arrays etc and it all works fine. If the user adds the same product again to the cart the quantity is added onto the previous quantity that is already in the cart.
To check if the item is already in the cart I've ued the below code, but what it does is update the quantity for the first cart, and when it updates the quantity for the second item it updates the quantity but keeps adding the same product to the cart in seperate elements of the array as well (if that makes sense?

here are the two functions used:

Code:

function additem(id) {
itemName = document.getElementById('name' + id).innerHTML;		itemQuantity = parseInt(document.getElementById('quantity' + id).value);
itemPrice = parseFloat(document.getElementById('price' + id).innerHTML);
if(numitems == 0){	
items[++numitems] = new Item(itemName,itemPrice,itemQuantity);
displaycart();
}
else{
checkarray(id, itemName, itemQuantity, itemPrice);
}
		
}

function checkarray(id, itemName, itemQuantity, itemPrice){

for(i=1;i<=numitems;i++) {
if(items[i].name == itemName){
items[i].quantity += parseInt(document.getElementById('quantity' + id).value);
displaycart();
return true;
}
		
items[++numitems] = new Item(itemName,itemPrice,itemQuantity);
}	
 
}

It may jsut be a simple mistake I've made but it's been bugging me a lot and I can't seem to fix it, any help/pointers would be greatly appreciated.

I'm a js noob but have managed to cobble together some code for a simple calculator. All the math works well, but changing the radio button doesn't have any effect. Basically, I have 4 set of equations (long if/then statements) - 2 are to be used when one radio button is checked, 2 if the other is checked.

Code:

<html><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">

<script language="JavaScript">

function temp(form)
{
var r1 = form.r1.value;
var GNW = parseFloat(form.GNW.value, 10);
var BNW = parseFloat(form.BNW.value, 10);
var totalfee = 0;
var netfee = 0;
var discount = 0;


//if the "old" radio button is selected, use the the next two if/then formulas
if (r1=1)
{

for brevity sake, I'll omit the first two if/then equations

Code:

//close out the "old" options
}

//use the "new" option
else if (r1=2)	
{
// two more if/then statements
}

// this applies to all conditions

discount = totalfee - netfee;

form.totalfee.value = totalfee/4;
form.netfee.value = netfee/4;
form.discount.value = discount/4;
}

and now the radio buttons
Code:

<input name="r1" value=1 type="radio" checked="checked">Old (3m/3m)
<input name="r1" value=2 type="radio" >Current (5m/5m)</p><p>

hopefully the brevity makes the answer apparent, the full code is attached if I've left out a crucial detail.

Hey guys,

My code works perfectly fine in internet explorer and google chrome, however, in firefox it does not. I have created an online form, but nothing happens when pressing the "submit" button firefox, whereas in other browsers, it works correctly. Also, the centering of the form is different.

Please help me if possible. Thanks


<!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>
<title>Airduct Cleaning</title>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
<link href="text.css" rel="stylesheet" type="text/css">

<script type="text/JavaScript">
function gosubmit(){

musimw.submit();

}
</script>
<style type="text/css">
#text { width: 250px; position: relative; margin-left: 200px; }
</style>
</head>
<body leftmargin="0" topmargin="0">
<table width="998" heigt="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="147" valign="top">
<!----LEFT MENU--------->
<? include "left_menu.php"; ?>
</td>
<td width="591" valign="top" colspan="1">
<!----TOP--------->
<? include "top.php"; ?>

<!----TITLE--------->
<table width="100%" heigt="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="590" height="33" background="images/top_bg2.gif" valign="bottom"><img src="images/title_sub09_01.gif" /></td>
<td width="1" bgcolor="#d3dfe6"></td>
</tr>
</table>
<!----CONTENT--------->
<!----story------>
<form action=sendmail2.php method=post name=musimw enctype=multipart/form-data onSubmit="return musimm_check(this);">

<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr style=" position: relative; margin-left: 28px;">
<td width="50"></td>
<td><p><span class="stxt2">Call for a Free Estimate</span><br>
<br>
<img src="images/img25.gif" align="left"><strong>For a free estimate, call:
</strong></p>
<div id="text">
Office: Insert Office #<br />
Toll-Free: Insert Toll Free # <br />
Email: Insert Email<br />
<br><em>Or, submit the online form below.</em>
</div>
</td>
</tr>
<tr>
<td width="50"></td>
<td>
<table width="530" align="center" border="0" cellspacing="0" cellpadding="0" bgcolor="#EFEFEF">
<tr>
<td width="10"></td>
<td width="180" height="25">*First name</td>
<td style="padding:10px 5px 5px 5px"><input type="text" size="20" name='fname'/></td>
</tr>
<tr>
<td width="10"></td>
<td width="180" height="25">*Last name</td>
<td style="padding:10px 5px 5px 5px"><input type="text" size="20" name='lname'/></td>
</tr>
<tr>
<td></td>
<td >Phone Number<br /></td>
<td style="padding:10px 5px 5px 5px"><input type="text" size="20" name='ptel'/> <select name='pteltype'>
<option value='Home'>Home</option>
<option value='Work'>Work</option>
</select></td>
</tr>
<tr>
<td></td>
<td >Cell Phone Number<br /></td>
<td style="padding:10px 5px 5px 5px"><input type="text" size="20" name='ctel'/></td>
</select></td>
</tr>
<tr>
<td></td>
<td height="25">*Email Address</td>
<td style="padding:10px 5px 5px 5px"><input type="text" size="20" name='email'/></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td colspan="3"height="1" background="images/point.gif"></td>
</tr>
<tr>
<td width="10"></td>
<td width="180" height="25">*Type of Service</td>
<td style="padding:10px 5px 5px 5px"><select name='bnametype'>
<option value='Air Duct Cleaning'>Air Duct Cleaning</option>
<option value='Dryer Vent Cleaning'>Dryer Vent Cleaning</option>
<option value='Chimney Cleaning'>Chimney Cleaning</option>
</select></td>
</tr>
<tr>
<td></td>
<td height="25">Square Footage<br /></td>
<td style="padding:10px 5px 5px 5px"><input type="text" size="20" name='feet'/></td>
</tr>
<tr>
<td></td>
<td height="25">Approximate # of Ducts<br /></td>
<td style="padding:10px 5px 5px 5px"><input type="text" size="20"name='vent' /></td>
</tr>
<tr>
<td></td>
<td height="25">Number of furnaces</td>
<td style="padding:10px 5px 5px 5px"><select name='furnaces'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
</select></td>
</tr>
<tr>
<td colspan="3"height="1" background="images/point.gif"></td>
</tr>
<tr>
<td></td>
<td valign="top" style="padding-top:5px">*Address</td>
<td style="padding:10px 5px 5px 5px"><input type="text" class="inputPlain004" size="30" name='address'></td>
<tr>
<td></td>
<td height="25">*City<br /></td>
<td style="padding:10px 5px 5px 5px"><input name="city" type="text" class="inputPlain004" value="" size="12"></td>
</tr>
<tr>
<td></td>
<td height="25">*State </td>
<td style="padding:10px 5px 5px 5px"><select name='statetype'>
<option value='State'>IL</option></td>
</tr>
<tr>
<td></td>
<td height="25">*Zip Code</td>
<td style="padding:10px 5px 5px 5px"><input name="zip" type="text" class="inputPlain004" value="" size="12"></td>
</tr>
<tr>
<td colspan="3"height="1" background="images/point.gif"></td>
</tr>
<tr>
<td></td>
<td valign="top" style="padding-top:5px">Comments or Questions</td>
<td style="padding:10px 5px 5px 5px"><textarea name='Comment' cols="45" rows="8"></textarea></td>
</tr>
<tr>
<td colspan="3"height="1" background="images/point.gif"></td>
</tr>
</table>
<!---BUTTON--->
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="50" align="center"><a href="javascript:gosubmit()"><img src="images/bt_submit.gif"></a>&nbsp; <a href="#"><img src="images/bt_cancel.gif"></a></td>
</tr>
</table>
</form>
</td>
<td width="1" bgcolor="#d3dfe6"></td>
</tr>
</table>
</td>
<td width="260" valign="top">
<!----RIGHT-------->
<? include "right_menu.php"; ?>
</td>
</tr>
</table>
<!------BOTTOM---------->
<? include "foot.php"; ?>

</body>
</html>

Hi

I want to pass a strings from JS client to PHP server and vice versa. Problem is that I can't find a simple method of escaping them that gives consistent results.

I've tried escape, unescape, urlencode and urldecode, but there are problems with some characters eg +

From what I've read, JSON is the most reliable way to do this. I've figured out how to use json_encode to get a php string to a javascript variable, but I can't go the other way. How do I get the JSON string that represents a javascript object?

Thanks for any help.

I wasn't quite sure where to post this request as its JSON, javascript and php, so please tell me if I'm in the wrong place.

Hi

I have a problem with the javascript menu.

Currently when you click on the "Login" button then it opens and when you click it again while it is open it closes ands opens again.

What I want is when you click the login button while it is open then it closes as toggleable button.

I have posted the javascript to this page: http://jsbin.com/uhefoc/edit#javascript,html,live
So there it is possible to make realtime updates to the script and see the result real time

I also posted the script here so not to break the rules:

Code:

$(document).ready(function() {
  $("#login-menu a.signin").click(function(event) {
    var link = $(this),
    box = $("fieldset#signin_menu"),
    inputs = $("#signin_menu .form-input input");

    event.preventDefault();

    link.toggleClass("menu-open");
    box.toggle("signin_menu");
    if(link.hasClass("menu-open")) {
      $("#username").focus();
    } else {
      inputs.val('');
    }

    inputs.bind("focus keydown", function(action) {
      if((action.type == "keydown" && action.keyCode == 27) || (action.type == "focus" && !link.hasClass("menu-open")) ) {
        link.trigger("click");
      }
    });
    box.mouseup(function () {
      return false;
    });
    $(document).mouseup(function(what) {
      if($(what.target).parent("a.signin").length == 0 && link.hasClass("menu-open")) {
        link.trigger("click");
      }
    });
  });
});

Hi guys,

Just wondering if this javascript is valid. I have about 150 variables, and I want to check, before I start writing it all out. Anything that could reduce it a bit would be great, save time and make the code more efficient!
By the way, all values are numbers entered in a html text field. The script does calculations on it, and posts the result to a hidden field, which is submitted to a php email script.
Code:

<script language="JavaScript">
function calculate() {
	"use strict"; 
	var sofa_3_seaterX = (document.form1.sofa_3_seater.value * 6);
	var sofa_2_seaterX = (document.form1.sofa_2_seater.value * 35);
	var armchair_largeX = (document.form1.armchair_large.value * 9);
	var armchair_smallX = (document.form1.armchair_small.value * 2);
	var wall_unitX = (document.form1.wall_unit.value * 3);
	
	var total = (sofa_3_seaterX + sofa_2_seaterX + armchair_largeX + armchair_smallX + wall_unitX);

	document.form1.total.value = total;
}
</script>