Maybe you want to use the clone() function to help you out: http://docs.jquery.com/Clone
On Feb 16, 12:44 pm, "David .Wu" <chan1...@gmail.com> wrote: > sometimes we have two form that almost the same fields, so we will > give client a clone button if the information is complete the same, > this is how I do now, is there any easy way to accomplish that? > > <!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>clone form</title> > <style type="text/css"> > <!-- > body { > font-size: 12px;} > > div.box { > width: 500px; > border: 1px solid #000000; > padding: 6px; > margin: 0 0 6px 0;} > > --> > </style> > <script type="text/javascript" src="js/jquery-1.3.1.js"></script> > </head> > <body> > <div class="box"> > <form method="post" name="form1" id="form1"> > <label for="name">name</label> > <input name="name" type="text" id="name" value="David" /> > <br /> > <label> > <input name="gender" type="radio" id="gender_0" value="1" > checked="checked" /> > male</label> > <br /> > <label> > <input type="radio" name="gender" value="0" id="gender_1" / > > female</label> > <br /> > <input type="checkbox" id="clone" /><label > for="clone">clone</label> > </form> > </div> > <div class="box"> > <form method="post" name="form2" id="form2"> > <label for="name2">name2</label> > <input type="text" name="name2" id="name2" /> > <label> > <br /> > <input type="radio" name="gender2" value="1" > id="gender2_0" /> > male</label> > <br /> > <label> > <input type="radio" name="gender2" value="0" > id="gender2_1" /> > female</label> > <br /> > </form> > </div> > <script language="javascript"> > <!-- > $(function() { > /*if click checkbox clone*/ > $('input#clone').click(function() { > > $name = $('form#form1 input#name'); > $gender = $('form#form1 input[name="gender"]'); > $name2 = $('form#form2 input#name2'); > $gender2 = $('form#form2 input[name="gender2"]'); > > /* > * check if it been checked > * if checked clone the information > * if not checked clear form2's value > */ > if ($(this).is(':checked')) { > $name2.val($name.val()); > $gender.each(function() { > if ($(this).is(':checked')) { > > $gender2.eq($gender.index(this)).attr('checked', true); > } > }); > } else { > $name2.val(''); > $gender2.attr('checked', false); > } > }); > }); > --> > </script> > </body> > </html>
