How can I translate the following lines from ASP VBScript to JavaScript?

[nicebasic]

I have a small page with ASP. In one part of the program, when the user clicks on a button, I use the following code to call a VBScript Subroutine with the name of SubmitForm:

<input type="button" language="vbscript" onclick="Submitform(<%=I%>)">

The code that creates the Subroutine SubmitForm is found at the HEAD section of the page. Here's the code that generates SubmitForm Subroutine:

  Response.Write "<script language='vbscript'>" & vbCrLf _
  & "<!--" & vbCrLf _
  & "Sub Submitform(Number)" & vbCrLf _
  & "frm.action = " & """AddItem.asp?idnum=" & IdNumber & "&pgnum=" & """" & " & Number" &  vbCrLf _
  & "frm.submit" & vbCrLf _
  & "End Sub" & vbCrLf _
  & "-->" & vbCrLf _
  & "</script>"

Since I wish to make this page compatible with FireFox, I need to translate the above line from VBScript to JavaScript. As you know, FireFox does not support VBScript by itself. So, I really need to fix this problem.

Thank you for your help.

[Jerry Winston]

Your "translatio n" shouldn't be too difficult. However, I caution you not to copy/paste solutions from the web when translating. Alot of coders out there are gurus or frequently use really, really esoteric features of javascript. You need to know only a little javascript to perform your conversion, but I'd suggest learning a little more about JavaScript before you implement a "solution" you cannot support developed by a programmer who's style you don't really know.

JavaScript

[jhardman]

I agree with Jerry, but I will give you a solution. I would recommend that you take such a long passage out of the asp response.write command, and just write it. Once you do that, translating it to javascript with no extra flurries is very simple.

%>
<script language="javascript">
  <!--
  function Submitform(Number) {
  document.getElementByID["frmID"].action = "AddItem.asp?idnum=<%=IdNumber%>&pgnum=" + Number;
  document.getElementByID["frmID"].submit();
  }
  -->
  </script>
   <%

barring some odd typos, this should work.

Jared

[nicebasic]

Thank you for you kind attention, Jerry.

I'll try to do the same as you advised me to. But, for the moment, I need the solution.

I'm planning to take a JavaScript course to learn its basic commands.

[nicebasic]

Thank you a million, jhardman.

I think your solution could be very near to the final solution.

I tested it on my program, but it didn't work.

I suppose there might be a problem with lines 5 & 6.

In my program, the actual name of the Form being used is "frm" and this might be the cause of the error. Also, I haven't set an ID for my Form. You have used document.getEle mentByID to set some values for the specified Form, while the Form doesn't have an ID to be used in this case.

I know that my question may sound so easy for you, but as I don't know anything about the syntax of JavaScript, I can't solve this problem. I'm so much busy with ASP and VBScript code that I can't think about other things.

I replaced your code with the code I have given above. But, when I pressed the input button, nothing happened in FireFox. Surprisingly, IE showed "Error on page" in the Status Bar.

I'm really grateful to you for your solution up to this point.

Good luck.

[jhardman]

your form needs an ID, it can be the same as the name. By the way, firefox shows javascript errors in the error console (tools-> error console, or shift+control+j ) and firefox is the one I would use as the standard.

Jared

[nicebasic]

I've set an ID for my Form in the Page. But no success!

First of all, I should thank you again for your great help. Especially about FireFox Error Console. It was really helpful to me. I could track the error in FireFox.

I changed the code and added an ID for my Form as follows:

<form method="Post" name="frm" id="frmMain">

and this is your useful code with the needed modifications:

<script language="javascript">
  <!--
  function Submitform(Number) {
  document.getElementByID["frmMain"].action = "AddItem.asp?idnum=<%=IdNumber%>&pgnum=" + Number;
  document.getElementByID["frmMain"].submit();
  }
  -->
</script>

But, when I run the program, the buttons don't work on my page. Thanks to your help, I could track the error. FireFox shows the following error in the Error Console dialog box:

Error: document.getElementByID is undefined
Source File: http://localhost/default.asp?idnum=3&pgnum=
Line: 36

and the CODE in Line 36 is as follows:

document.getElementByID["frmMain"].action = "AddItem.asp?idnum=3&pgnum=" + Number;

Thank you very much for your support.

[jhardman]

