CODEWITHSUNDEEP
javascriptjqueryasp.net-mvc-3
Leron
Leron

Reputation: 9846

jQuery custom validation in asp.net mvc 3 razor view

I have very basic knowledge about JS/jQuery. I need to perform check on the value of certain text boxes. The example just recreates the problem I heave with the real application which is a lot bigger and the tables are dynamically created based on a data from a data base, so in run time I add the classes on which I base my jQuery logic.

Here is the jsfiddle example - http://jsfiddle.net/Xhnbm/

There are three different checks I need to do - for float, for string length and for float, however you may see that the validations is not performed I always get the integer exception and even if you remove the integer check the validation is not working either, so I guess the problem is not in the functions themselves but somewhere else.

Thanks for help.

P.S

It seem I can't submit the question without adding code. All the code is in the jsfiddle example but since I need to add some here too, I think that the problem is either in the way I declare may functions that perform the check or here :

$('#submitDocument').click(function () {
            try {
                if ($(".checkString16").val().length > 16) {
                    throw "The text can be up to 16 symbols";
                } else if (!mathFunctions.isInt($(".checkULong").val())) {
                    throw "Insert integer";
                } else if (!mathFunctions.isFloat($(".checkFloat").val())) {
                    throw "Insert float";
                }
                validationResult = true;
            } catch (exc) {
                alert(exc)
                validationResult = false;
            }
            return validationResult;
        });

in the way I try to execute the validation when the submit button is clicked. But being no Js programmer at all I don't want to point you to wrong directions.

Upvotes: 0

Views: 1048

Answers (1)

Kamil T
Kamil T

Reputation: 2216

$('#submitDocument').click(function () {
        var validationResult = true;
            if ($(".checkString16 input[type='text']:first").val().length > 16) {
                validationResult=false;
            } else if (!mathFunctions.isInt($(".checkULong input[type='text']:first").val())) {
                validationResult=false;
            } else if (!mathFunctions.isFloat($(".checkFloat input[type='text']:first").val())) {
                validationResult=false;
            }
        return validationResult;
    });

This should do the trick. If the #submitDocument is a input type='submit' and you use it to submit the form, you should try this way:

$('#submitDocument').click(function (e) {
            if ($(".checkString16 input[type='text']:first").val().length > 16) {
                e.preventDefault();
            } else if (!mathFunctions.isInt($(".checkULong input[type='text']:first").val())) {
                e.preventDefault();
            } else if (!mathFunctions.isFloat($(".checkFloat input[type='text']:first").val())) {
                e.preventDefault();
            }
    });

The e.preventDefault() will prevent the submit button from doing it default handler, which is submitting the form.

You can always submit the form manually from the code, using $("#formId").submit();

PS. Make sure that you are also validating those values in code behind, because simple jquery validation is easy to come around.

Upvotes: 1

Related Questions