How to use Jquery Validation with jEditable in DataTables

Question

I looked at some of the other questions but I couldn't get their solutions to work. I'm using this code in DataTables to validate a jEditable field:

            $('#example tbody .samples').editable( 'jeditable_ajax.php', {

            submitdata: function ( value, settings ) {
                return {
                    row_id: oTable.fnGetData(oTable.fnGetPosition(this)[0],0),
                    column: oTable.fnGetPosition(this)[2]
                };
            },
            onsubmit: function(settings, td){
                console.log($(this));
                console.log($(this).find('input').attr('name'));

                $(this).validate({
                    debug: true,
                    rules: {
                        value: {
                            required: true,
                            number: true
                        }
                    },
                    messages: {
                        value: "Error"
                    },
                    errorClass: "invalid",
                    submitHandler: function() {                        
                        alert("Success!");
                    }
                });
                return ($(this).valid());
            },

            onblur: "submit",
            placeholder: " ",
            tooltip: "Click to edit"
        } );

I don't get any debug errors from jQuery Validation (with debug: true on), and the jEditable field seems to automatically have the name of value (ie: <input type="text" name="value"/>, which I confirmed with console.log($(this).find('input').attr('name'));.

The errorClass isn't applied and no error messages for non-number data.

Answer 1

For some reason now the code works, even if I copy/paste the above block of code, where it didn't before... I've got no idea why.