title: validator - unobtrusive form reset not working
body: <p>I'm using adminlte v 3.0.1. bootstrap</p>
  
  <p>doing some validator and unobtrusive</p>
  
  <p>stuck at resetting form, in example</p>
  
  <blockquote>
    <p>edit => show modal form => trigger validation => cancel => new => validation result still there</p>
  </blockquote>
  
  <p>I'm already tried </p>
  
  <ol>
  <li><p><code>$('#form').trigger('reset')</code>
  ~ not doing anything (not triggering anything)</p></li>
  <li><p><code>$('#form')[0].trigger('reset')</code> ~ trigger is not a function</p></li>
  <li><p><code>document.getElementById('form').reset()</code> ~ not doing anything (not triggering anything)</p></li>
  </ol>
  
  <p>any help is appreciated</p>
  
  <p>regards</p>
  
  <p>update: </p>
  
  <p>HTML code</p>
  
  <pre><code>@{
      ViewBag.Title = "Master Currency";
  }
  
  &lt;div class="card-header"&gt;
      &lt;h3&gt;Currency&lt;/h3&gt;
  &lt;/div&gt;
  &lt;div class="card-body"&gt;
      &lt;div class="row src-form" style="margin-bottom: 15px;"&gt;
          &lt;div class="col-12"&gt;
              @{
                  Html.RenderPartial("_Search");
              }
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="row" style="margin-bottom: 15px;"&gt;
          &lt;div class="col-1"&gt;
              &lt;a href="javascript:void(0)" title="Search" id="btn-toggle-search"&gt;
                  &lt;i class="fa fa-search-plus custom-fa"&gt;&lt;/i&gt;
              &lt;/a&gt;
          &lt;/div&gt;
          &lt;div class="col-1"&gt;
              &lt;a href="javascript:void(0)" title="Refresh" id="btn-refresh"&gt;
                  &lt;i class="fa fa-sync custom-fa"&gt;&lt;/i&gt;
              &lt;/a&gt;
          &lt;/div&gt;
          &lt;div class="col-1 offset-9"&gt;
              &lt;a href="javascript:void(0)" id="btn-new" class="btn btn-primary"&gt;
                  &lt;span&gt;New&lt;/span&gt;
              &lt;/a&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="row"&gt;
          &lt;div class="col-12"&gt;
              &lt;table id="grid"&gt;
                  &lt;thead&gt;
                      &lt;tr&gt;
                          &lt;th&gt;Currency Code&lt;/th&gt;
                          &lt;th&gt;Currency Name&lt;/th&gt;
                          &lt;th&gt;Created By&lt;/th&gt;
                          &lt;th&gt;Created Time&lt;/th&gt;
                          &lt;th&gt;Last Modified By&lt;/th&gt;
                          &lt;th&gt;Last Modified Time&lt;/th&gt;
                          &lt;th&gt;&lt;/th&gt;
                          &lt;th&gt;&lt;/th&gt;
                      &lt;/tr&gt;
                  &lt;/thead&gt;
              &lt;/table&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div class="modal fade"  id="modal-edit"&gt;
      &lt;div class="curr-edit"&gt;
          @using (Ajax.BeginForm("Save", "Currency", new { area = "Master" },
          new AjaxOptions()
          {
              InsertionMode = InsertionMode.Replace,
              UpdateTargetId = "curr-edit",
              HttpMethod = "POST",
              OnSuccess = "successSave",
              OnFailure = "failSave"
          }, new { @id = "edit-form" }))
          {
              @Html.AntiForgeryToken()
  
              @Html.Partial("_Edit")
          }
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div class="modal fade" id="modal-delete"&gt;
      &lt;div class="curr-del"&gt;
          @using (Ajax.BeginForm("Delete", "Currency", new { area = "Master" },
              new AjaxOptions()
              {
                  InsertionMode = InsertionMode.Replace,
                  UpdateTargetId = "curr-del",
                  HttpMethod = "POST",
                  OnSuccess = "successDelete",
                  OnFailure = "failDelete"
              }, new { @id = "delete-form" }))
              {
                  @Html.AntiForgeryToken()
                  @Html.Partial("_Delete")
              }
              })) 
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The edit form</p>
  
  <pre><code>@model  CurrencyModel
  
  
      @Html.HiddenFor(model =&gt; model.CurrencyID, new { @id = "curcy-id" })
  
      &lt;div class="modal-dialog modal-lg"&gt;
          &lt;div class="modal-content"&gt;
              &lt;div class="modal-header"&gt;
                  &lt;h4 class="modal-title" id="title-modal"&gt;&lt;/h4&gt;
                  &lt;button type="button" class="close" data-dismiss="modal" aria-label="Close"&gt;
                      &lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;
                  &lt;/button&gt;
              &lt;/div&gt;       
              &lt;div class="modal-body"&gt;
                  &lt;div class="row" style="margin-bottom: 15px;"&gt;
                      &lt;div class="col-4"&gt;
                          @Html.LabelFor(model =&gt; model.CurrencyCode)
                      &lt;/div&gt;
                      &lt;div class="col-8"&gt;
                          @Html.TextBoxFor(model =&gt; model.CurrencyCode, new { @class = "form-control", @id = "curcy-code" })
                          @Html.ValidationMessageFor(model =&gt; model.CurrencyCode, "",  new { @class = "validation-message" })
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="row" style="margin-bottom: 15px;"&gt;
                      &lt;div class="col-4"&gt;
                          @Html.LabelFor(model =&gt; model.CurrencyName)
                      &lt;/div&gt;
                      &lt;div class="col-8"&gt;
                          @Html.TextBoxFor(model =&gt; model.CurrencyName, new { @class = "form-control", @id = "curcy-name" })
                          @Html.ValidationMessageFor(model =&gt; model.CurrencyName, "", new { @class = "validation-message" })
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="modal-footer"&gt;
                      &lt;button type="submit" class="btn btn-primary"&gt;Save changes&lt;/button&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>JS Code</p>
  
  <pre><code>$('#grid').DataTable({
      'scrollX': true,
      'scrollY': true,
      'serverSide': true,
      'fixedColumns': true,
      'sScrolling': true,
      'ScrollY': '400px',
      'ScrollX': '800px',
      'bScrollCollapse': true,
      'bSortCellsTop': true,
      "sDom": 'Rfrtlip',
      "dom": '&lt;"top"i&gt;rt&lt;"bottom"lp&gt;&lt;"clear"&gt;',
      'ajax': {
          'url': '@Url.Action("GetCurrency", "Currency", new { area = "Master" })',
          'type': 'POST',
          'dataType': 'JSON'
      },
      'columns': [
          { 'data': 'CurrencyCode', 'searchable': true, 'autoWidth': true },
          { 'data': 'CurrencyName', 'autoWidth': true },
          { 'data': 'CreatedBy', 'sortable': false, 'autoWidth': true },
          {
              'data': 'CreatedTime', 'autoWidth': true, 'sortable': false, 'render': function (jsonDate) {
                  return convertJsonDate(jsonDate);
              }
          },
          { 'data': 'LastModifiedBy', 'autoWidth': true, 'sortable': false, 'sortable': false },
          {
              'data': 'LastModifiedTime', 'autoWidth': true, 'sortable': false, 'render': function (jsonDate) {
                  return convertJsonDate(jsonDate);
              }
          },
          {
              'data': 'CurrencyID', 'width': '50px', 'sortable': false , 'className': 'text-center', 'render': function (data) {
                  return "&lt;a href='javascript:void(0)' class='btn-edit' title='Edit' data-id=" + data + "&gt;Edit&lt;/a&gt;"
              }
          },
          {
              'data': 'CurrencyID', 'width': '50px', 'sortable': false, 'className': 'text-center', 'render': function (data) {
                  return "&lt;a href='javascript:void(0)' class='btn-delete' title='Delete' data-id=" + data + "&gt;Delete&lt;/a&gt;"
              }
          }
      ]
  });
  $(document).ready(function () {
      $('#btn-src').click(function () {
          var srcparam = $('#src-type').children('option:selected').data('id');
          if (srcparam === '' || srcparam === undefined || srcparam === null) {
              alert('Pilih kategori pencarian terlebih dahulu!');
              return;
          }
          debugger;
          var srcvalue = $('#src-value').val();
          if (srcvalue === '' || srcvalue === undefined || srcvalue === null){
              alert('Parameter pencarian harus diisi!');
              return;
          }
  
  
          oTable = $('#grid').DataTable();
  
          switch (srcparam) {
              case 'CODE':
                  oTable.columns(0).search(srcvalue).draw();
                  break;
              case 'NAME':
                  oTable.columns(1).search(srcvalue).draw();
                  break;
          }
      });
  
      $('#grid').on('click', 'a.btn-edit', function (e) {
          var param = parseInt($(this).data('id'));
          $.post('@Url.Action("PrepareFormData", "Currency", new { area = "Master" })', { id: param })
              .done(function (obj) {
                  switch (obj.Response) {
                      case 'SUCCESS':
                          var validator = $('#edit-form').validate();
                          validator.resetForm();
                          $('#edit-form').trigger('reset');
                          $('#curcy-id').val(obj.Currency.CurrencyID).trigger('change');
                          $('#curcy-code').val(obj.Currency.CurrencyCode).trigger('change');
                          $('#curcy-name').val(obj.Currency.CurrencyName).trigger('change');
  
                          $('#title-modal').text('Edit Currency');
                          $('#modal-edit').modal('show');                           
                          break;
                      case 'WARNING':
                          toastr.warning(obj.ResponseMsg);
                          break;
                      case 'ERROR':
                          toastr.error(obj.ResponseMsg);
                          break;
                  }
              });
      });
      $('#grid').on('click', 'a.btn-delete', function (e) {
          var param = parseInt($(this).data('id'));
          $.post('@Url.Action("PrepareFormData", "Currency", new { area = "Master" })', { id: param })
              .done(function (obj){
                  switch (obj.Reponse) {
                      case 'SUCCESS':
                          $('#delete-form').trigger('reset');
                          $('#curcy-id').val(obj.Currency.CurrencyID).trigger('change');
  
                          $('#modal-delete').modal('show');
                          break;
                      case 'WARNING':
                          toastr.warning(obj.ResponseMsg);
                          break;
                      case 'ERROR':
                          toastr.error(obj.ResponseMsg);
                          break;
                  }
              });
      });
  
      $('#btn-new').click(function () {
          $.post('@Url.Action("PrepareFormData", "Currency", new { area = "Master" })', { id: 0 })
              .done(function (obj) {
                  switch (obj.Response) {
                      case 'SUCCESS':                            
                          $('#edit-form').trigger('reset');
                          $('#curcy-id').val(obj.Currency.CurrencyID).trigger('change');
  
                          $('#title-modal').text('New Currency');
                          $('#modal-edit').modal('show');
                          break;
                      case 'WARNING':
                          toastr.warning(obj.ResponseMsg);
                          break;
                      case 'ERROR':
                          toastr.error(obj.ResponseMsg);
                          break;
                  }
              })
      });
  });
  </code></pre>