Jquery Modal form login with AJAX - ASP Classic on IE 9 - javascript

I am having quite a bit of trouble getting a particular login form to work with Jquery using classic asp on IE 9.
On my index.asp page I have the following form:
<%#LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
<!--#include file="Connections/LogisticsConnection.asp" -->
<%
Dim RS_User
Dim RS_User_cmd
Dim RS_User_numRows
Set RS_User_cmd = Server.CreateObject ("ADODB.Command")
RS_User_cmd.ActiveConnection = MM_LogisticsConnection_STRING
RS_User_cmd.CommandText = "SELECT UserName, Password FROM Users"
RS_User_cmd.Prepared = true
Set RS_User = RS_User_cmd.Execute
RS_User_numRows = 0
%>
<!doctype html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Training Prioritization</title>
</head>
<link rel="stylesheet" type="text/css" href="img/css/site.css"/>
<link rel="stylesheet" type="text/css" href="img/scripts/jquery-ui-1.11.4/jquery-ui.css"/>
<link rel="stylesheet" type="text/css" href="img/scripts/chosen/chosen.css"/>
<script src="img/scripts/jquery-1.11.2.min.js"></script>
<script src="img/scripts/jquery-ui-1.11.4/jquery-ui.js"></script>
<script src="img/scripts/chosen/chosen.jquery.js"></script>
<script src="img/scripts/siteScript.js"></script>
<body>
<div id="wrapper">
<div id="header">
<div id="logo"></div>
<div id="title">Training Prioritization</div>
<div id="login"><img src="img/loginBtn.png" id="Login-Img">Login</img></div>
</div><!--END HEADER-->
<div id="menu">
<div id = "menuItems">
<img src="img/editBtn.png" id="Menu-edit">Edit</img>
<img src="img/saveBtn.png" id="Menu-save">Save</img>
<img src="img/cancelBtn.png" id="Menu-cancel"/>Cancel</img>
</div>
</div>
<div id="body">
<div id="formBody">
<table id="formTable">
<tbody>
<tr id="Table-Heading-titleGroup">
<td>Title:</td>
<td>Project Tracker Number:</td>
<td>Status:</td>
<td>Month:</td>
</tr>
<tr>
<td><input type="text" id="Form-title"></td>
<td><input type="text" id="Form-ptNum"></td>
<td> <select id="Form-Dropdown-status"><option value="1">1</option><option value="2">2</option><option value="3">3</option></select></td>
<td>
<select id="Form-Dropdown-month"><option value="1">1</option><option value="2">2</option><option value="3">3</option></select>
</td>
</tr>
<tr id="Table-Heading-requestorGroup">
<td>Requestor:</td>
<td>Curriculum/Course:</td>
<td>Duration:</td>
</tr>
<tr>
<td><input type="text" id="Form-requestor"></td>
<td><input type="text" id="Form-curriculum"></td>
<td><input type="text" id="Form-duration"></td>
</tr>
<tr id="Table-Heading-designerGroup">
<td>Designer:</td>
<td>Start Date:</td>
<td>End Date:</td>
<td>Launch Date:</td>
</tr>
<tr>
<td><input type="text" id="Form-designer"></td>
<td><input type="text" id="Form-Date-startDate"></td>
<td><input type="text" id="Form-Date-endDate"></td>
<td><input type="text" id="Form-Date-launchDate"></td>
</tr>
<tr id="Table-Heading-project">
<td>Project Description:</td>
</tr>
<tr>
<td><input type="text" id="Form-Paragraph-projectDescription"></td>
</tr>
<tr id="Table-Heading-businessGroup">
<td>Business Unit</td>
<td>Legacy Group</td>
<td>Work Group</td>
</tr>
<tr>
<td><select id="Form-Dropdown-businessUnit"><option value="test1">test1</option><option value="test2">test2</option><option value="test3">test3</option></select></td>
<td><select id="Form-Dropdown-legacyGroup"><option value="test1">test1</option><option value="test2">test2</option><option value="test3">test3</option></select></td>
<td><select id="Form-Dropdown-workGroup"><option value="test1">test1</option><option value="test2">test2</option><option value="test3">test3</option></select></td>
</tr>
<tr>
<td id="Table-Heading-location">
Location:
</td>
</tr>
<tr>
<td><img src="img/addBtn.png"/><div id="Table-Row-Child-Location">Add Location</div></td>
</tr>
<tr id="Table-Row-Parent-AddLocation">
<tr>
<tr id="Table-Heading-notes">
<td>Notes</td>
</tr>
<tr>
<td><input type="text" id="Form-Paragraph-notes"></td>
</tr>
</tbody>
</table>
</div>
<div id="test">
text here
</div>
<form id="Form-Submit" action="verify.asp" method="post">
<div id="Modal-Menu">
User Name:<input type="text" id="Modal-Menu-Input-UserName" name="UserName" value="User Name">
Password:<input type="password" id="Modal-Menu-Input-Password" name="Password" value="Password" >
</div>
</form>
</div><!--END BODY-->
<div id="footer">
<div id="footerText" align="center">
©2015 CenturyLink
</div>
</div>
</div><!--END WRAPPER-->
</body>
</html>
<%
RS_User.Close()
Set RS_User = Nothing
%>
In my siteScript.js I have the following Jquery:
//menu
$("#login").click(function(){$("#Modal-Menu").dialog("open")});
$(function(){
$("#Modal-Menu").dialog(
{autoOpen:false,
modal:true,
buttons:{
Cancel: function(){
$("#Modal-Menu").dialog("close");
},
'Submit': function(){
ajaxSubmit();
}
}
})
});
//ajax response
function ajaxSubmit(){
$.ajax({
url: 'verify.asp',
data: $("#Form-Submit").serialize(),
type: 'POST',
dataType: 'html',
success: function(data){
alert(data);
},
error: function(err){
alert("Error");
}
});
return false;
};
This particular form sends information to verify.asp which has the following code:
dim Username
dim Password
Username =Request.Form("UserName")
Password = Request.Form("Password")
Response.Write(Username)
Response.Write(Password)
My issue is that I am unable to get any information from the modal form(which sends infor via POST), and have it properly captured via Request.Form. When I alert out the data, I get the whole verify.html page, but when I look at the response.write for Username and Password, it is blank. Any help or advice is greatly appreciated thanks!
Edit: Provided full index.asp document as requested

