jQuery验证插件以确保Materialize CSS需要Select选项吗？

Question

  $(document).ready(function() { $('select').material_select(); }); $.validator.setDefaults({ errorClass : 'invalid', validClass : "valid", errorPlacement : function(error, element) { $(element).closest("form").find( "label[for='" + element.attr("id") + "']").attr('data-error', error.text()); }, submitHandler : function(form) { console.log('form ok'); } }); $.validator.addMethod("valueNotEquals", function(value, element, arg) { return arg != value; }, "Value must not equal arg."); $("#form").validate({ rules : { dateField : { date : true }, world_region : { valueNotEquals : "default" } }, messages : { world_region : { valueNotEquals : "This field is required. Please select an item." } } }); 

The following JSFiddle has the code I am trying to implement. https://jsfiddle.net/869mdk5a/6/

What I am trying to do is require a selection on a select/option dropdown. If you click the submit button in the fiddle you will see that all the text field inputs update to red and show "This field is required" under the input area. How do I get the "This field is required. Please select an option" to show below where the select field is located?

I wrote a validator addMethod and would expect it to work just like an input. Ideas?

Thanks!

Answer 1

All you need is add required:true to your code eg:

 world_region: {
      required:true,
      valueNotEquals: "default"
    }

hope this help you !