Learn VBA & Macros in 1 Week!

JavaScript - Getting Data From Form And Display

Full Excel VBA Course - Beginner to Expert

Getting Data From Form And Display	View Content

I am working on my form. Once user put data in the form, I want to save it as cookie and display it in another page as form processor.
In my html file therefore, I have

Code:

<form id="frmBuyer" method="get" action="FormProcessor_Cookies.html" 
        enctype="application/x-www-form-urlencoded"
        onsubmit="return validate();" onreset="location.reload();">

which is basically validate all the data and once it meets the requirement, it goes to FormProcessor_Cookies.html. So, i put a function in my js file to get all the data as cookie as following.
Code:

function createCookie(){
	document.cookie = first + "=" + encodeURIComponent(document.forms[0].FirstName.value);
	document.cookie = last + "=" + encodeURIComponent(document.forms[0].LastName.value);
	document.cookie = phone1 + "=" + encodeURIComponent(document.forms[0].PhoneA.value);
	document.cookie = phone2 + "=" + encodeURIComponent(document.forms[0].PhoneB.value);
	document.cookie = phone3 + "=" + encodeURIComponent(document.forms[0].PhoneC.value);
	document.cookie = email + "=" + encodeURIComponent(document.forms[0].Email.value);
	location.href = "cookie.html";
}

and I called this function after it validates.

Code:

function validate(){
	
	var blnError = false;
	var zip = document.getElementById("Zip").value;
	var textBoxthree = document.getElementById("third");
	var textLengththree = textBoxthree.value.length;
	var textBoxtwo = document.getElementById("second");
	var textLengthtwo = textBoxtwo.value.length;
	var textBoxone = document.getElementById("first");
	var textLengthone = textBoxone.value.length;

	var patternZip = new RegExp("^([0-9]){5}(([ ]|[-])?([0-9]){4})?$");
	if (document.forms[0].Zip.value == ""||!patternZip.test(document.forms[0].Zip.value)){
	document.getElementById('E_Zip').style.display="inline";
	document.forms[0].Zip.focus();
	document.forms[0].Zip.style.backgroundColor="lemonchiffon"
	blnError = true;
	}
	else{
	document.getElementById('E_Zip').style.display="none";
	document.forms[0].Zip.style.backgroundColor="white"
	}
	
	var patternCity = new RegExp("^(?:[a-zA-Z]+(?:[.'\-,])?\s?)+$");
	if (document.forms[0].City.value == ""||!patternCity.test(document.forms[0].City.value)){
	document.getElementById('E_City').style.display="inline";
	document.forms[0].City.focus();
	document.forms[0].City.style.backgroundColor="lemonchiffon"
	blnError = true;
	}
	else{
	document.getElementById('E_City').style.display="none";
	document.forms[0].City.style.backgroundColor="white"
	}

	var patternAddress = new RegExp("^[a-zA-Z]+.*|.*[a-zA-Z]+|.*[a-zA-Z]+.*$");
	if (document.forms[0].Address1.value == ""||!patternAddress.test(document.forms[0].Address1.value)){
	document.getElementById('E_Address1').style.display="inline";
	document.forms[0].Address1.focus();
	document.forms[0].Address1.style.backgroundColor="lemonchiffon"
	blnError = true;
	}
	else{
	document.getElementById('E_Address1').style.display="none";
	document.forms[0].Address1.style.backgroundColor="white"
	}

	var patternConfirm = new RegExp("^[_a-zA-Z0-9\\-]+(\.[_a-zA-Z0-9\\-]+)*@[a-zA-Z0-9\\-]+(\.[a-aZ-Z0-9\\-]+)*(\.[a-z]{2,3})$");
	if (document.forms[0].ConfirmEmail.value == "" 
	||!patternConfirm.test(document.forms[0].ConfirmEmail.value)
	||document.forms[0].ConfirmEmail.value != document.forms[0].Email.value){
	document.getElementById('E_ConfirmEmail').style.display="inline";
	document.forms[0].ConfirmEmail.focus();
	document.forms[0].ConfirmEmail.style.backgroundColor="lemonchiffon"
	blnError = true;
	}
	else{
	document.getElementById('E_ConfirmEmail').style.display="none";
	document.forms[0].ConfirmEmail.style.backgroundColor="white"
	}

	var patternEmail = new RegExp("^[_a-zA-Z0-9\\-]+(\.[_a-zA-Z0-9\\-]+)*@[a-zA-Z0-9\\-]+(\.[a-aZ-Z0-9\\-]+)*(\.[a-z]{2,3})$");
	if (document.forms[0].Email.value == ""||!patternEmail.test(document.forms[0].Email.value)){
	document.getElementById('E_Email').style.display="inline";
	document.forms[0].Email.focus();
	document.forms[0].Email.style.backgroundColor="lemonchiffon"
	blnError = true;
	}
	else{
	document.getElementById('E_Email').style.display="none";
	document.forms[0].Email.style.backgroundColor="white"
	}
	var patternPhoneA = new RegExp("^\\d{3}$");
	var patternPhoneB = new RegExp("^\\d{3}$");
	var patternPhoneC = new RegExp("^\\d{4}$");

	if(patternPhoneC.test(document.forms[0].PhoneC.value)
	&&patternPhoneB.test(document.forms[0].PhoneB.value)
	&&patternPhoneA.test(document.forms[0].PhoneA.value)){
	
	document.getElementById('E_Phone').style.display="none";
	}

	if(patternPhoneC.test(document.forms[0].PhoneC.value)){
	document.forms[0].PhoneC.style.backgroundColor="white"}

	if(patternPhoneB.test(document.forms[0].PhoneB.value)){
	document.forms[0].PhoneB.style.backgroundColor="white"}

	if(patternPhoneA.test(document.forms[0].PhoneA.value)){
	document.forms[0].PhoneA.style.backgroundColor="white"}

	if (!patternPhoneC.test(document.forms[0].PhoneC.value)){
	document.getElementById('E_Phone').style.display="inline";
	document.forms[0].PhoneC.focus();
	document.forms[0].PhoneC.style.backgroundColor="lemonchiffon"
	}
	if (!patternPhoneB.test(document.forms[0].PhoneB.value)){
	document.getElementById('E_Phone').style.display="inline";
	document.forms[0].PhoneB.focus();
	document.forms[0].PhoneB.style.backgroundColor="lemonchiffon"
	}
	if (!patternPhoneA.test(document.forms[0].PhoneA.value)){
	document.getElementById('E_Phone').style.display="inline";
	document.forms[0].PhoneA.focus();
	document.forms[0].PhoneA.style.backgroundColor="lemonchiffon"
	}

	
	var patternLast = new RegExp("^[a-zA-Z]+.*|.*[a-zA-Z]+|.*[a-zA-Z]+.*$");
	if (document.forms[0].LastName.value == ""||!patternLast.test(document.forms[0].LastName.value)){
	document.getElementById('E_LastName').style.display="inline";
	document.forms[0].LastName.style.backgroundColor="lemonchiffon"
	blnError = true;
	}
	else{
	document.getElementById('E_LastName').style.display="none";
	document.forms[0].LastName.style.backgroundColor="white"
	}

	var patternFirst = new RegExp("^[a-zA-Z]+.*|.*[a-zA-Z]+|.*[a-zA-Z]+.*$");
	if (document.forms[0].FirstName.value == ""||!patternFirst.test(document.forms[0].FirstName.value)){
	document.getElementById('E_FirstName').style.display="inline";
	document.forms[0].FirstName.style.backgroundColor="lemonchiffon"
	blnError = true;
	}
	else{
	document.getElementById('E_FirstName').style.display="none";
	document.forms[0].FirstName.style.backgroundColor="white"
	}
	
	if (blnError == true){
	document.getElementById('E_Alert').style.display="inline";
	return false;
	}  
	else {
	document.getElementById('E_Alert').style.display="none";
	 createCookie(); 
	return true;
	} 
	}

