Подтверждение выпадающего списка

Question

Хорошо, поэтому я пытаюсь проверить мое раскрывающееся меню с помощью специального правила и НЕ желать делать это inline, потому что это должно быть целочисленное значение. Это означает, что у него не может быть опция «Выберите вариант» при подаче. Поэтому я не знаю, нужно ли мне даже отключить его или как я должен справиться с этим.

<select id="sel1R3" class="chzn-done" name="sticky" style="display: none;"> 
    <option selected="selected" value="">Please Select An Option</option> 
    <option value="0">No</option> 
    <option value="1">Yes</option> 
</select> 

EDIT: Теперь по какой-то причине его не показывает ошибку проверки для выпадающего списка.

JQuery:

$(document).ready(function() 
{ 

$.validator.addMethod("valueNotEquals", function (value, element, arg) { 
    return arg != value; 
}, "Message to User"); 

/* 
* Validate the form when it is submitted 
*/ 
var validateform = $("#newArticleForm").validate({ 
    rules: { 
     title: { 
      required: true, 
      minlength: 5 
     }, 
     category: { 
      required: true, 
      {valueNotEquals: "-1"} 
     }, 
     sticky: { 
      required: true, 
      {valueNotEquals: "-1"} 
     }, 
     comments: { 
      required: true, 
      {valueNotEquals: "-1"} 
     }, 
     datetime: { 
      required: true, 
      date: true 
     }, 
     status: { 
      required: true, 
      {valueNotEquals: "-1"} 
     }, 
     file: { 
      required: true, 
      accept: 'png|jpe?g|gif' 
     }, 
     permalink: { 
      required: true, 
     }, 
     article: { 
      required: true, 
      minlength: 5 
     } 
    }, 
    invalidHandler: function(form, validator) { 
     var errors = validator.numberOfInvalids(); 
     if (errors) { 
      var message = errors == 1 
      ? 'You missed 1 field. It has been highlighted.' 
      : 'You missed ' + errors + ' fields. They have been highlighted.'; 
      $('.box .content').removeAlertBoxes(); 
      $('.box .content').alertBox(message, {type: 'warning', icon: true, noMargin: false}); 
      $('.box .content .alert').css({ 
       width: '100%', 
       margin: '0', 
       borderLeft: 'none', 
       borderRight: 'none', 
       borderRadius: 0 
      }); 
     } else { 
      $('.box .content').removeAlertBoxes(); 
     } 
    }, 
    showErrors : function(errorMap, errorList) { 
     this.defaultShowErrors(); 
     var self = this; 
     $.each(errorList, function() { 
      var $input = $(this.element); 
      var $label = $input.parent().find('label.error').hide(); 
      $label.addClass('red'); 
      $label.css('width', ''); 
      $input.trigger('labeled'); 
      $label.fadeIn(); 
     }); 
    }, 
    submitHandler: function(form) { 
     var dataString = $('#newArticleForm').serialize(); 
     $.ajax({ 
      type: 'POST', 
      url: 'dashboard/articleSubmit', 
      data: dataString, 
      dataType: 'json', 
      success: function(data) { 
       if (data.error) { 
        $('.box .content').removeAlertBoxes(); 
        $('.box .content').alertBox(data.message, {type: 'warning', icon: true, noMargin: false}); 
        $('.box .content .alert').css({ 
         width: '', 
         margin: '0', 
         borderLeft: 'none', 
         borderRight: 'none', 
         borderRadius: 0 
        }); 
       } 
       else 
       { 
        $('.box .content').removeAlertBoxes(); 
        $('.box .content').alertBox(data.message, {type: 'success', icon: true, noMargin: false}); 
        $('.box .content .alert').css({ 
         width: '', 
         margin: '0', 
         borderLeft: 'none', 
         borderRight: 'none', 
         borderRadius: 0 
        }); 
        $(':input','#newArticleForm') 
        .not(':submit, :button, :hidden, :reset') 
        .val(''); 
       } 
      } 
     }); 
    } 
}); 

}); 