I finally figured it out in my index.asp I have:
<form id="Form-Submit" action="verify.asp" method="post">
<div id="Modal-Menu">
User Name:<input type="text" id="Modal-Menu-Input-UserName" name="UserName" value="User Name">
Password:<input type="password" id="Modal-Menu-Input-Password" name="Password" value="Password" >
</div>
</form>
Note the two form tags that are outside of the "Modal-Menu" div. What it needs to look like is this:
<div id="Modal-Menu">
<form id="Form-Submit" action="verify.asp" method="post">
<input type="text"name="UserName" value="User Name"/>
<input type="password" id="Modal-Menu-Input-Password" name="Password" value="Password"/>
</form>
</div>
where the form tags are wrapped inside of the "Modal-Menu" div...
Idiocy 1 Hexobolic 0...

Related

Pass variable data from Javascript to PHP file

Is there a way for me to submit data collected and passed to a variable using javascript to a php page.
I have a form that has input fields that are posted to a php file I am using a jquery function to serialize the form data and process it in php. However as well as the form data from the input fields I want to send data that I have collected and stored in a javascript variable and pick that up into a php variable so I can run a for loop.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>New User Registration</title>
</head>
<body>
<div id="newUserHld">
<table id="newUserFrmTbl">
<form id="newUserFrm">
<tr>
<td><label id="firstnameLbl">First Name</label></td>
<td><input type="text" id="firstname" size="20" /></td>
</tr>
<tr>
<td><label id="lastnameLbl">Last Name</label></td>
<td><input type="text" id="lastname" size="20" /></td>
</tr>
<tr>
<td><label id="dobLbl">Date of Birth</label></td>
<td><input type="text" id="dob" size="8" /></td>
</tr>
<tr>
<td><label id="positionLbl">Position</label></td>
<td>
<select size="1">
<option>Select Option</option>
<option> WFXM </option>
<option>Operations Manager</option>
<option>Assistant</option>
</select>
</td>
</tr>
<tr>
<td><label id="usernameLbl">Username</label></td>
<td><input type="text" id="username" size="20" /></td>
</tr>
<tr>
<td><label id="passwordLbl">Password</label></td>
<td><input type="password" id="password" size="20" /></td>
</tr>
<tr>
<td><label id="payRateLbl">Pay Rate</label></td>
<td><input type="text" id="payRate" size="20" /></td>
</tr>
<tr><td><input type="submit" id="createUsr" name="createUsr" value="Create User" /> </td>
</form>
</table>
</div>
<div id="success">
</div>
<button type="button" onclick="getFrmElm()">Try it</button>
</body>
<script>
function getFrmElm (){
var x = document.getElementById("newUserFrm");
var txt = "";
var i;
for (i = 0; i < x.length; i++) {
txt = txt + x.elements[i].id + "<br>";
}
formSubmit();
}
function formSubmit(){
$.ajax({
type:'POST',
url:'userreg.php',
data:$('#newUserFrm').serialize(),
success:function(response){
$('#success').html(response);
}
});
return false;
}
</script>
</html>
PHP FROM userreg
<?php
include_once "iud.php";
$db = connectDatabase();
$formfields = test_input($_POST['txt'];
$firstname=test_input($_POST['firstname']);
$lastname=test_input($_POST['lastname']);
$sql="INSERT INTO contacts(firstname, lastname) ";
$sql .= "values (";
$sql .= "'".$firstname."', '".$lastname."'";
$sql .= ")";
if(mysqli_query($db, $sql)){
echo "Record Inserted";
}else{
echo "Insert failed";
}
mysqli_close($db);
function test_input($data){
$data=trim($data);
$data=stripslashes($data);
$data=htmlspecialchars($data);
return $data;
}
?>
Basically I want to send the data from the form but also from the VAR txt with it.
Modify your ajax to contain data Key.
Currently there are no key there.
$.ajax({
type:'POST',
url:'userreg.php',
data: {
firstName: $("#firstName").val(),
lastName: $("#lastName").val(),
// ... and so on until all the form element in here - then your PHP will work
},
success:function(response){
$('#success').html(response);
}
});
your missing name attribute in input field and if u user ajax need to link jquery library file in header. below code help to post your form data using ajax.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>New User Registration</title>
</head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<body>
<div id="newUserHld">
<table id="newUserFrmTbl">
<form id="newUserFrm" method="POST" >
<tr>
<td><label id="firstnameLbl">First Name</label></td>
<td><input type="text" id="firstname" size="20" name="firstname" /></td>
</tr>
<tr>
<td><label id="lastnameLbl">Last Name</label></td>
<td><input type="text" id="lastname" size="20" name="lastname" /></td>
</tr>
<tr>
<td><label id="dobLbl">Date of Birth</label></td>
<td><input type="text" id="dob" size="8" name="dob" /></td>
</tr>
<tr>
<td><label id="positionLbl">Position</label></td>
<td>
<select size="1" name="positionLbl">
<option>Select Option</option>
<option> WFXM </option>
<option>Operations Manager</option>
<option>Assistant</option>
</select>
</td>
</tr>
<tr>
<td><label id="usernameLbl">Username</label></td>
<td><input type="text" id="username" size="20" name="username" /></td>
</tr>
<tr>
<td><label id="passwordLbl">Password</label></td>
<td><input type="password" id="password" size="20" name="password" /></td>
</tr>
<tr>
<td><label id="payRateLbl">Pay Rate</label></td>
<td><input type="text" id="payRate" size="20" name="payRate" /></td>
</tr>
<tr><td><input type="submit" id="createUsr" name="createUsr" value="Create User" onclick="formSubmit(); return false;" /> </td>
</form>
</table>
</div>
<div id="success">
</div>
</body>
<script>
function formSubmit(){
alert($('#newUserFrm').serialize());
$.ajax({
type:'POST',
url:'userreg.php',
data:$('#newUserFrm').serialize(),
success:function(response){
$('#success').html(response);
}
});
return false;
}
</script>
</html>
and php File to check response.
<?php
print_r($_POST);
exit;
?>

How can I only allow certain domains in email field?

Is it possibly to restrict sign up to only one domain like user#gmail.com? Here is my HTML page so far:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="/umfiles/style.css" media="screen"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width; initial-scale=1.0;"/>
<title>User Signup</title>
</head>
<script type="text/javascript" src="/umfiles/general.js"></script>
<body>
<form name="signup" action="" method="post"
onsubmit="return checkSignupForm()">
<input type="hidden" name="signup" value="start" />
<div id="cntr_container">
<table id="cntr_conttable">
<tr>
<td id="cntr_conttd">
<div id="cntr_continner">
<div class="shadow">
<div class="shadow-inner">
<div class="shadow-cnt">
<div id="cntr_logo">
<img src="/umfiles/logo.gif" alt="Mikrotik" />
<p id="logo_title">TITLE</p>
</div>
<table class="cntr_tbl">
<tr>
<td align="right">
email
</td>
<td align="left">
<input type="text" id="sf_email" name="email"
class="signup" value="$(email)" maxlength="100"
autocorrect="off" autocapitalize="off">
</td>
</tr>
<tr>
<td align="right">
phone
</td>
<td align="left">
<input type="text" id="sf_phone" name="phone"
class="signup" value="" maxlength="100"
autocorrect="off" autocapitalize="off">
</td>
</tr>
<tr>
<td align="right">
login
</td>
<td align="left">
<input type="text"
name="login" id="sf_user" maxlength="100"
value="$(login)" class="signup"
autocorrect="off" autocapitalize="off">
</td>
</tr>
<tr>
<td align="right">
password
</td>
<td align="left">
<input type="password" name="password" id="sf_pwd"
class="signup" maxlength="50">
</td>
</tr>
<tr>
<td align="right">
confirm password
</td>
<td align="left">
<input type="password" name="confirm_password" id="sf_cnf_pwd"
class="signup" maxlength="50">
</td>
</tr>
<tr class="top">
<td align="right">
<br />
<b>Prepaid time</b>
</td>
</tr>
<tr class="top">
<td align="right">
time (price)
</td>
<td align="left">
$(profiles)
</td>
</tr>
<tr class="top" id="method_row">
<td align="right">
pay with
</td>
<td align="left">
$(methods)
</td>
</tr>
<tr>
<td colspan="2" align="right">
<input type="submit" name="btn_signup" id="btn_signup" value="Sign up">
</td>
</tr>
<tr>
<td colspan="2" align="center">
<p class="signuperror">$(error)</p>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</td>
</tr>
</table>
</div>
</form>
<script language="JavaScript">
<!--
if (document.signup && document.signup.user) document.signup.user.focus();
function checkSignupForm() {
if (!checkEmail("sf_email")) return false;
if (!checkMinLen("sf_user", "Login", 3)) return false;
if (!checkMinLen("sf_pwd", "Password", 5)) return false;
if (!checkAreEqual("sf_pwd", "sf_cnf_pwd", "Passwords differ")) return false;
return true;
}
-->
</script>
</body>
I believe the part that needs looked at is the bottom javascript section. I apologize for the question, but this got thrown onto me and I know nothing about html and/or javascript.
Thanks in Advance!

Cannot set property 'innerHTML' of null at validatename_degree

I have already seen the pages here for this error, but neither window.load nor putting script in the div block have solved it. If I write document.getElementById("fullname_error"), it is working, but it is not working with document.getElementById(ident) though the var ident is equal to the id of p , I have checked it.
<div class="most_page">
<div id="form_container" >
<form action="register.php" method="post" name="reg_doc">
<table class="table">
<tr>
<td>Full name</td>
<td><input type="text" name="fullname" value="Full name" ></td>
<td><p id="fullname_error" > hh</p></td>
</tr>
<tr>
<td>Address</td>
<td><input type="text" name="address" onkeypress='validatename_degree(fullname.value,fullname_error.id);' value="Address"></td>
</tr>
</table>
<button class="button" id="submitreg" ><input id="submit" type="submit" value="submit"></button>
<script type="text/javascript">
function validatename_degree(x,ident) {
var iden='"'+ident+'"';
document.getElementById(iden).innerHTML=iden;
}
</script>
</form>
</div>
</div>
You don't require var iden='"'+ident+'"'; just use var iden=ident;. Please try this.
<!DOCTYPE html>
<html>
<body>
<div class="most_page">
<div id="form_container">
<form action="register.php" method="post" name="reg_doc">
<table class="table">
<tr>
<td>Full name</td>
<td>
<input type="text" name="fullname" value="Full name">
</td>
<td>
<p id="fullname_error"> hh</p>
</td>
</tr>
<tr>
<td>Address</td>
<td>
<input type="text" name="address" onkeypress='validatename_degree(fullname.value,fullname_error.id);' value="Address">
</td>
</tr>
</table>
<button class="button" id="submitreg">
<input id="submit" type="submit" value="submit">
</button>
<script type="text/javascript">
function validatename_degree(x, ident) {
var iden = ident;
document.getElementById(iden).innerHTML = iden;
}
</script>
</form>
</div>
</div>
</body>
</html>
Just pass the parameter ident to the document.getElementById property and use the your existing code,below is a working snippet
<div class="most_page">
<div id="form_container" >
<form action="register.php" method="post" name="reg_doc">
<table class="table">
<tr>
<td>Full name</td>
<td><input type="text" name="fullname" value="Full name" ></td>
<td><p id="fullname_error" > hh</p></td>
</tr>
<tr>
<td>Address</td>
<td><input type="text" name="address" onkeypress='validatename_degree(fullname.value,fullname_error.id);' value="Address"></td>
</tr>
</table>
<button class="button" id="submitreg" ><input id="submit" type="submit" value="submit"></button>
<script type="text/javascript">
function validatename_degree(x,ident) {
console.log(""+ident)
var iden='"'+ident+'"';
document.getElementById(ident).innerHTML=iden;
}
</script>
</form>
</div>
</div>

Validate text boxes created dynamically having unique ids and names using jQuery validate

I am using jQuery for creating multiple text fields on button click. It is working fine. Now I need to validate all test boxes.
This is my HTML code:
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Patient Portal</title>
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="css/style2.css" />
<![endif]-->
<!--[if !IE]> -->
<link rel="stylesheet" type="text/css" href="css/style.css" />
<!-- <![endif]-->
<script type="text/javascript" language="javascript" src="js/scripts.js"></script>
<script type="text/javascript" language="javascript" src="js/basicnifo.js"></script>
<script src="js/jquery-1.3.2.min.js"></script>
<script src="js/jquery.validate.js"></script>
<script type="text/javascript" src="js/datepicker2.js"></script>
</head>
<body>
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" class="m5">
<tr>
<td valign="top" class="m4">
<form action="#" method="post" name="reg" id="reg">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><div class="m12">
<table width="100%" border="0" cellspacing="1" cellpadding="2" id="items">
<thead>
<tr>
<td colspan="7" align="center" bgcolor="#62a3e0" style="width:15%;"><strong>Problem List</strong></td>
</tr>
<tr>
<td align="center" bgcolor="#EAEAEA" style="width:1%;"><strong>Problem</strong></td>
<td align="center" bgcolor="#EAEAEA" style="width:1%;"><strong>Status</strong></td>
<td align="center" bgcolor="#EAEAEA" style="width:1%;"><strong>Active Date</strong></td>
</tr>
</thead>
<tbody>
<tr>
<td bgcolor="#F5F5F5" style="width:15%;"><input type="text" tabindex="1" name="Problem1" id="Problem1" class="m16 autocomplete" value="" /></td>
<td bgcolor="#F5F5F5" style="width:15%;"><select name="Status1" id="Status1" class="drop2" tabindex="1" >
<option value="1" selected="selected">active</option>
<option value="2">in-active</option>
</select></td>
<td bgcolor="#F5F5F5" style="width:15%;"><input type="text" name="Date1" id="Date1" class="m16 datepick" tabindex="1" value=""/></td>
<input type="hidden" name="patientProblemsid1" id="patientProblemsid1" class="m16" value="0"/>
<input type="hidden" name="sSaved" id="sSaved" value="null" class="m10" />
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="5" align="right">
<input type="button" name="update" id="update" value="ADD ROW" tabindex="10" class="bt-press add_more" onmouseover="changeBgImage('images/button-bg2.png', 'update')" onmouseout="changeBgImage('images/button-bg.png', 'update')" /></td>
</tr>
<tr>
<td colspan="5" align="right">
<input type="submit" name="button" id="SAVE" value="SAVE" class="bt-press" tabindex="50" onmouseover="changeBgImage('images/button-bg2.png', 'SAVE')" onmouseout="changeBgImage('images/button-bg.png', 'SAVE')" />
<input type="submit" name="button" id="NEXT" value="NEXT" class="bt-press" tabindex="51" onmouseover="changeBgImage('images/button-bg2.png', 'NEXT')" onmouseout="changeBgImage('images/button-bg.png', 'NEXT')" /></td>
</tr>
</tfoot>
<input type="hidden" name="item_count" id="item_count" value="1" />
<input type="hidden" name="page" value="patienthistory" class="m10" />
<input type="hidden" name="Cliinicid" value="" class="m10" />
</table>
</div></td>
</tr>
</table>
</form>
<div class="m7"> <br />
</div>
</td>
</tr>
</table>
</body>
</html>
And this is my JavaScript part for adding text boxes on button click:
<script>
$(".add_more").click(function(event){
event.preventDefault();
var count = $("#item_count").val();
count = parseInt(count);
//alert(count);
var new_count = count +1;
// alert(new_count);
// $(".delete_link").remove();
var html = '<tr>\
<td bgcolor="#F5F5F5" style="width:15%;"><input type="text" name="Problem'+new_count+'" id="Problem'+new_count+'" tabindex="11" class="m16 autocomplete" value="" /></td> \
<td width="15%" bgcolor="#F5F5F5" style="width:15%;"><select name="Status'+new_count+'"id="Status'+new_count+'" tabindex="11" class="drop2 ">\
<option value="1" selected="selected"> active</option><option value="2">inactive</option>\
</select></td> \
<td bgcolor="#F5F5F5" style="width:15%;"><input type="text" name="Date'+new_count+'" id="Date'+new_count+'" tabindex="11" class="m16 datepicker" value="" /></td> \
</tr>';
var $html = $(html);
var $ht = $html.find('input.datepicker')[0];
$($ht).datepicker({dateFormat:"mm-dd-yy"});
$('#items > tbody:last').append($html);
$("#item_count").val(new_count);
});
</script>
I need to validate all text boxes. Thanks in advance.
.validate() Will help you to validate your form elements with use of ID or class of a form.
You please follow the following URL to get validation for your script:
http://jqueryvalidation.org/validate/
In your validation script validate each input type text field using same class name like.
$("#SAVE").click(function(){ $(".m16").each(function(){
var values=this.value;
if(values.length<1)
{
alert("Text box empty");
}
});
});

how to replicate input file fields

I've a table named 'pedidos' and a table named 'locais'. For each 'pedidos' there can be several 'locais'. So I'm using this form
In the right column I want the user to type the data for each 'locais' which includes an image file. Then when the user clicks on 'Acrescentar Local' the table on the left is being filled. But instead off adding the image as well it loses the file.
I'm using the code:
<link rel="stylesheet" type="text/css" media="screen" href= "redmond/jquery-ui-1.10.3.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="ui.jqgrid.css" />
<script type="text/javascript" src="jquery-1.9.0.min.js"></script>
<script src="grid.locale-en.js" type="text/javascript"></script>
<script src="jquery.jqGrid.src.js" type="text/javascript"></script>
<title>Untitled Document</title>
</head>
<body>
<script language="javascript">
var a=0;
var clone = [];
function addLoc()
{
/* var tmp = jQuery('#foto').clone();
clone.push(tmp[0]);*/
/*document.getElementById('loc_table').innerHTML+="<tr><td>"+document.getElementById('local').value+"</td><td>"+document.getElementById('comp').value+"</td><td>"+document.getElementById('larg').value+"</td><td>"+clone[a]+"</td></tr>";*/
document.getElementById('loc_table').innerHTML+="<tr><td>"+document.getElementById('local').value+"</td><td>"+document.getElementById('comp').value+"</td><td>"+document.getElementById('larg').value+"</td><td><input type='file' id='foto"+a+"'/></td></tr>";
document.getElementById('foto'+a)=document.getElementById('foto');
a++;
/*
"+document.getElementById('foto').value+"</td></tr>";
*/
}
</script>
<table>
<tr>
<td>
<form id='addPed' name='addPed' action='#' method='POST'>
<table>
<tr>
<td><label for="nome">nome</label></td>
<td><input type="text" id="nome" /></td></tr><tr>
<td><label for="desc">descricao</label></td>
<td><input type="text" id="desc" /></td></tr><tr>
<td><label for="datai">data de insercao</label></td>
<td><input type="text" id="datai" /></td></tr><tr>
<td><label for="datae">data de entrega</label></td>
<td><input type="text" id="date" /></td></tr><tr>
<td></td>
<td><input type="button" value="Adicionar pedido"/></td></tr>
</table>
<br/>
LOCAIS:
<br/>
<br/>
<table id="loc_table">
<tr>
<td class="tableheader">local</td>
<td class="tableheader">comprimento</td>
<td class="tableheader">largura</td>
<td class="tableheader">foto</td>
</tr>
</table>
<!-- </form> -->
</td>
<td>
<!-- <form id='addLoc' name='addPed' action='#' method='POST'> -->
<table>
<tr>
<td><label for="local">local</label></td>
<td><input type="text" id="local" /></td></tr><tr>
<td><label for="comp">comprimento</label></td>
<td><input type="text" id="comp" /></td></tr><tr>
<td><label for="larg">largura</label></td>
<td><input type="text" id="larg" /></td></tr><tr>
<td><label for="foto">foto</label></td>
<td><input type="file" id="foto" /></td></tr><tr>
<td></td>
<td><input type="button" value="Acrescentar Local" onclick="addLoc()"/></td></tr>
</table>
</form>
</td>
</tr>
</table>
Can Anyone sugest me a solution please!
Thanks

Categories