Click here to Skip to main content
16,015,414 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
i have done a search button filter of from to date and made the fields as required but 8it's not working even though i checked console it shows the error as


jquery.min.js:2 jQuery.Deferred exception: $(...).validate is not a function TypeError: $(...).validate is not a function
    at HTMLDocument.<anonymous> (http://localhost:51932/:293:30)
    at e (http://localhost:51932/Scripts/jquery.min.js:2:30038)
    at t (http://localhost:51932/Scripts/jquery.min.js:2:30340) undefined
S.Deferred.exceptionHook @ jquery.min.js:2
t @ jquery.min.js:2
setTimeout (async)
(anonymous) @ jquery.min.js:2
c @ jquery.min.js:2
fireWith @ jquery.min.js:2
fire @ jquery.min.js:2
c @ jquery.min.js:2
fireWith @ jquery.min.js:2
ready @ jquery.min.js:2
B @ jquery.min.js:2
jquery.min.js:2 Uncaught TypeError: $(...).validate is not a function
    at HTMLDocument.<anonymous> ((index):293:30)
    at e (jquery.min.js:2:30038)
    at t (jquery.min.js:2:30340)



i have mentioned the jquery .min.js in bundle config even tough i installed other version 3.6.0 i mentioned only min in bundle.config

What I have tried:

$("#searchForm").validate({
               errorClass: "error-class",
               validClass: "valid-class",
               errorElement: 'div',
               errorPlacement: function (error, element) {
                   if (element.parent('.input-group').length) {
                       error.insertAfter(element.parent());
                   } else {
                       error.insertAfter(element);
                   }
               },
               onError: function () {
                   $('.input-group.error-class').find('.help-block.form-error').each(function () {
                       $(this).closest('.form-group').addClass('error-class').append($(this));
                   });
               },
               rules: {
                   txtFromDate: { required: true },
                   txtToDate: { required: true }

               },
               messages: {
                   txtFromDate: "From Date Is Required",
                   txtToDate: "From Date Is Required",

               },
               submitHandler: function (form) {
                   $('#loading').show();
                   debugger;
                   $.ajax({
                       url: '/Report/GetProvCommReport',
                       type: 'GET',
                       data: {
                           fromDate: moment($('#txtFromDate').val(), 'DD/MM/YYYY').toISOString(),
                           fldToDate: moment($('#txtToDate').val(), 'DD/MM/YYYY').add(1, 'days').toISOString(),
                           //fldType: $('#ddl_Type').val(), /// should be added after binding the datas into the ddl
                           //status: $('#ddl_Status').val()
                       },
                       error: function () {
                           //alert('fld_Type')
                           $('#loading').hide();
                           var notify = $.notify('Error An error has occurred. Contact administrator.!', {
                               allow_dismiss: true,
                               type: 'danger'
                           });
                           return false;
                       },
                       success: function (data, status) {
                           alert(data)
                           if (status == 'success') {
                               table.clear().draw();
                               //table.rows.add(eval('(' + data + ')')); // Add new data
                               table.rows.add(data);
                               // Redraw the DataTable
                               table.columns.apply().draw();
                               $('#loading').hide();
                           } else {
                               $('#loading').hide();
                               var notify = $.notify('Warning Error for reading online count details. Please contact administrator.!', {
                                   allow_dismiss: true,
                                   type: 'warning'
                               });
                               return false;
                           }

                           return false;
                       }


need help!
Posted
Updated 29-Aug-22 18:53pm

Quote:
"$(...).validate is not a function"

This error occurs when the jQuery validation plugin is not loaded or the jQuery-related scripts are loaded in an incorrect order.

Please check and make sure that the validation plugin is being loaded after the jQuery library.

You can see it in their documentation example (do View Source): jQuery validation plug-in - main demo[^]

A working example:
HTML
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
  </head>
  <body>
    <form id="commentForm" method="get" action="">
      <fieldset>
        <p>
          <label for="cname">Name (required, at least 2 characters)</label>
          <input id="cname" name="name" minlength="2" type="text" required />
        </p>
        <p>
          <label for="cemail">E-Mail (required)</label>
          <input id="cemail" type="email" name="email" required />
        </p>
        <p>
          <input class="submit" type="submit" value="Submit" />
        </p>
      </fieldset>
    </form>

    <!-- ✅ FIRST - load jquery ✅ -->
    <script
      src="https://code.jquery.com/jquery-3.6.0.min.js"
      integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
      crossorigin="anonymous">
    </script>

    <!-- ✅ SECOND - load jquery validate ✅ -->
    <script
      src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.3/jquery.validate.min.js"
      integrity="sha512-37T7leoNS06R80c8Ulq7cdCDU5MNQBwlYoy1TX/WUsLFC2eYNqtKlV0QjH7r8JpG/S0GUMZwebnVFLPd6SU5yg=="
      crossorigin="anonymous"
      referrerpolicy="no-referrer">
    </script>

    <!-- ✅ THIRD - load additional methods ✅ -->
    <script
      src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.3/additional-methods.min.js"
      integrity="sha512-XZEy8UQ9rngkxQVugAdOuBRDmJ5N4vCuNXCh8KlniZgDKTvf7zl75QBtaVG1lEhMFe2a2DuA22nZYY+qsI2/xA=="
      crossorigin="anonymous"
      referrerpolicy="no-referrer"
    ></script>

    <!-- ✅ FOURTH - load your JS script ✅ -->
    <script src="index.js"></script>
  </body>
</html>
 
Share this answer
 
Comments
Manojkumar-dll 30-Aug-22 1:32am    
Sorted it!!!
Now danger text is not working for datepicker any suggestion?
TIA
I'm a Dummy

Just added the bundles in _Layout.cshtml an it works
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



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