Jquery Dynamic Add button implementation code _jquery

Click Add Dynamic Add two text box: x and Y values respectively, click Cancel Delete the line of 2 text boxes

Remember to introduce jquery.js

Copy Code code as follows:

<script type= "Text/javascript" src= "Js/jquery.js" ></script>
<script type= "Text/javascript" >
$ (function () {
$ ("#btnMian"). Click (function () {
Generate 0 to 100000 random numbers mapth.random generate 0 to 1 random numbers and multiply by 100000
var maxnumber = 100000;
var randomnumber = Math.Round (MaxNumber * math.random ());
alert (Randomnumber);
var s = "";
S + + "<table name= '" + randomnumber + "' width=\" 450\ "><tr>";
S + + "<td width=\" 72\ "></td>";
S + + "<td width=\" 155\ "align=\" left\ ">";
S + + "<input type= ' text ' name= ' M1 '/></td>";
S + + "<td align=\" left\ "width=\" 155\ "><input type= ' text ' name= ' M1 '/></td> '";
S + + "<td><a onclick=\" del ("+ randomnumber +") \ "style= ' Cursor:pointer ' > Cancel </a><span style=\" color:red\ "></span></td></tr></table>";
var $mm = $ (s);
var $parent = $ ("#mian");
$parent. Append ($MM);
})
})

Function del (AA) {
$ ("#mian >table[name=" + AA + "]"). Remove ();
}
function Checkform () {
var txtitemname = $ ("#txtItemName"). Val ();
if (Txtitemname.replace (/[\s]/g, '). Length < 1) {
$ ("#lblMess"). HTML ("Please enter project name");
$ ("#lblMess"). AddClass ("Onblurclasserror");
return false;
}
var Txtitemid = $ ("#txtItemId"). Val ();
if (Txtitemid.replace (/[\s]/g, '). Length < 1) {
$ ("#lblMess"). HTML ("Please enter project number");
$ ("#lblMess"). AddClass ("Onblurclasserror");
return false;
}
var Txtuser = $ ("#txtUser"). Val ();
if (Txtuser.replace (/[\s]/g, '). length<1)
{
$ ("#lblMess"). HTML ("Please enter Inspectors");
$ ("#lblMess"). AddClass ("Onblurclasserror");
return false;
}
Looping through the value of a text box
var Zheng = new RegExp (([0-9]+\\.[ 0-9]*[1-9][0-9]*) | ([0-9]*[1-9][0-9]*\\. [0-9]+) | ([0-9]*[1-9][0-9]*)] $");
var flag = true;
$ ("[Name= ' M1 ']:text"). each (function () {
if ($ (this). Val (). replace (/[\s]/g, '). Length < 1) {
$ ("#lblMess"). HTML ("Please input the coordinate value of the face!");
$ ("#lblMess"). AddClass ("Onblurclasserror");
return false;
Flag = false;
}
else {
if (!zheng.test (this). Val ()) {
$ ("#lblMess"). HTML ("Please enter the correct coordinate value of the face!");
$ ("#lblMess"). AddClass ("Onblurclasserror");
return False
Flag = false;
}
}

})
if (flag = = False) {
return false;
}
var mian = $ ("#txtMianInfo"). Val ();
if (Mian.replace (/[\s]/g). Length < 1) {
$ ("#lblMess"). HTML ("Please enter a description of the face");
$ ("#lblMess"). AddClass ("Onblurclasserror");
return false;
}

return true;
}
</script>

HTML code

Copy Code code as follows:

<div id= "Content" >
<table style= "width:450px;" >
<tr>
&LT;TD class= "Style1" >
Project name

</td>
&LT;TD class= "Style2" >
<asp:textbox id= "Txtitemname" runat= "Server" ></asp:TextBox>
</td>
&LT;TD class= "Style3" >

</td>
<td>

</td>
</tr>
<tr>
&LT;TD class= "Style1" >
<asp:label id= "Label3" runat= "text=" project number: "></asp:Label>
</td>
&LT;TD class= "Style2" >
<asp:textbox id= "Txtitemid" runat= "Server" ></asp:TextBox>
</td>
&LT;TD class= "Style3" >

</td>
<td>

</td>
</tr>
<tr>
&LT;TD class= "Style1" >
<asp:label id= "Label2" runat= "Server" text= "Inspectors:" ></asp:Label>
</td>
&LT;TD class= "Style2" >
<asp:textbox id= "Txtuser" runat= "Server" ></asp:TextBox>
</td>
&LT;TD class= "Style3" >

</td>
<td>

</td>
</tr>
</table>
<table width= "450" >

<tr>
&LT;TD width= "83px" >
<asp:label id= "Label6" runat= "server" text= "Face:" ></asp:Label>
</td>
&LT;TD class= "Style2" >
<input id= "Text5" Name= "M1" type= "text"/>
</td>
&LT;TD class= "Style3" >
<input id= "Text6" Name= "M1" type= "text"/>
</td>
<td>

<input id= "Btnmian" type= "button" value= "Add"/></td>
</tr>

</table>
<div id= "Mian" style= "width:450px" ></div>

<table width= "450" >
<tr>
&LT;TD class= "Style1" >
Face Description:
</td>
&LT;TD colspan= "2" style= "Text-align:left" >
<asp:textbox id= "Txtmianinfo" runat= "Server" width= "247px" ></asp:TextBox>
</td>
<td>

</td>
</tr>
<tr>
&LT;TD class= "Style1" >

</td>
&LT;TD class= "Style2" style= "Text-align:center;" >
</td>
&LT;TD class= "Style3" >

</td>
<td>

</td>
</tr>
<tr>
&LT;TD class= "Style1" >

</td>
&LT;TD class= "Style2" style= "text-align:left;" colspan= "3" >
<asp:label id= "lblmess" runat= "Server" forecolor= "Red" ></asp:Label>
</td>
</tr>
<tr>
&LT;TD class= "Style1" colspan= "4" >

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

</div>