Javascript function not works properly

JavaScript
1 
<?xml version="1.0" encoding="[CONTENT_ENCODING/]"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="[LANG_CODE/]" lang="[LANG_CODE/]" dir="[BASE_DIRECTION/]">

<head>
	<meta http-equiv="Content-Type" content="[CONTENT_TYPE/]" />
	<title>Micro Customer Care</title>
	<style type="text/css">
		body {
			padding:0;
			margin:0;
		}
	</style>
	[STYLE_SHEETS/]
	<!--[if lt IE 7]>
		<link rel="stylesheet" type="text/css" href="css/ie5-6.css"/>
	<![endif]-->
	<script src="js/chat.js" type="text/javascript" charset="UTF-8"></script>
	<script src="js/lang/[LANG_CODE/].js" type="text/javascript" charset="UTF-8"></script>
	<script src="js/config.js" type="text/javascript" charset="UTF-8"></script>
	<script type="text/javascript">
		// <![CDATA[
		function OnSubmit()
{
	document.Form1.action = "formData.php" // Second target
	document.Form1.target = "iframe2";	 // Open in a iframe
	document.Form1.submit();			 // Submit the page
	return true;
	
}
			function initializeLoginPage() {
				document.getElementById('userNameField').focus();
				if(!ajaxChat.isCookieEnabled()) {
					var node = document.createElement('div');
					var text = document.createTextNode(ajaxChatLang['errorCookiesRequired']);
					node.appendChild(text);
					document.getElementById('errorContainer').appendChild(node);
				}
			}
			
			ajaxChatConfig.sessionName = '[SESSION_NAME/]';
			ajaxChatConfig.cookieExpiration = parseInt('[COOKIE_EXPIRATION/]');
			ajaxChatConfig.cookiePath = '[COOKIE_PATH/]';
			ajaxChatConfig.cookieDomain = '[COOKIE_DOMAIN/]';
			ajaxChatConfig.cookieSecure = '[COOKIE_SECURE/]';

			ajaxChat.init(ajaxChatConfig, ajaxChatLang, true, true, false);
		// ]]>
	</script>
</head>

<body onload="initializeLoginPage();">
	<div id="loginContent">
		<div id="loginHeadlineContainer">
			<h1>Micro Customer Care</h1>
		</div>
		<form id="loginForm" name="Form1" action="[LOGIN_URL/]" method="post" enctype="application/x-www-form-urlencoded">
			<div id="loginFormContainer">
				<input type="hidden" name="login" id="loginField" value="login"/>
				<input type="hidden" name="redirect" id="redirectField" value="[REDIRECT_URL/]"/>
				<div><label for="userNameField">[LANG]userName[/LANG]:</label><br />
				<input type="text" name="userName" id="userNameField" maxlength="[USER_NAME_MAX_LENGTH/]"/></div>
				<div><label for="emailField">Email</label><br />
				<input type="text" name="email" id="emailField"/></div>
				<!--<div><label for="channelField">[LANG]channel[/LANG]:</label><br />
				<select name="channelName" id="channelField">[CHANNEL_OPTIONS/]</select></div>
				<div><label for="languageSelection">[LANG]language[/LANG]:</label><br />
				<select id="languageSelection" name="lang" onchange="ajaxChat.switchLanguage(this.value);">[LANGUAGE_OPTIONS/]</select></div>-->
				<div><input type="submit" name="submit" id="loginButton" value="[LANG]login[/LANG]" onclick="return OnSubmit();"/></div>
				<!--<div id="loginRegisteredUsers">* [LANG]registeredUsers[/LANG]</div>-->
			</div>
		</form>
		<div id="errorContainer">[ERROR_MESSAGES/]<noscript><div>[LANG]requiresJavaScript[/LANG]</div></noscript></div>
		<!--
			Please retain the full copyright notice below including the link to blueimp.net.
			This not only gives respect to the amount of time given freely by the developer
			but also helps build interest, traffic and use of AJAX Chat.
			
			Thanks,
			Sebastian Tschan
		//-->
		<div id="copyright"><a href="http://www.microtechnologies.net/">Micro</a> &copy; <a href="http://www.microtechnologies.net/">Microtechnologies.net</a></div>
	</div>
</body>

</html>

Hi friends…
In above code I want when user clicks on Submit button then function OnSubmit() runs and formData.php automatically submitted but when users clicks on submit button, OnSubmit() runs but formData is not executed. Even it not give any errors like “formData file not found” etc. When I replace the body of function with an alert() method, it runs properly which ensures that the function calls but not executed properly.
Can anyone tell what is wrong in above code???
Please help…
Thanks in advance…

2

First, unrelated:
<?xml version=“1.0” encoding=“[CONTENT_ENCODING/]”?>

Get rid of that. It has no place on the open web. You are not running this on an intranet where you are using real XHTML and users are not using Internet Explorer.
Besides that, even if you were, it’s still optional unless you are using a charset other than UTF-8 or -16.

