how to replicate input file fields - javascript

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

Related

Real time calculation of form with minimum order

I've borrowed some code from two different sources and splice them together. One works (The ordering total) but the 2nd one (Minimum order) does not. I'm a newb when it comes to Java and probably am just missing a command or something.
'total' is being used for both and should be re enabling the submit button once 'total' is above 20.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>temp</title>
<script language="javascript">
function calculate(form)
{
var item1 = form.item1.value;
var item2 = form.item2.value;
form.total.value = (item1 * 10) + (item2 * 30);
};
</script>
<script language="javascript">
setInterval(function () {
if ($('#total').val() >= 20)
$(":submit").removeAttr("disabled");
else
$(":submit").attr("disabled", "disabled");
}, 1);
</script>
</head>
<body>
<form method="POST" action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>" >
<table border="1" cellspacing="1" width="757">
<tr>
<td width="224" align="center"><strong>Quantity</strong></td>
<td width="39" align="center"><strong>price</strong></td>
<td width="476" align="center"><strong>total</strong></td>
</tr>
<tr>
<td width="224">item1<input type="number" name="item1" size="20" onchange="calculate(this.form)" value="0"></td>
<td width="39">$10</td>
</tr>
<tr>
<td width="224">item2<input type="number" name="item2" size="20" onchange="calculate(this.form)" value="0"> </td>
<td width="39">$30</td>
</tr>
<tr>
<td width="224"> </td>
<td width="39">total</td>
<td width="476"> <input type="number" name="total" size="20"></td>
</tr>
</table>
<p><input type="submit" value="Submit Order" disabled title="Order is below $20 minimum."></p>
</form>
</body>
</html>
$('#total') looks for element with id total, but you don't have it (you have only name),
so, by adding id - form is working
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>temp</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script language="javascript">
function calculate(form)
{
var item1 = form.item1.value;
var item2 = form.item2.value;
form.total.value = (item1 * 10) + (item2 * 30);
};
</script>
<script language="javascript">
setInterval(function () {
if ($('#total').val() >= 20)
$(":submit").removeAttr("disabled");
else
$(":submit").attr("disabled", "disabled");
}, 1);
</script>
</head>
<body>
<form method="POST" action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>" >
<table>
<tr>
<td align="center"><strong>Quantity</strong></td>
<td align="center"><strong>price</strong></td>
<td align="center"><strong>total</strong></td>
</tr>
<tr>
<td>item1<input type="number" name="item1" size="20" onchange="calculate(this.form)" value="0"></td>
<td width="39">$10</td>
</tr>
<tr>
<td>item2<input type="number" name="item2" size="20" onchange="calculate(this.form)" value="0"> </td>
<td>$30</td>
</tr>
<tr>
<td> </td>
<td>total</td>
<td> <input type="number" id="total" name="total" size="20"></td>
</tr>
</table>
<p><input type="submit" value="Submit Order" disabled title="Order is below $20 minimum."></p>
</form>
</body>
</html>

Show Value in pop up window

I want to show form value in pop up window which is open after clicking submit button. how can i show form value in pop up window after clicking submit button. My Form is below
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<body>
<form name="example" action="" method="post">
<table width="257" border="1">
<tr>
<td>Name</td>
<td><input type="text" name="name" id="name" /></td>
</tr>
<tr>
<td>Father Name</td>
<td><input type="text" value="" name="fname" id="fname" /></td>
</tr>
<tr>
<td colspan="2"><center><input type="submit" name="submit" value="Show Value" /></center></td>
</tr>
</table>
</form>
</body>
</html>
Get data using input id and set form delay for submit and read javascript and jquery basic concept on w3 school
<html>
<head>
<title>Demo</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/jquery-ui.js" type="text/javascript"></script>
<link href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/themes/blitzer/jquery-ui.css"
rel="stylesheet" type="text/css" />
</head>
<body>
<form name="example" action="" method="post" id="example">
<table width="257" border="1">
<tr>
<td>Name</td>
<td><input type="text" name="name" id="name" /></td>
</tr>
<tr>
<td>Father Name</td>
<td><input type="text" value="" name="fname" id="fname" /></td>
</tr>
<tr>
<td colspan="2"><center> <input type="button" id="btnShow" value="Submit" /></center></td>
</tr>
</table>
</form>
<div id="dialog" style="display: none" align="center">
<label>Name :</label><span id="show_name"></span>
<br>
<label>Father Name :</label><span id="show_fname"></span>
</div>
</body>
</html>
<script>
$(function () {
$("#dialog").dialog({
modal: true,
autoOpen: false,
title: "User Details",
width: 300,
height: 150,
});
$("#btnShow").click(function (e) {
e.preventDefault();
var name=$("#name").val();
var fname=$("#fname").val();
$("#show_name").html(name);
$("#show_fname").html(fname);
$('#dialog').dialog('open');
setTimeout(function() {
$("#example").submit();
}, 3000);
});
});
</script>
at first, your button is type="submit", but if you want just show values you need set type="button", and call some function in onclick attribute, what will show your values,like that:
button
<input type="button" name="button" value="Show Value" onclick="myFunction()"/>
and you need add js script for show values:
function myFunction(){
var name = document.getElementById("name").value;
var fname = document.getElementById("fname").value;
alert(name+' '+fname)
}

How to get the data from text boxes of checked rows on Alert box in Jquery?

I want to view all the rows which are checked on m alert box whenever i press the button but i am doing something wrong here
Javascript for Adding rows
$("#add").click(function () {
$("#myTable").last().append("<tr><td width='5%'><input type='checkbox'>
</td><td><input type='text' id='1stid'>
</td><td><input type='text' id='2ndid'></td><td><input type='text'id='3rdid'></td></tr>");
});
I also did this but now the alert box is empty
$("#view").click(function () {
$('input[type="checkbox"]:checked');
var n=$(this).closest('tr').text();
alert(n);
});
My HTML
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<link rel="stylesheet" href="Project.css">
</head>
<body>
<div class="container">
<button id="add">Add</button> <button id="deleteLast">Remove </button> <button id="delete"> Remove All</button> <button id="view">View</button>
<table class="table table-bordered" id="myTable">
<tr>
<th width="5%"></th>
<th>First name</th>
<th>Last name</th>
<th>Profession</th>
</tr>
</table>
</div>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="Project.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</body>
</html>
Since the $("input[type='checkbox']:checked") will return an array/list of elements, use jQuery's each method, $("input[type='checkbox']:checked").each(...) to iterate through the result
$("#view").click(function() {
$("input[type='checkbox']:checked").each(function(index) {
$('td input[type=text]', $(this).closest('tr')).each(function(index2) {
alert( $(this).val() );
});
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr class="test">
<td width='5%'>
<input type='checkbox'>
</td>
<td>
<input type='text' id='11stid' value="1 first">
</td>
<td>
<input type='text' id='12ndid' value="1 second">
</td>
<td>
<input type='text' id='13rdid' value="1 third">
</td>
</tr>
<tr>
<td width='5%'>
<input type='checkbox'>
</td>
<td>
<input type='text' id='21stid' value="2 first">
</td>
<td>
<input type='text' id='22ndid' value="2 second">
</td>
<td>
<input type='text' id='23rdid' value="2 third">
</td>
</tr>
<tr>
<td width='5%'>
<input type='checkbox'>
</td>
<td>
<input type='text' id='31stid' value="3 first">
</td>
<td>
<input type='text' id='32ndid' value="3 second">
</td>
<td>
<input type='text' id='33rdid' value="3 third">
</td>
</tr>
</table>
<button id="view">Checked</button>

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

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...

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");
}
});
});

Categories