sorry, if there is one thing I hate about javascript it is case sensitivity. I hold down the shift button too long, and I get nothing but errors!

getElementById is correct, not getElementByID

Jared

[nicebasic]

I did the same as you told me to do in the previous post.

I changed getElementByID to getElementById, but nothing changed. The same error, but with a small difference. Simply, the buttons do not respond to click, as if they don't exist at all. When I click on the buttons in FireFox, nothing happens, but the same error in line 36 is still visible.

Error: document.getElementById[B].frmMain[/B] is undefined

Maybe I have confused you. I can put more of the code here, but I'm sure that no other part of the program uses VBScript. I have fixed a similar code a few months ago, but about this code, due to the lack of knowledge in JavaScript, I'm still helpless.

Thank you anyway. You've been so kind, jhardman.

[nicebasic]

Does this help to give me a solution?

Dear jhardman,

I searched the Internet to find the reason of the above Error in Line 36. I found this explanation:

My rule of thumb... If you have a FORM tag, then don't use getElementById for form elements. Form elements all require a name attribute in order to be submitted to the server anyway. The FORM tag, itself, does not. Thus, whether you use a name attribute for your FORM tag or an id attribute will be dictated by whether you're using an HTML, XHTML, or XML document (or, whatever).

I got the above definition from the following link:

http://www.webdeveloper.com/forum/sh...d.php?p=596345

Based on the above information, I decided to change the code like this:

  document.getElementsByName["frmMain"].action = "AddItem.asp?idnum=<%=IdNumber%>&pgnum=" + Number;
  document.getElementsByName["frmMain"].submit();

But it failed again.

I wonder if it can help you find a solution to my problem.

Thank you again.

[nicebasic]

Still Another Idea

I have thought a great deal over this confusing problem and finally, decided to change your efficient code to reveal something I coudn't understand.

If we change your code like this:

<script language="javascript">
  <!--
  function Submitform(Number) {
  var x=document.getElementsByName("frmMain");
  alert(frmMain.Id);
  }
  -->
</script>

We can see your JavaScript Function runs perfectly, but something is wrong with the Form. I don't know what it is, but by changing your JavaScript Function to the above code, when we press the buttons, an "Alert Dialog" appears and shows this message: "undefined"

I'm doing my best to find the solution. Thank you everyone for your help.

[jhardman]

show me the form code, at least the start tag and end tag.

Jared

[nicebasic]

