I am writing an accounting sofware, and I have difficulties with the form used to enter the debit and credit for a given transaction.
I have used the Jquery validation plugin demo, but I don't know how to hide a specific input cell and replace it by blanks. In accounting, you have either a credit or a debit. So I have an indicator tick box at the beginning of each line which defines whether the line is a debit or credit, and if so it hides the credit cell or debit cell. Would you mind looking at the example below and let me know how it could be done? Thanks, Francois </head> <body> <h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery- plugin-validation/">jQuery Validation Plugin</a> Demo</h1> <div id="main"> <textarea style="display:none" id="template"> <tr> <td> </td> <td class='type'> <input id="checkme-{0}" type="checkbox" name="debitcredit" value="D"> </td> <td class='account_from_chart'> <select> <option value="1">Income</option> <option value="2">Expense</option> </select> </td> <div id="debit"> <td class='debit'> <input size='4' class="quantity" min="1" id="item-quantity-{0}" name="item-quantity-{0}" /> </td> </div> <div id="credit" > <td class='credit'> <input size='4' class="quantity" min="1" id="item-quantity-{0}" name="item-quantity-{0}" /> </td> <div> <td class='currency'> <select name="item-type-{0}"> <option value="USD">USD</option> <option value="GBP">GBP</option> </select> </td> </td> <td class='debit_functional'> <input size='4' class="debit_functional" min="0.01" id="item- quantity-{0}" name="item-quantity-{0}" /> </td> <td class='credit_functional'> <input size='4' class="credit_functional" min="0.01" id="item- quantity-{0}" name="item-quantity-{0}" /> </td> <td> <button id="delete_line">Delete</button> </td> <td class='quantity-error'></td> </tr> </textarea> <form id="orderform" class="cmxform" method="get" action="foo.html"> <h2 id="summary"></h2> <fieldset> <legend>Example with custom methods and heavily customized error display</legend> <table id="orderitems"> <tbody> </tbody> <tfoot> <tr></tr> <tr> <td colspan="9"></td> <td class="totaldebit"><input id="totaldebit" name="totaldebit" value="0" readonly="readonly" size='4' /></td> <td class="totalcredit"><input id="totalcredit" name="totalcredit" value="0" readonly="readonly" size='4' /></td> </tr> <tr> <td colspan="2"> </td> <td><input class="submit" type="submit" value="Submit"/></td> </tr> </tfoot> </table> </fieldset> </form> <button id="add">Add another input to the form</button> <h1 id="warning">Your form contains tons of errors! Please try again.</ h1> <p><a href="index.html">Back to main page</a></p> </div> <script src="http://www.google-analytics.com/urchin.js" type="text/ javascript"> </script> <script type="text/javascript"> _uacct = "UA-2623402-1"; urchinTracker(); </script> </body> </html> </head> <body> <div style="width: 500px;"> <form> <label for="name">Name:</label> <input id="name" type="text"> <label for="checkbox">Check to enter your email address:</label> <input id="checkme" type="checkbox" /> <div id="extra"> <label for="email">debit:</label> <input id="email" type="text" /> </div> <div id="extra2"> <label for="email">credit:</label> <input id="email" type="text" /> </div> </form> </body> </html>