pfam_next_tab

by godhong

HTML

<script src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
<form id="form1">
    <table class="tab tab_Application" border="0">
        <tr>
            <th>
                <label for="id_noa">Number of Applications:</label>
            </th>
            <td>
                <select name="noa" id="id_noa">
                    <option value="">Make a selection</option>
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                </select>
            </td>
        </tr>
        <tr id='noa_header' style="display:none">
            <th>App#</th>
            <th>Month</th>
        </tr>
    </table>
    <tr>
        <input type="submit" />
    </tr>
</form>

JavaScript

$(document).ready(function () {

    $('#form1').validate({ // initialize the plugin
        submitHandler: function (form) {
            alert('valid form submitted');
            return false;
        },
        rules: {
            noa: "required"
        }
    });


    var i = 1;
    $('#id_noa').change(function () {
        var total = $(this).val();
        $('#noa_header').show();
        while (i <= total) {
            $('.tab_Application').append('<tr class="tab_noa1"><td><input name="jm' + i + '" type="text" size="5" value="' + i + '"/></td><td><input type="text" size="5" name="mm' + i + '" id="id_mm' + i + '"/></td></tr>');
            i = i + 1;
        }
        while (i - 1 > total) {
            $(".tab_Application tr:last").remove();
            i = i - 1;
        }

        $('</table>').appendTo('.tab_Application');

        $('[name*="mm"]').each(function () {
            $(this).rules('add', {
                mtp: true
            });
        });
    });

    ////define validation functions    
    $.validator.addMethod("mtp", function (value, element) {
        var pre_val = $(element).parent().prev().val();
        var cur_app_val = $(element).parent().prev('td').children('input').val();
        var pre_val = value;
        
        //console.log(pre_val);
        console.log(pre_val);
        //if (cur_app_val > 1) {
            //return false;
        //}
        return true;
    }, "Please enter a right day");

});