This is the Form Code as you mentioned in the previous post.

		<td width=650 valign="top" align="center">
			[U][I][B]<form method="Post" name="frmMain" id="frmMain">[/B][/I][/U]
			
			<%
			While Not RS.EOF AND ItemNumber < ItemsPerPage
				ItemNumber = ItemNumber + 1
				If rs("Verified") = True Then IsVerified = True Else IsVerified = False
				%> 

				<table border="1" cellpadding="0" cellspacing="0" style="border-style:solid; border-collapse: collapse;" bordercolor="#DDE6CC" width="100%" dir="ltr">
					<tr height="40">
						<% If IsVerified = False Then %>
									<td width="10%" style="font-family: Verdana; font-size: 8pt; color: #FFFFFF" bgcolor="#315973" background="http://MyDomain.com/images/catHead.gif" dir="ltr" align="center">
									<% If Session("login") = "IsAllowed" Then Response.Write CLng(Cur * ItemsPerPage) - ItemsPerPage + ItemNumber %>&nbsp;</td>
							<% Else %>
									<td width="10%" style="font-family: Verdana; font-size: 8pt; color: #000000" bgcolor="#315973" background="http://MyDomain.com/images/titleRow.gif" dir="ltr" align="center">
									<% If Session("login") = "IsAllowed" Then Response.Write CLng(Cur * ItemsPerPage) - ItemsPerPage + ItemNumber %>&nbsp;</td>
						<% End If %>


						<% If IsVerified = True OR Session("login") = "IsAllowed" Then %>
							<% If rs("NameDirection") = "RTL" Then %>
										<td width="80%" style="font-family: Tahoma; font-size: 9pt; color: #002200" bgcolor="#315973" background="http://MyDomain.com/images/titleRow.gif" dir=rtl align="center">
										<%=rs("Name")%>&nbsp;</td>
								<% Else %>
										<td width="80%" style="font-family: Tahoma; font-size: 9pt; color: #002200" bgcolor="#315973" background="http://MyDomain.com/images/titleRow.gif" dir=ltr align="center">
										<%=rs("Name")%>&nbsp;</td>
							<% End If %>
						<% End If %>
						
						<% If IsVerified = False AND Session("login") <> "IsAllowed" Then %>
								<td width="80%" style="font-family: Tahoma; font-size: 9pt; color: #FFFFFF" bgcolor="#315973" background="http://MyDomain.com/images/catHead.gif" dir=LTR align="center">
								<Font Color=White>
									<% Response.Write "<B>This item is not ready yet!</B>" %>
								</Font>
							&nbsp;</td>
						<% End If %>


						<% If IsVerified = False Then %>
									<td width="10%" style="font-family: Tahoma; font-size: 8pt; color: #FFFFFF" bgcolor="#315973" background="http://MyDomain.com/images/catHead.gif" dir="LTR" align="center">
									<% If Session("login") = "IsAllowed" Then Response.Write RS("ID") %>&nbsp;</td>
							<% Else %>
									<td width="10%" style="font-family: Tahoma; font-size: 8pt; color: #000000" bgcolor="#315973" background="http://MyDomain.com/images/titleRow.gif" dir="LTR" align="center">
									<% If Session("login") = "IsAllowed" Then Response.Write RS("ID") %>&nbsp;</td>
						<% End If %>
					</tr>


					<tr>
						<td width="100%" style="" colspan="3" align=center>
							<!-- Begin Table of Goods -->
								<table border="0" cellpadding="0" cellspacing="0" height=185 style="border-collapse: collapse" bordercolor="#000000" bgcolor="#EFEFE7">
								<tr>
									
									<td width="120" height="185" style="font-family: Tahoma; font-size: 10pt; padding-top: 6" valign="top" dir="rtl" align="center">
											<img border="0" src="<% If RS("PicPath") <> "" Then Response.Write "./Archive/" & RS("PicPath") Else : Response.Write "./images/NoPreview.jpg" %>" width="100" height="140">

										<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#000000">
											<tr height=4>
												<td width=80></td>
											</tr>

											<tr height=25>
													<td width=98 style="border-style: solid; border-width: 1; font-family: Tahoma; font-size: 10pt" valign="middle" align="center"  bgcolor="lightgreen">
													<%=RS("Price")%>&nbsp;Rials
												</td>
											</tr>
										</table>

									</td>

									<td width=530 valign="top">
										<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#000000" dir="LTR">
											<tr height="45" bgcolor="#EFEFE7">
												<td width="100" style="padding-right: 10; font-family: Tahoma; font-size: 9pt" dir="LTR" align="right" bgcolor="#EFEFE7">
													<% If IsVerified <> False Then %>	
														<b>Number of Selected Items :</b>
													<% End If %>
												</td>
											
												<td width="425" style="padding-right: 10; padding-left: 10" align="center" bgcolor="#EFEFE7">
													<% If IsVerified <> False Then %>	
															<input name="T<%=RS("ID")%>" value="<%=Request.QueryString(CStr("T" & RS("ID")))%>" size="1" style="border-style:solid; border-width:1px; width: 35; float: right; font-family:Tahoma; font-size:10pt; text-align:center; background-color:#FFFFFF; height:22" maxlength="2" dir="ltr">
															<input type="button" value="Add to the Selected List" name="btnApply" style="Cursor: Pointer; Cursor: Hand; border: solid; border-width: 1; padding:0; width: 115; font-family: Tahoma; font-size:9pt; height:25; float:left; background-color:#FFCC00;" dir="LTR" [U][B][I]language="javascript" onclick="Submitform(<%=Cur%>)"[/I][/B][/U]>
													<% End If %>
												</td>
											</tr>

											
											<tr height="20" bgcolor="#EFEFE7">
												<% If IsVerified = True OR Session("login") = "IsAllowed" Then %>
														<% If RS("InfoDirection") = "RTL" Then %>
																	<td width="100%" style="padding-right: 10; padding-left: 10; line-height: 200%; font-family: Tahoma; font-size: 9pt" colspan=2 dir="rtl" align="justify">
																	<%=RS("Info")%>
																</td>
															<% Else %>
																	<td width="100%" style="padding-right: 10; padding-left: 10; line-height: 200%; font-family: Tahoma; font-size: 9pt" colspan=2 dir="ltr" align="justify">
																	<%=RS("Info")%>
																</td>
														<% End If %>
												<% End If %>

												<% If IsVerified = False AND Session("login") <> "IsAllowed" Then %>
															<td width="100%" style="padding-right: 10; padding-left: 10; line-height: 200%; font-family: Tahoma; font-size: 9pt" colspan=2 dir="LTR" align="justify">
															<Font Color=Red>
																<B><% 'Response.Write "<br><br><br><br>" & "This item is not ready yet!" %></B>
															</Font>
														</td>
												<% End If %>
											</tr>

										</table>
									</td>
									
								</tr>

							</table>
							<!-- End Table of Goods -->
						</td>
					</tr>
				</table>


				<% If Session("login") = "IsAllowed" Then %>

					<% Response.Cookies("UserAdmin") = "IsAllowed" %>
					<table width="100%" dir="LTR">
						<tr height=50>
							<td width=50% align=right>
								<% If RS("Details") <> "" Then %>
										<input type="button" value="More Info ..." name="btnMore" style="border: solid; border-width: 1; padding:0; cursor:hand;width: 117; font-family: Tahoma; font-size:9pt; height:25; float:right; background-color:#CCFF66; " dir="LTR" language="javascript" onclick="window.open('details.asp?ID=<%=RS("ID")%>','newwin','toolbar=1,location=1,directories=1,status=1,menubar=1,scrollbars=1,resizable=1,left=50,width=800')">
								<% End If %>
							</td>

							<td width=50% align=left style="padding-left: 30">
								<A href=<% Response.Write "admin/product_edit.asp?id=" & rs("ID")%> target="_blank">
									<img border='0' src='Admin/Edit.gif' width='51' height='23' align="middle"></A>
							</td>
						</tr>
					</table>

				<% Else %>

					<% Response.Cookies("UserAdmin") = "" %>

					<% If RS("Details") <> "" AND IsVerified <> False Then %>
						<table><tr><td></td></tr></table>
							<input type="button" value="More Info ..." name="btnMore" style="border: solid; border-width: 1; padding:0; cursor:hand;width: 117; font-family: Tahoma; font-size:9pt; height:25; float:right; background-color:#CCFF66; " dir="LTR" language="javascript" onclick="window.open('details.asp?ID=<%=RS("ID")%>','newwin','toolbar=1,location=1,directories=1,status=1,menubar=1,scrollbars=1,resizable=1,left=50,width=800')">
					<% End If %>

				<% End If %>

				<br><br>


				<%
				RS.MoveNext
			Wend
			%>
			[U][I][B]</form>[/B][/I][/U]
		</td>