Second, what I see wrong in your code:
document.Form1.action = “formData.php”

I believe that, if you are going to use the form name (btw, “name” has been deprecated for forms when using XHTML, which is another reason why I don’t believe you are using XHTML but just an XHTML doctype), you would have to do this:
document.forms.Form1.action

Since you have to pick “Form1” out of the document.forms node list.

I see you are using an id on the form. I’d use that whichever method you choose:

document.forms.loginForm.action
You could also call it by its id with
document.getElementById(‘loginForm’).action

Or at least, because I don’t use name attributes on my forms (because once long ago the validator complained at me), I use id’s and these work the same as the name.

So I’m assuming that “document.Form1.action” is not referring to anything, and this could explain why the action isn’t getting changed.

I have a script where I change the action on a form… to check that it actually changed, I use either Firefox or Chrome and I View Generated Code (so the source after javascript has messed with it) to see if the action of the form really is what I expect it to be.

So if you make the change above, you can check if your form action really did change to “FormData.php”.

Does that help?

3

Thanks for your great help…
but sir i don’t want to change action of form but to add another action of form. It means I want that when I click on submit the form should executes both actions simultaneously.
I used following javascript

function OnSubmit()
{	
	[B]document.getElementById('loginForm').action = "[LOGIN_URL/]" [/B]// First target
	document.Form1.target = "iframe2";	 // Open in a iframe
	document.Form1.submit();			 // Submit the page
	[B]document.getElementById('loginForm').action = "formData.php"[/B]// Second target
	document.Form1.target = "iframe1";	 // Open in a iframe
	document.Form1.submit();	
	return true;
}

Now, my form executes “[LOGIN_URL/]” properly but not “formData.php”.
So, please help me to execute both file simultaneously…
Thanks in advance…

4

I’m not 100% sure, but I didn’t think a form could have more than one action. User hits submit, one thing happens.

Instead I thought most people would have the first script (the login action) then also call the other script in the backend. HTML/Javascript I don’t believe can do that.

Someone correct me if I’m wrong.

Or, you could have your Javascript run the login at submit, then maybe do an ajax call to the server to call the formdata script (but not, I don’t think, if you need the form input information sent to FormData.php… if you do, then it still needs to be done on the server side). I’ve seen people call multiple scripts (from the same domain) this way after a user causes one event, but still probably faster not to use Javascript.

Still, you do need to use document.forms.(name or id).action to access form action anyway.

5

Sorry dear but I want to correct you, it is possible and even I executed it also in below code but in my main code it not works…

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>

<BODY>
<script language=javascript>
<!--
function OnSubmit()
{
	document.Form1.action = "login1.php" // Second target
	document.Form1.target = "iframe1";	 // Open in a iframe
	document.Form1.submit();
	document.Form1.action = "formData.php" // Second target
	document.Form1.target = "iframe2";	 // Open in a iframe
	document.Form1.submit();			 // Submit the page
	return true;
}
-->
</script>
<form name=Form1 action= "" method=post>
Username <INPUT type="text" name="userName"><br>
Password <INPUT type="text" name="email"><br>
<INPUT type="submit" value="Send3" name="button1" onclick="return OnSubmit();">
</form><br>
<div style="visibility:hidden">
<iframe NAME="iframe2" WIDTH="40" HEIGHT="40" ></iframe>

</div>
</BODY>
</HTML>
6

Hm, yes I do see many people using that (document.formName) though I can’t find it in the online docs.

But when you run that simple example, when you View Generated Source, do you get

<form name=Form1 action=“login1.php” action=“formData.php” method=post>

on your page??

Maybe I need to go see how it works with the target attribute…

(I found a page where people instead of two actions would use Javascript to change the src=“” of the iFrames…)

7

I am not getting wht you trying to tell sir???

8

I think I was missing what you are doing.

You have one iFrame already on the page.

There is another one somewhere?

When the user hits submit, two things occur:
The form submits the user’s information to iFrame 1 (where is this?)
Then the form is supposed to send this data to another script called FormData.php inside iFrame2?

9

Sir, I want to send information in two pages
1-“action/URL” page
2- formData.php

In form action i mentioned the action="
action/URL" and in javascript given below

function OnSubmit()
{	//alert("Ankit");
			
	document.getElementById('loginForm').action = "formData.php"// Second target
	document.getElementById('loginForm').target = "iframe1";	 // Open in a iframe
	document.getElementById('loginForm').submit();	
	return true;
}

It works for actio/URL but at same time it not submits formData.php…
I need to work both simultaneously…

10

You can’t send information to two pages at once. Which makes sense, because which of the two pages is the browser supposed to show after submit? Both of them?

Stomme was on the money in #4 where she suggested you just call one script and that script should call the other script.

Or you can indeed go the iframe route, but I’d only use that as a last resort. iframes aren’t very nice to work with.

11

He’s already using iFrames though.

Can he still send the user to frame1 and pump info to frame2?