Uncaught TypeError: Невозможно вызвать метод «называют» неопределенной JQuery Validate

Question

У меня есть форма, как показано ниже

<div id="new_image" title="Add Image"> 
    <form id="new_image_form" action="/reg_new_img" method="POST" enctype="multipart/form-data"> 
     <table width="0" border="0" cellspacing="0" cellpadding="6" class="table100"> 
<span class="astrix"></span> 

      <tr> 
       <td class="td30">Description of the Image:</td> 
       <td> 
        <input name="desc" type="text" value="" /> 
       </td> 
      </tr> 
      <tr> 
       <td></td> 
       <td> 
        <input id="atag" type="hidden" name="atag" value=""> 
        </textarea> 
       </td> 
      </tr> 
      <tr> 
       <tr> 
        <td>Files/Image: 
         <p class="text5">X-ray/Site/Document/Agreement etc.</p> 
        </td> 
        <td> 
         <input name="image" type="file"> 
        </td> 
       </tr> 
     </table> 
    </form> 
</div> 

сценарий, как показано ниже.

$(document).ready(function() { 

    $("#new_image").dialog({ 
     height: $("#new_image").height() + 150, 
     width: $("#new_image").width() - 450, 
     modal: true, 
     autoOpen: false, 
     show: { 
      effect: "fade", 
      duration: 200 
     }, 
     hide: { 
      effect: "fade", 
      duration: 200 
     }, 

     buttons: { 
      "Submit": function() { 
       $("#new_image_form").submit(); 
      }, 
       "Close": function() { 
       $('#new_image').dialog("close"); 
      } 
     } 
    }); 

    $('#new_image_form').validate({ 
     rules: { 
      desc: { 
       required: true, 
       minlength: 10 
      }, 
      image: { 
       required: true, 
       accept: "image/*" 
      } 
     }, 
     messages: { 
      image: { 
       required: "only Image files accepted", 
       accept: "Please upload only image", 
      }, 
     }, 
     submitHandler: function (form) { 
      $('#new_image_form').ajaxSubmit({ 
       success: function (data) { 
        console.log(data); 
        $('#new_image').dialog("close"); 
        $(':input', '#new_image_form') 
         .not(':button, :submit, :reset, :hidden') 
         .val('') 
         .removeAttr('checked') 
         .removeAttr('selected'); 
       } 
      }); 
      parse_patients(); 
     } 
    }); 
    $('#new_image').dialog("open"); 
}); 

У меня есть этот код на JS скрипку

http://jsfiddle.net/rakeshpatil1983/ctL7q/

Я получаю сообщение об ошибке, когда я нажмите на кнопку отправить, когда я на самом деле положил файл изображения на хром браузера консоли

Uncaught TypeError : Не удается вызвать метод «вызов» неопределенного

Я не могу это исправить. Этот код, похоже, работает на другой странице.

Answer 1

В ваших правилах для #new_image_form «accept» не является стандартным по умолчанию правилом jQuery Validator. Вы должны либо использовать одно из этих правил по умолчанию: Jquery Validate - List of Classes или задать свои собственные правила: jQuery Validate Plugin - How to create a simple custom rule?

EDIT: из комментариев ниже: существует правило, называемое accept, которое является частью пакета плагина jQuery Validate. Вам просто нужно включить файл дополнительных методов, чтобы использовать его.

Answer 2

//Add New Validator Rule 
jQuery.validator.addMethod("accept", function(value, element, param) 
{ 
    return value.match(new RegExp("^" + param + "$")); 
}); 

У меня была аналогичная проблема, в которой правило «принять» было забыто в начале.

then 'Uncaught TypeError: Невозможно вызвать метод' call 'of undefined' исчез.