Lastly, I tried to display all the cookies in my "FormProcessor_Cookies.html" page

Code:

<!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">
   <head>
	<meta name="author" content="" />
	<meta name="description" content="Home" />
	<meta name="keywords" content="Client Side Programming, JavaScript, CSS" />
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	<meta http-equiv="Content-Language" content="en-us" />
	<link rel="stylesheet" href="javascript.css"/>
	<script type="text/javascript" src="shopping.js"></script>
   <title>Homepage::Seunghun Jun</title>
   </head>
   <body>
	<div id="container">
	   <!-- Begin web page -->
	   <div id="header"><!-- Header and Navigation -->
		<!-- Page Heading --><!-- Navigation -->  

	<script type="text/javascript">
	   displayHeader();
	</script> <br/><br/><br/><br/>
	   </div>

	   <div id="content">
	   <!-- Main Content --><div id="submited">
	   <script type="text/javascript">
	   /* <![CDATA[ */
	   document.write(documetn.cookie;);
	   /* ]]> */
	   </script></div>      
	   </div><br/><br/><br/><br/>
	   
	   <div id="footer">
	   <!-- Footer -->
	   <!-- Begin Footer Div-->
	   <script type="text/javascript">displayFooter();</script>
           <!-- End Footer Div -->
	   </div>
	   <!--End web page -->
	</div>
   </body>
</html>

And its not showing any messages...I know I am asking to much...but could any expert can help me what is wrong and how I can fix this?

Full Excel VBA Course - Beginner to Expert

Form Not Displaying Data Because Of Style="display:none;"

Similar Tutorials

View Content

Hi 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&amp;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?

Display Data Through Else Statement

Similar Tutorials

View Content

Hello i have done this so far, i dont really know how to assign the else statement in queris,

and i am not sure for js as well. Those are the files and what i have done. any idea? thanks

main page:

Code:

<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
<!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>
<script type="text/javascript">
 function showUser()
{
var t=document.getElementById("type");
var t_val = q.options[q.selectedIndex].value;
var c=document.getElementById("checkin");
var c_val = c.options[q.selectedIndex].value;
var r=document.getElementById("checkout");
var r_val = r.options[q.selectedIndex].value;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
 xmlhttp=new XMLHttpRequest();
} else {// code for IE6, IE5
 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
 xmlhttp.onreadystatechange=function()
{
var q=document.getElementById("type");
var q_val = q.options[q.selectedIndex].value;
var c=document.getElementById("checkin");
var c_val = c.options[c.selectedIndex].value;
var r=document.getElementById("checkout");
var r_val = r.options[r.selectedIndex].value;
 if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
 document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
 xmlhttp.open("GET","check10.asp?q=" + q_val + "&c=" + c_val+"&r=" +r_val, true);
 xmlhttp.send();
}
 </script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<form>
<select id="type" name="type" onchange="showuser()">
 <option value="">types</option>
 <option value="single">single</option>
 <option value="double ">double</option>
 <option value="suite">suits</option>
 </select>
 <input id="checkin"  onchange="showCustomer(this.value)" size="22"/>
 <input id="checkout"  onchange="showCustomer(this.value)" size="22"/>
 </form>
 <br />
 <div id="txtHint">Customer info will be listed here...</div>
</body>
</html>

The page with data: Code:

<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
<!--#include file="Connections/sqlconn.asp" -->
<%
Dim sql
Dim sql_cmd
Dim sql_numRows

------if(t and c and r){

sql_cmd.CommandText = "SELECT dbo.rooms.id, type, image, price, details FROM dbo.rooms,dbo.transactions WHERE dbo.rooms.id=dbo.transactions.roomid and type='" & request.querystring("t") & "' and checkin>'" & request.querystring("c") & "' and checkout>'" & request.querystring("r") & "' and status='active'"
}
else if (c and r) {
sql_cmd.CommandText = "SELECT dbo.rooms.id, type, image, price, details FROM dbo.rooms,dbo.transactions WHERE dbo.rooms.id=dbo.transactions.roomid  and checkin>'" & request.querystring("c") & "' and checkout>'" & request.querystring("r") & "' and status='active'"
else if (t) {
sql_cmd.CommandText = "SELECT dbo.rooms.id, type, image, price, details FROM dbo.rooms,dbo.transactions WHERE dbo.rooms.id=dbo.transactions.roomid and type='" & request.querystring("t") & "' and status='active'"
}
else if ("") {
"SELECT dbo.rooms.id, type, image, price, details FROM dbo.rooms,dbo.transactions WHERE dbo.rooms.id=dbo.transactions.roomid and status='active'"
}

sql_cmd.Prepared = true

Set sql = sql_cmd.Execute
sql_numRows = 0
%>
<%
Dim Repeat1__numRows
Dim Repeat1__index

Repeat1__numRows = -1
Repeat1__index = 0
sql_numRows = sql_numRows + Repeat1__numRows
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<table border="1" cellpadding="1" cellspacing="1">
  <tr>
    <td>id</td>
    <td>type</td>
    <td>image</td>
    <td>price</td>
    <td>details</td>
  </tr>
  <% While ((Repeat1__numRows <> 0) AND (NOT sql.EOF)) %>
    <tr>
      <td><%=(sql.Fields.Item("id").Value)%></td>
      <td><%=(sql.Fields.Item("type").Value)%></td>
      <td><%=(sql.Fields.Item("image").Value)%></td>
      <td><%=(sql.Fields.Item("price").Value)%></td>
      <td><%=(sql.Fields.Item("details").Value)%></td>
    </tr>
    <%
  Repeat1__index=Repeat1__index+1
  Repeat1__numRows=Repeat1__numRows-1
  sql.MoveNext()
Wend
%>
</table>
</body>
</html>
<%
sql.Close()
Set sql = Nothing
%>

Values Form A Order Form To Display On A Diffirent Page

Similar Tutorials

View Content

I have a order form page and on submitting it opens a new web page that displays the order totals. Below is my code and most probably wrong but for me it seems logic. Please assist.

Order Form:
Code:

<td colspan="1" height="120" align="left"> 
<select style="margin-left: 60px; background-color: #00FF77;" name="prod_bed_359"  onchange="calculateValue(this.form)">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select> R359</td></tr>

New page I called a unction to print:
Code:

function itemsOrdered() {
var beds = document.forms[2].prod_bed_359.value;
document.write("<pre><strong>Description\t\tQuantity\tPrice</strong></pre>");
document.write("<pre>Doggie Bed\t\t" + beds + "</pre>");	
}

This is still basic as I need to get this right before adding the prices and totals which is also extracted from the order page.

Harvest Data -> Return -> Display

Similar Tutorials

View Content

How would I use JavaScript to pull numbers (information such as Clan Members # Count) from this page (http://services.runescape.com/m=clan...me=Void+Nation), and then write them to a page on my site?

Display 3 Data Feeds On Website

Similar Tutorials

View Content

Getelementbyid.innerhtml Won't Display Data

Similar Tutorials

View Content

I am trying to have the user input data into a box on a form and when they press an "Add" button, what they typed in the input field should appear in a box below. I can get it to to work....slightly. What they typed pops up where it should be, but then it disappears. Any idea as to stop that? Here is the javascript code and the form code:

Code:

<script type="text/javascript">

 var array = new Array();

  function insert(val){
  array[array.length]=val;
  }

  function show() {
  var string="";
  for(i = 0; i < array.length; i++) {
  string =string+array[i]+"<br>";
  }
  if(array.length > 0)
 document.getElementById('quickSearchIngList').innerHTML = string;
  }
</script>

Code:

<form>
	<table>
	<th>Recipe Quick Search</th>
	<tr>
	        <td class="quickSearchHeader">Ingredient:</td>
	</tr>
	<tr>
		<td><input type="text" name="quicksearch" size="18" id="quickSearchInput"/></td>
	</tr>
	<tr>
		<td class="quickSearchAddButton" id="quickSearchAddButton"><input type='image' src='images/quickAddButton.png' name='quicksearchadd' alt='Add' onclick='insert(this.form.quicksearch.value),show();'/></td>
	</tr>
</table>
</form>
<div class="quickSearchIngList" id="quickSearchIngList">
</div>

Javascript Validation Not Working With Form Of Multipart/form-data

Similar Tutorials

View Content

Hi guys,

Been stuck for a few days with this scenario.
Any help?
The alert box appears on an error.
But the submitting won't stop.
The details are submitted and the form is processed.
Any help is greatly appreciated...

Code:

    <html>
    <head>
    <script type="text/javascript" src="email_helper/jscripts/tiny_mce/tiny_mce.js"></script>
    <script type="text/javascript">
        tinyMCE.init({
            // General options
            mode : "textareas",
            theme : "simple"
        });
    </script>
    <script language="javascript">
     
    function MM_openBrWindow(theURL,winName,features) {
        window.open(theURL,winName,features);
    }
    function err_check(){
        var email = document.getElementById('to_email').value;
        if(email.length==0){
            alert('Please Enter Email Address');
            return false;
        }
        var AtPos = email.indexOf("@")
        var StopPos = email.lastIndexOf(".")
        if (AtPos == -1 || StopPos == -1) {
            alert("Please Enter Valid Email Address");
            document.getElementById('email').focus();
            return false;
        }
        email = document.getElementById('cc_email').value;
        if(email.length != 0){
            var AtPos = email.indexOf("@")
            var StopPos = email.lastIndexOf(".")
            if (AtPos == -1 || StopPos == -1) {
                alert("Please Enter Valid Email Address");
                document.getElementById('email').focus();
                return false;
            }
        }
        var answer = confirm ("Send E-Mail?");
        if (!answer){
            return false;
        }
    }
    </script>
    <!-- /TinyMCE -->
     
     
    <style type="text/css">
    body, table, td, th{
        background-color:#CCCCCC;
        font-family: Arial;
        font-size:14px;
    }
    .que{
        font-weight:bold;
    }
    </style>
    </head>
    <body>
    <form method="post" enctype="multipart/form-data">
    <?php
    include 'library/database.php';
    include 'library/opendb.php';
    $query = mysql_query("SELECT email,contact,mobile FROM users WHERE user_id='$uid'") or die(mysql_error());
    $row = mysql_fetch_row($query);
    $from_email = $row[0];
    $from_person = $row[1];
    $from_mobile = $row[2];
    $query = mysql_query("SELECT customer_id FROM campaign_summary WHERE camp_id='$camp_id'") or die(mysql_error());
    $row = mysql_fetch_row($query);
    $cusid = $row[0];
    $query = mysql_query("SELECT email FROM client_info WHERE comp_id='$cusid'") or die(mysql_error());
    $row = mysql_fetch_row($query);
    $toer = $row[0];
    include 'library/closedb.php';
    ?>
    <table width="100%" border="0">
    <tr><td rowspan="4"><input type="submit" name="send_email" id="send_email" style="height:50px; width:100px;" value="SEND" onClick="return err_check();" /></td><td><span class="que">From : </span></td><td colspan="3"><?php echo $from_email; ?><input type="hidden" name="from_mail" id="from_mail" /><input type="hidden" name="camp_id" id="camp_id" value="<?php echo $camp_id;?>"/></td></tr>
    <tr><td><span class="que">To : </span></td><td colspan="3"><input name="to_email" id="to_email" style="width:250px;" value="<?php echo $toer;?>"/></td></tr>
    <tr><td><span class="que">CC : </span></td><td colspan="3"><input name="cc_email" id="cc_email" style="width:250px;"/></td></tr>
    <tr><td><span class="que">Subject : </span></td><td colspan="3"><input style="width:300px;" name="subject" id="subject" /></td></tr>
    <tr><td rowspan="1" colspan="2">&nbsp;</td><td><input type="checkbox" name="ori_pdf" id="ori_pdf" checked /> PDF Quotation</td><td>&nbsp;</td><td>&nbsp;</td></tr><tr><td colspan="2"><span class="que">Credit Application</span></td><td><input type="checkbox" name="corporate" id="corporate"/>Corporate</td><td><input type="checkbox" name="individual" id="individual" />Individual</td><td><input type="checkbox" name="cash" id="cash" />Cash Account</td>
    </tr>
    <tr>
    <td colspan="2" rowspan="3"></td><td><input type="checkbox" name="tabloid" id="tabloid" />Tabloid Example</td>
    <td><input type="checkbox" name="broadsheet" id="broadsheet" />Broadsheet Example</td></tr>
    <tr><td><input type="checkbox" name="colmt" id="colmt" />Column Sizes Tabloid</td>
     
    <td><input type="checkbox" name="colmb" id="colmb" />Column Sizes Broadsheet</td></tr>
    <tr><td><input type="checkbox" name="maps" id="maps" />Maps / Distribution</td><td colspan="2" align="right">External Attachments&nbsp;&nbsp;<input id="upload_file" name="upload_file" type="file"/> </td></tr>
     
    <tr><td colspan="2"><span class="que">Message :</span></td><td colspan="3">
        <textarea id="elm1" name="elm1" rows="15" cols="80" style="width: 100%">
        <?php
         echo "<br><br><br>" . $from_person . "<br>" . $from_mobile; 
          ?>
        </textarea>
    </td></tr>
    </table>
    </form>
    </body>
    </html>

Guide Me : Javascript Problem: I Want To Display Data On The Same Div After Submit.

Similar Tutorials

View Content

Hello Everybody,

I have a scenario where in i have 2 divisions, TOP and BOTTOM.
In the BOTTOM Division i have a list box and Submit button in a form.
User can select an item from the list box and click on the submit button.
After user clicks the submit button i want to display some data/graph in the bottom division. However with my current code i see that on clicking the submit button , the data is displayed on a fresh page.

Please guide me if this is possible or should i use a different logic.

The code goes here.
Code:

<html>

<head>
<TITLE> Display Graph </TITLE>

<script type="text/javascript">
      function processData(form) 
	  {
		var BoardNumber = document.forms[0].elements[0].value;
		var BoardIndex = document.forms[0].elements[0].selectedIndex;
		alert("Selected board is :" + BoardNumber + ":Selected Index is :" + BoardIndex); 
		document.write("Trying to print some data : ");
		document.write("<br>");
		document.write("The board number is " + BoardNumber);
		
	   }
</script>
	  
<style type="text/css">
body {
	background-color : #fefefe;
	font-family:arial , verdana, sans-serif;
	text-align : center;
	}
	.page {
	margin-bottom : 10px ;
	text-align : left;
	font-size: 12px;
	background-color : 00ff00;
	background-repeat:repeat-y;
	border:1px solid #666666;
	height : auto;
	}

	.Down {
	margin-top : 10px ;
	text-align : left;
	font-size: 12px;
	background-color : ff0000;
	background-repeat:repeat-y;
	border:1px solid #666666;
	height : auto;
	}	
	
	.header{ padding : 3px;
	         background-color:#f3f3f3; }

	.content {padding : 10px;
				margin-left : 100px;
			}
</style>
</haed>

<body>
<div class = "page">
	<div class = "header"><h1> My Company Name </h1> </div>
	
	<div class = "content">
	<!-- The main Page Goes here -->
	
	<h2> Top DIVISION </h2>
	<p>
	This is test page. This is test page. This is test page. This is test page. This is test page. This is test page. This is test page. This is test page. This is test page. This is test page. This is test page. This is test page. This is test page. This is test page. 
	</p>
	
	</div>
</div>

<div class = "Down" name="Down">
<h2> BOTTOM DIVISION </h2>
<p>
Down : I NEED TO DISPLAY DATA/GRAPH in the same division. Not in a fresh page????
<BR>
<B>
SELECT THE BOARD NUMBER and PRESS THE BUTTON "Process Request"
</B>
<form name = "SelectColor">
	<select name = "boardnum">
		<option selected = "selected " value = " " > select board </option>
		<option value = "Board_7125">7125</option>
		<option value = "Board_7325">7325</option>
		<option value = "Board_7335">7335</option>
		<option value = "Board_7340">7340</option>
		<option value = "Board_7342">7342</option>
		<option value = "Board_7400">7400</option>
		<option value = "Board_7401">7401</option>
		<option value = "Board_7405">7405</option>
		<option value = "Board_7420">7420</option>
		<option value = "Board_7550">7550</option>		
	</select>
	<input type="button" name="process" id="process"
            value="Process Request..." onclick="processData(this.form)" /></p>
</form>
</p>
</div>
</body>
</html>

Display Form Result In Same Div

Similar Tutorials

View Content

Good day to you all,
I'm working on a form which would display the result in the same div that the form is.

Here is my code so far:

PHP Code:

      <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
         <textarea name="html"></textarea><br />
         <input type="submit" onclick="load('<?php echo $_SERVER['PHP_SELF']; ?>','page');"/><br />
      </form>

      Preview:<br />
      <?php if(isset($_POST['html'])) echo stripslashes($_POST['html']); ?>

<script type="text/javascript">
function ahah(url, target) {
  document.getElementById(target).innerHTML = ' Fetching data...';
  if (window.XMLHttpRequest) {
    req = new XMLHttpRequest();
  } else if (window.ActiveXObject) {
    req = new ActiveXObject("Microsoft.XMLHTTP");
  }
  if (req != undefined) {
    req.onreadystatechange = function() {ahahDone(url, target);};
    req.open("GET", url, true);
    req.send("");
  }
}

function ahahDone(url, target) {
  if (req.readyState == 4) { // only if req is "loaded"
    if (req.status == 200) { // only if "OK"
      document.getElementById(target).innerHTML = req.responseText;
    } else {
      document.getElementById(target).innerHTML=" Error:\n"+ req.status + "\n" +req.statusText;
    }
  }
}

function load(name, div) {
    ahah(name,div);
    return false;
}

</script>

My problem is when I click on the button , the text in my text area don't show.

Can somebody help me.

Thanks!

Display Form Result In Iframe On Different Page

Similar Tutorials

View Content

Hi,
i will try to be as brief as possible.
I have a page A with form:

Code:

<form id="search" action="find.html"  method="get">
... (some select options) ...
<input type="submit" class="submit" value="search">

this form look up some holiday destination which appears on this page with url:
(example)
Code:

www.domain.com/find.html?destination=italy&price=500

Now, I dont want to display result on this page, but on page B, in iframe.
I found a way how to redirect output as a link to properly show in iframe on page B.

Page A contains:
Code:

<a href="pageb.html?http://www.domain.com/find.html?destination=italy&price=500">show on page B</a><br>

Page B contains:

Code:

<script type="text/javascript">
<!--

function loadIframe(){
if (location.search.length > 0){
url = unescape(location.search.substring(1))

window.frames["iframe"].location=url
}
}

onload=loadIframe
//-->
</script>

<iframe src="" name="iframe"  id="iframe"</iframe>

In this case page B will properly load requested link in iframe.
Problem is it is just a static link...

I want to display search result from the form.

Thanks a lot for your help...

Style.display To Hide A Form Button

Similar Tutorials

View Content

Hi all,

I'm trying to hide a form button in javascipt.
Within a function I have the following ...

Quote:
document.getElementById(button).display='none';
However it just errors and says button is undefined. button is the id and name of the form button btw.

Do I need to define which form it is part of or something else?

Many thanks for any pointers or help.

Sir P

2 Select Boxes In 1 Form With Onchange Display

Similar Tutorials

View Content

I'm using onchange display to hide/show form elements depending on the value of a select box. It works perfectly well (I actually really adore it) for one select box, but I have another select box which I'd like to act similarly.

Code:

<head>
 <script type="text/javascript">
// <![CDATA[
function display(obj,id1,id2,id3,id4) {
txt = obj.options[obj.selectedIndex].value;
document.getElementById(id1).style.display = 'none';
document.getElementById(id2).style.display = 'none';
document.getElementById(id3).style.display = 'none';
document.getElementById(id4).style.display = 'none';
if ( txt.match(id1) ) {
document.getElementById(id1).style.display = 'block';
}
if ( txt.match(id2) ) {
document.getElementById(id2).style.display = 'block';
}
if ( txt.match(id3) ) {
document.getElementById(id3).style.display = 'block';
}
if ( txt.match(id4) ) {
document.getElementById(id4).style.display = 'block';
}
}
// ]]>
</script>
</head><body>

<form action="#">
<select name="Stype" onchange="display(this,'oneshot','outtake','multi','chapter');">
<option>Please select:</option>
<option value="oneshot">Oneshot</option>
<option value="outtake">Outtake</option>
<option value="multi">Original Multi-Chapter</option>
<option value="drabbles">Drabbles</option>
<option value="outline">Outline Preview</option>
<option value="chapter">Chapter Preview</option>
</select><BR><BR>
<div id="oneshot" style="display: none;">Some fields here</div>
<div id="outtake" style="display: none;">Some different fields here</div>
<div id="multi" style="display: none;">Some other fields here</div>
<div id="chapter" style="display: none;">Some more fields here</div>
</form>
</body>

But when I go to add a second select (obj,id1,id2,id3,id4,id5,id6) with new "ifs" and id's, etc and so forth, neither work.

Code:

<head>
 <script type="text/javascript">
// <![CDATA[
function display(obj,id1,id2,id3,id4,id5,id6) {
txt = obj.options[obj.selectedIndex].value;
document.getElementById(id1).style.display = 'none';
document.getElementById(id2).style.display = 'none';
document.getElementById(id3).style.display = 'none';
document.getElementById(id4).style.display = 'none';
document.getElementById(id5).style.display = 'none';
document.getElementById(id6).style.display = 'none';
if ( txt.match(id1) ) {
document.getElementById(id1).style.display = 'block';
}
if ( txt.match(id2) ) {
document.getElementById(id2).style.display = 'block';
}
if ( txt.match(id3) ) {
document.getElementById(id3).style.display = 'block';
}
if ( txt.match(id4) ) {
document.getElementById(id4).style.display = 'block';
}
if ( txt.match(id5) ) {
document.getElementById(id5).style.display = 'block';
}
if ( txt.match(id6) ) {
document.getElementById(id6).style.display = 'block';
}
}
// ]]>
</script>
</head><body>

<form action="#">
<select name="Stype" onchange="display(this,'oneshot','outtake','multi','chapter');">
<option>Please select:</option>
<option value="oneshot">Oneshot</option>
<option value="outtake">Outtake</option>
<option value="multi">Original Multi-Chapter</option>
<option value="drabbles">Drabbles</option>
<option value="outline">Outline Preview</option>
<option value="chapter">Chapter Preview</option>
</select><BR><BR>
<div id="oneshot" style="display: none;">Some fields here</div>
<div id="outtake" style="display: none;">Some different fields here</div>
<div id="multi" style="display: none;">Some other fields here</div>
<div id="chapter" style="display: none;">Some more fields here</div>  <BR><BR><BR>

<select name="Atype" onchange="display(this,'romance','adventure');">
<option>Please select:</option>
<option value="romance">Romance</option>
<option value="adventure">Adventure</option>
</select><BR><BR>
<div id="romance" style="display: none;">Some new fields here</div>
<div id="adventure" style="display: none;">Some even newer fields here</div>
</form>
</body>

Is there any way to fuse them and get a second select to work the same?

Thanks in advance for the help!

Form To Display Automatically 3 Calculated Values

Similar Tutorials

View Content

Best Javascript Form Validation Display Technique

Similar Tutorials

View Content

Hey,

I'm looking for different JS form validation techniques. I've seen quite a few but nothing that really stands out. I'm particularly interested in finding design techniques...ie: how and where are the errors displayed inside a form?

I realize that I can't count on JS for validation, but I'm trying to add an assistive technology to make a web form feel more like a web application.

I'd love to see your favorite way of displaying form errors via JS. I've got a few of my own but if you've ever tried to do this you know it's a difficult problem to handle the general case.

Thanks!

Using Javascript To Optionally Display A Form Command

Similar Tutorials

View Content

Very naive coding question... i'm a novice coder and i think javascript is the solution i need but - maybe there's better ways...

Ok - my website accepts a login password to access certain pages.
Depending on the password entered i set a javascript variable to either 'true' or 'false'.
If the variable is set to 'true' then i want to give the user access to shopping cart buttons, if 'false' then the shopping cart buttons should be hidden.

My current solution is to wrap javascript around each shopping cart button and display only if the variable is set to 'true'.

The shopping cart button looks a bit like this:
Code:

<form method="post" action="http://www.shoppingcart.com">
<input type="hidden" name="product" value="product" />
<input type="hidden" name="price" 	value="9.99" />
<input type="hidden" name="return" value="http://www.home.com"/>
<input type="submit" value="add to basket" />
</form>

I've tried displaying this using document.write() - but it gets confused when it encounters the ":" in the web address.
Also i get the impression from trawling the forums that document.write is not flavour of the month these days.

And another thought - I accept the variable on one page - then move to multiple other pages to reference it.... will the variable still be there when i move to other pages or do i need to somehow pass it across each time?

Trying to keep my coding XHTML compliant...

Any pointers and idiot proof suggestions would be much appreciated.

Form Data From Javascript

Similar Tutorials

View Content

Hello,

I used a standard orderform which I expanded. With this form people can order some products. But when I submit the form with data from a javascript the mail is empty. Can anyone help? I am just a beginner....

You can try the form here

Thanks in advance!

Hein.

Save Form Data To Pdf

Similar Tutorials

View Content

I have a long survey form and once its submitted it gets recorded into a database. I would love to be able to save a PDF version of the HTML form with all their radio buttons and textfields filled out at the same time its submitted. It would need a unique name that matches their record in the database (maybe it pulls the data that was entered into one of the form fields for the name).

Whether it gets uploaded to an ftp or just emailed to a mailbox doesn't really matter. The purpose of this is to basically have a visual interpretation of the data by a single user.

Is something like this even possible?

Transfer Data From A Form

Similar Tutorials

View Content

Hi,

I have a rather complicated problem for me as it involves both php and js. And I'm getting lost... Let me explain:

On a page, order.html, I have a form including the following fields:
- name
- email
- comment

When posted, it is linked to request.php and request.validation.js, to end up on confirmation.php.

On confirmation.php, I would like to reuse the information entered in the fields on order.php (name, email, comment) to display them on the page.

My issue I can't find how to 'take them along' in request.php / request.validation.js to confirmation.php where I'm trying to display them with :
Code:

Contact:  <span id="name"><?php echo($_POST['name']); ?></span>

etc.

For reference, here are my files request.php and request.validation.js:

PHP Code:
<?php

// CONFIGURATION --------------------------------------------------------------

// This is the email where the contact mails will be sent to.
$config['recipient'] = 'mail@mail.com';

// This is the subject line for contact emails.
// The variable %name% will be replaced with the reference ordered.
$config['subject'] = 'Website enquiry from %name%';

// These are the messages displayed in case of form errors.
$config['errors'] = array
(
    'no_name'       => 'Veuillez entrer votre nom.',
    'no_email'      => 'Votre adresse email est requise.',
    'invalid_email' => 'Votre adresse email n est pas valide.',

);

// END OF CONFIGURATION -------------------------------------------------------

// Ignore non-POST requests
if ( ! $_POST)
    exit('Nothing to see here. Please go back to the site.');

// Was this an AJAX request or not?
$ajax = (isset($_SERVER['HTTP_X_REQUESTED_WITH']) AND strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest');

// Set the correct HTTP headers
header('Content-Type: text/'.($ajax ? 'plain' : 'html').'; charset=utf-8');

// Extract and trim contactform values
$name    = isset($_POST['name']) ? trim($_POST['name']) : '';
$email   = isset($_POST['email']) ? trim($_POST['email']) : '';
$comment = isset($_POST['comment']) ? trim($_POST['comment']) : '';

// Take care of magic quotes if needed (you really should have them disabled)
set_magic_quotes_runtime(0);
if (get_magic_quotes_gpc())
{
    $name    = stripslashes($name);
    $email   = stripslashes($email);
    $comment = stripslashes($comment);
}

// Initialize the errors array which will also be sent back as a JSON object
$errors = NULL;

// Validate name
if ($name == '' || strpos($name, "\r") || strpos($name, "\n"))
{
    $errors['name'] = $config['errors']['no_name'];
}

// Validate email
if ($email == '')
{
    $errors['email'] = $config['errors']['no_email'];
}
elseif ( ! preg_match('/^[-_a-z0-9\'+*$^&%=~!?{}]++(?:\.[-_a-z0-9\'+*$^&%=~!?{}]+)*+@(?:(?![-.])[-a-z0-9.]+(?<![-.])\.[a-z]{2,6}|\d{1,3}(?:\.\d{1,3}){3})(?::\d++)?$/iD', $email))
{
    $errors['email'] = $config['errors']['invalid_email'];
}

// Validation succeeded
if (empty($errors))
{
    // Prepare subject line
    $subject = str_replace('%name%', $name, $config['subject']);

    // Set date
    $todayis = date("l, F j, Y") ;

    // Prepare message
    $message = "Date: $todayis
Nom: $name
email: $email
Commentai $comment";

    // Additional mail headers
    $headers  = 'Content-Type: text/plain; charset=utf-8'."\r\n";
    $headers .= 'From: '.$email;

    // Send the mail
    if ( ! mail($config['recipient'], $subject, $message, $headers))
    {
        $errors['server'] = 'Server problem';
    }
}

if ($ajax)
{
    // Output the possible errors as a JSON object
    echo json_encode($errors);
}
else
{
    // Show a simple HTML feedback message in case of non-javascript support
    if (empty($errors))
    {
        header('Location: ../steps/confirmation.php');
    }
    else
    {
        echo '<h2>Oups!</h2>';
        echo '<ul><li>';
        echo implode('</li><li>', $errors);
        echo '</li></ul>';
        echo '<br><br><a href="javascript:history.back(-1);">Retour</a>';
    }
}

Code:

/*
 * 	Request Form Validation v1.0
 *	By Simon Bouchard <www.simonbouchard.com>
 *	You need at least PHP v5.2.x with JSON support for the live validation to work.
 */

jQuery(document).ready(function(){  

	jQuery('#requestform').submit(function() {

		// Disable the submit button
		jQuery('#requestform input[type=submit]')
			.attr('value', 'Send...')
			.attr('disabled', 'disabled');

		// AJAX POST request
		jQuery.post(
			jQuery(this).attr('action'),
			{
				name:jQuery('#name').val(),
				email:jQuery('#email').val(),
				comment:jQuery('#comment').val(),
			},
			function(errors) {
				// No errors
				if (errors == null) {
					document.location.href="confirmation.php";
				}

				// Errors
				else {
					// Re-enable the submit button
					jQuery('#requestform input[type=submit]')
						.removeAttr('disabled')
						.attr('value', 'Envoyer');

					// Technical server problem, the email could not be sent
					if (errors.server != null) {
						alert(errors.server);
						return false;
					}

					// Empty the errorbox and reset the error alerts
					jQuery('#requestform .errorbox').html('<ul></ul>').show();
					jQuery('#requestform li').removeClass('alert');

					// Loop over the errors, mark the corresponding input fields,
					// and add the error messages to the errorbox.
					for (field in errors) {
						if (errors[field] != null) {
							jQuery('#' + field).parent('li').addClass('alert');
							jQuery('#requestform .errorbox ul').append('<li>' + errors[field] + '</li>');
						}
					}
				}
			},
			'json'
		);

		// Prevent non-AJAX form submission
		return false;
	});

});

Thanks for your help.
M.

Form Data And Iframes

Similar Tutorials

View Content

I am trying to get around using server side scripting for an issue on a webpage. I have a basic html form like this:
Code:

<html>
  <body>
    <FORM NAME="myform" ACTION="" METHOD="GET">Enter something in the box: <BR>
    <INPUT TYPE="text" NAME="inputbox" VALUE=""><P>
    <INPUT TYPE="button" NAME="button" Value="Click" onClick="testResult (this.form)">
  </body>
</html>

I know I can use JavaScript to capture the data like this:
Code:

function testResults (form) {
    var TestVar = form.inputbox.value;
    alert ("You typed: " + TestVar);
}

Instead of alerting it, can I save the data in an iframe? Will it stay there once they leave the page? I want the iframe to eventually contain info from lots of people's answers.

I am wanting to simulate saving the answers to a text file on the server.

Transfer Form Data To Pop-up?

Similar Tutorials

View Content

Basically I have comments posted on articles and I want to allow users to report them if they find inappropriate content. I want them to be able to click on icon on the comment which will open up a pop-up. Then in the pop-up they can type why they are reporting the comment.

Code:

 <script type="text/javascript">
function popup() {
Report = window.open('/report.php','Report','width=350, height=400');
document.reportform.submit();
}
</script>

        <form action="/report.php" name="reportform" method="post" target="Report">
        <input type="hidden" name="reporter_id" value = "<?php echo $user_id; ?>" />
        <input type="hidden" name="reported_id" value="<?php echo $row['uid'] ?>"  />
        <input type="hidden" name="comment_id" value="<?php echo $row['id'] ?>"  />
     	<a href="#" name="reportform" class="submit" onclick="return popup();"> Report</a></form>

I've been messing with this code for a while now. This code successfully brings up the pop-up, but it doesn't transfer the form data. My main coding language is PHP, and I'm in the process of learning Javascript. Can anyone help?