Virtual Form

Without

tag, easy to make multiple nested forms and json.

Requirements: jquery-1.7.2.js, json2.js, jquery.virtualform-0.1.js

<div _class="form" _name="project"> <h2>Project</h2> Project Name <input type="text" name="name" value="Sample Project"><br> Status <select name="status"> <option value="Requriements">Requriements</option> <option value="Design" selected>Design</option> <option value="Implementation">Implementation</option> <option value="Verification">Verification</option> <option value="Maintenance">Maintenance</option> </select><br> Type <input type="radio" name="type" value="A"> A <input type="radio" name="type" value="B"> B <input type="radio" name="type" value="C"> C<br> Style <input type="checkbox" name="style" value="ABC"> ABC <input type="checkbox" name="style" value="DEF"> DEF <input type="checkbox" name="style" value="GHI"> GHI<br> Comment <textarea name="comment" style="width:200px;height:50px"> </textarea><br> Tag <input type="text" name="tag" value="sample" disabled> </div>
<div _class="form" _name="project"> <h2>Project</h2> Project Name <input type="text" name="name" value="Sample Project"><br> Status <select name="status"> <option value="Requriements">Requriements</option> <option value="Design" selected>Design</option> <option value="Implementation">Implementation</option> <option value="Verification">Verification</option> <option value="Maintenance">Maintenance</option> </select><br> Type <input type="radio" name="type" value="A"> A <input type="radio" name="type" value="B"> B <input type="radio" name="type" value="C"> C<br> Style <input type="checkbox" name="style" value="ABC"> ABC <input type="checkbox" name="style" value="DEF"> DEF <input type="checkbox" name="style" value="GHI"> GHI<br> Comment <textarea name="comment" style="width:200px;height:50px"> </textarea><br> Tag <input type="text" name="tag" value="sample" disabled> <h2>Package</h2> <table class="table table-bordered"> <tr><td>Package Name</td><td>Writer</td><td>Summary</tr> <tr _class="form" _name="packageList"> <td><input type="text" name="name" value="com.sample.controller"></td> <td><input type="text" name="writer" value="Tom"></td> <td>Controller</td> </tr> <tr _class="form" _name="packageList"> <td><input type="text" name="name" value="com.sample.service"></td> <td><input type="text" name="writer" value="James"></td> <td>Service</td> </tr> </table> </div>
<div _class="form" _name="project"> <h2>Project</h2> Project Name <input type="text" name="name" value="Sample Project"><br> Status <select name="status"> <option value="Requriements">Requriements</option> <option value="Design" selected>Design</option> <option value="Implementation">Implementation</option> <option value="Verification">Verification</option> <option value="Maintenance">Maintenance</option> </select><br> Type <input type="radio" name="type" value="A"> A <input type="radio" name="type" value="B"> B <input type="radio" name="type" value="C"> C<br> Style <input type="checkbox" name="style" value="ABC" _type="list"> ABC <input type="checkbox" name="style" value="DEF" _type="list"> DEF <input type="checkbox" name="style" value="GHI" _type="list"> GHI<br> Comment <textarea name="comment" style="width:200px;height:50px"> </textarea><br> Tag <input type="text" name="tag" value="sample" disabled> <h2>Package</h2> <table class="table table-bordered"> <tr><td>Package</td><td>Writer</td><td>Summary</tr> <tr _class="form" _name="packageList"> <td> <input type="text" name="name" value="com.sample.controller"> <h2>Classes</h2> <table class="table table-bordered"> <tr><td>Name</td><td>Method<br>Coverage</td><td>Branch<br>Coverage</td></tr> <tr _class="form" _name="classList"> <td><input type="text" name="name" value="MainController" style="width:100px"></td> <td><input type="text" name="methodCoverage" value="30" style="width:30px">%</td> <td><input type="text" name="branchCoverage" value="7" style="width:30px">%</td> </tr> <tr _class="form" _name="classList"> <td><input type="text" name="name" value="EtcController" style="width:100px"></td> <td><input type="text" name="methodCoverage" value="60" style="width:30px">%</td> <td><input type="text" name="branchCoverage" value="11" style="width:30px">%</td> </tr> </table> </td> <td><input type="text" name="writer" value="Tom"></td> <td>Controller</td> </tr> <tr _class="form" _name="packageList"> <td><input type="text" name="name" value="com.sample.service"> <h2>Classes</h2> <table class="table table-bordered"> <tr><td>Name</td><td>Method<br>Coverage</td><td>Branch<br>Coverage</td></tr> <tr _class="form" _name="classList"> <td><input type="text" name="name" value="NewController" style="width:100px"></td> <td><input type="text" name="methodCoverage" value="10" style="width:30px">%</td> <td><input type="text" name="branchCoverage" value="1" style="width:30px">%</td> </tr> <tr _class="form" _name="classList"> <td><input type="text" name="name" value="SampleController" style="width:100px"></td> <td><input type="text" name="methodCoverage" value="25" style="width:30px">%</td> <td><input type="text" name="branchCoverage" value="2" style="width:30px">%</td> </tr> <tr _class="form" _name="classList"> <td><input type="text" name="name" value="TestController" style="width:100px"></td> <td><input type="text" name="methodCoverage" value="80" style="width:30px">%</td> <td><input type="text" name="branchCoverage" value="24" style="width:30px">%</td> </tr> </table> </td> <td><input type="text" name="writer" value="James"></td> <td>Service</td> </tr> </table> </div>