HTML:

<div class="grid_6"> 
     <div class="box"> 
      <div class="header"> 
       <img src="http://www.kansasoutlawwrestling.com/kowmanager/assets/img/icons/packs/fugue/16x16/document--plus.png" alt="" width="16" height="16" /> 
       <h3>Create a News Article</h3> 
      </div> 
          <form method="post" accept-charset="utf-8" id="newArticleForm" enctype="multipart/form-data">     <div class="content no-padding"> 
        <div class="section _100"> 
         <label for="title">Title</label> 
         <div> 
          <input type="text" name="title" value="" />       </div> 
        </div> 

        <div class="section _100"> 
         <label for="category">Category</label> 
         <div> 
          <select name="category"> 
<option value="" selected="selected">Please Select An Opion</option> 
<option value="4">Columns</option> 
<option value="2">Headlines</option> 
<option value="1">Main News</option> 
<option value="3">Rumors</option> 
</select>       </div> 
        </div> 

        <div class="section _100"> 
         <label for="sticky">Is Sticky</label> 
         <div> 
          <select name="sticky"> 
<option value="-1">Please Select An Option</option> 
<option value="0">No</option> 
<option value="1">Yes</option> 
</select>       </div> 
        </div> 

        <div class="section _100"> 
         <label for="comments">Allow Comments</label> 
         <div> 
          <select name="comments"> 
<option value="-1">Please Select An Option</option> 
<option value="0">No</option> 
<option value="1">Yes</option> 
</select>       </div> 
        </div> 

        <div class="section _100"> 
         <label for="datetime">Date Comments Expire</label> 
         <div> 
          <input id="datetime" type="datetime" name="datetime" /> 
         </div> 
        </div> 

        <div class="section _100"> 
         <label for="status">Status</label> 
         <div> 
          <select name="status"> 
<option value="-1">Please Select An Option</option> 
<option value="0">Inactive</option> 
<option value="1">Active</option> 
</select>       </div> 
        </div> 

        <div class="section _100"> 
         <label for="file">Image</label>       <div> 
          <input type="file" name="file" value="" />       </div> 
        </div> 

        <div class="section _100"> 
         <label for="permalink">Permalink</label> 
         <div> 
          <input type="text" name="permalink" value="" />       </div> 
        </div> 

        <div class="section _100"> 
         <label for="article">Article</label> 
         <div> 
          <textarea name="article" cols="30" rows="5" id="article" ></textarea>       </div> 
        </div> 
       </div><!-- End of .content --> 

       <div class="actions"> 
        <div class="actions-left"> 
         <input type="reset" name="reset" value="Reset" id="reset" />      </div> 

        <div class="actions-right"> 
         <input type="submit" name="submit" value="Submit" id="submit" />      </div> 
       </div><!-- End of .actions --> 
      </form>   </div><!-- End of .box --> 
    </div><!-- End of .grid_6 --> 

Любые другие идеи?

EDIT:

Я посмотрел везде в документации JQuery и не могу найти, как сделать это правильно.

Answer 1

Правильный способ определить ваше пользовательское правило проверки, как это:

category: { 
    required: true, 
    valueNotEquals: "-1" 
} 

Это, как говорится, вы не должны создавать пользовательские правила, чтобы иметь дело с этим. Просто используйте required:true и убедитесь, что значение параметра = "" для вашего параметра по умолчанию и jQuery Validate позаботится об этом для вас.

Я создал example, чтобы вы могли посмотреть, я изменил выпадающий список status, чтобы использовать метод по умолчанию, и я исправил ваши другие ссылки на ваш собственный метод проверки, чтобы показать его работу (это как @El Предложил Йобо). Я также зафиксировал конечную запятую в вашем объекте permalink (что заставит все это не работать во многих версиях IE).