How to correctly validate a modal form

Question

I can\'t seem to get validation to work on my bootstrap modal, I have struggled with several of the examples that I have encountered.

What is the correct way to vali

Answer 1

You have two issues:

1. You're button needs to be set to type="submit" not type="button"

2. Your submit button should be inside your form tag.

See working example Snippet.

$(function() {

  $("#newModalForm").validate({
    rules: {
      pName: {
        required: true,
        minlength: 8
      },
      action: "required"
    },
    messages: {
      pName: {
        required: "Please enter some data",
        minlength: "Your data must be at least 8 characters"
      },
      action: "Please provide some data"
    }
  });
});

Open Modal

  

    

      

        ×
        
Add Stuff
      
      

        

          

            A p Name:
            

              
            
          
          

            Action:
            

              
            
          
          

            Save
            Close