Lines 02, 85 and 161 contain the codes for the Form and the Button that calls the SubmitForm Function. I have formatted them as Underlined, Bold and Italicized to attract your attention to them.

Thank you again.

[jhardman]

I just tested this, it worked fine. There were a couple mistakes I had made in the original code I posted, notice the parentheses instead of brackets.

<!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>Test javascript function</title>

    

    <script type="text/javascript" language="javascript">
      <!--
        function Submitform() {

            document.getElementById("frmMain").action = "requesttest.asp";
            document.getElementById("frmMain").submit();
        }

        function changeHeader() {
            alert(document.getElementById("h1").innerHTML);
            document.getElementById("h1").innerHTML = "header is changed";
            //alert(document.getElementById("frmMain").action + "'");
            //document.getElementById("frmMain").action = "requesttest.asp";
            //alert(document.getElementById("frmMain").action + "'");
        }
      -->
    </script>


</head>
<body onload="changeHeader()">
<h1 id="h1">Here's the main header</h1>
<form method="Post" name="frmMain" id="frmMain" action="">
<img alt="click here to submit" src="jhdotcomLogo.png" onclick="Submitform()"
border="2" height="50" width="50" id="myPic"/>
<input type="text" name="testText" />
</form>
</body>
</html>

Jared

[nicebasic]

Thank you a million times!

Thank you a million times, jhardman. You're a genius. I owe you more than one.

I replaced the brackets with the parentheses in the JavaScript Function you specified. It solved the problem.

You've been so kind and helpful.

Thank you again.