Click here to Skip to main content
15,895,709 members

my bootstrap validation not working in MVC4 Razor .

Member 10817818 asked:

Open original thread
/This is my java script which placed on view page/


JavaScript
<script type='text/javascript'>
    $(document).ready(function () {
        $('#defaultForm').bootstrapValidator({
            message: 'This value is not valid',
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                username: {
                    message: 'The username is not valid',
                    validators: {
                        notEmpty: {
                            message: 'The username is required and can\'t be empty'
                        },
                        stringLength: {
                            min: 6,
                            max: 30,
                            message: 'The username must be more than 6 and less than 30 characters long'
                        },
                        /*remote: {
                            url: 'remote.php',
                            message: 'The username is not available'
                        },*/
                        regexp: {
                            regexp: /^[a-zA-Z0-9_\.]+$/,
                            message: 'The username can only consist of alphabetical, number, dot and underscore'
                        }
                    }
                },
                email: {
                    validators: {
                        notEmpty: {
                            message: 'The email address is required and can\'t be empty'
                        },
                        emailAddress: {
                            message: 'The input is not a valid email address'
                        }
                    }
                },
                password: {
                    validators: {
                        notEmpty: {
                            message: 'The password is required and can\'t be empty'
                        }
                    }
                }
            }
        })
            .on('success.form.bv', function (e) {
                // Prevent form submission
                e.preventDefault();

                // Get the form instance
                var $form = $(e.target);

                // Get the BootstrapValidator instance
                var bv = $form.data('bootstrapValidator');

                // Use Ajax to submit form data
                $.post($form.attr('action'), $form.serialize(), function (result) {
                    console.log(result);
                }, 'json');
            });
    });
   

</script>
<pre lang="text"><pre lang="HTML">
</pre>

<pre lang="c#">
<pre lang="xml">&lt;form id=&quot;defaultForm&quot; method=&quot;post&quot; class=&quot;form-horizontal&quot; &gt;
                &lt;div class=&quot;form-group&quot;&gt;
                    &lt;label class=&quot;col-lg-3 control-label&quot;&gt;Username&lt;/label&gt;
                    &lt;div class=&quot;col-lg-5&quot;&gt;
                        &lt;input type=&quot;text&quot; class=&quot;form-control&quot; name=&quot;username&quot; /&gt;
                    &lt;/div&gt;
                &lt;/div&gt;

                &lt;div class=&quot;form-group&quot;&gt;
                    &lt;label class=&quot;col-lg-3 control-label&quot;&gt;Email address&lt;/label&gt;
                    &lt;div class=&quot;col-lg-5&quot;&gt;
                        &lt;input type=&quot;text&quot; class=&quot;form-control&quot; name=&quot;email&quot; /&gt;
                    &lt;/div&gt;
                &lt;/div&gt;

                &lt;div class=&quot;form-group&quot;&gt;
                    &lt;label class=&quot;col-lg-3 control-label&quot;&gt;Password&lt;/label&gt;
                    &lt;div class=&quot;col-lg-5&quot;&gt;
                        &lt;input type=&quot;password&quot; class=&quot;form-control&quot; name=&quot;password&quot; /&gt;
                    &lt;/div&gt;
                &lt;/div&gt;

                &lt;div class=&quot;form-group&quot;&gt;
                    &lt;div class=&quot;col-lg-6 col-lg-offset-3&quot;&gt;
                        &lt;button type=&quot;button&quot; class=&quot;btn btn-primary&quot; &gt;Sign up&lt;/button&gt;
                    &lt;/div&gt;
                &lt;/div&gt;
            &lt;/form&gt;</pre>




</pre><pre lang="HTML">
Tags: HTML5, jQuery, MVC4

Plain Text
ASM
ASP
ASP.NET
BASIC
BAT
C#
C++
COBOL
CoffeeScript
CSS
Dart
dbase
F#
FORTRAN
HTML
Java
Javascript
Kotlin
Lua
MIDL
MSIL
ObjectiveC
Pascal
PERL
PHP
PowerShell
Python
Razor
Ruby
Scala
Shell
SLN
SQL
Swift
T4
Terminal
TypeScript
VB
VBScript
XML
YAML

Preview



When answering a question please:
  1. Read the question carefully.
  2. Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
  3. If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
  4. Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.
Let's work to help developers, not make them feel stupid.
Please note that all posts will be submitted under the http://www.codeproject.com/info/cpol10.aspx.



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900