2015-11-12 4 views
1

У меня есть WebForm, который после проверки проверяет запись в базу данных с помощью SQL-запроса. Я могу заставить валидацию работать независимо. Я могу заставить данные писать независимо (когда я добавляю событие onclick к кнопке). Но я не могу заставить их работать последовательно друг с другом. Как вызвать функцию javascript после успешной проверки JQuery? Код можно увидеть ниже.Запустить JS-функцию после JQuery-Validation

activitylog.html

<form action="javascript:;" id="form_rptActivityLog"> 
    <input id="txtShiftDate" type="text" class="form-control date-picker" name="txtShiftDate"/> 
    <input type="submit" id="btnSave" value="Save" title="Save" class="btn blue-hoki" /> 
</form> 

<script type="text/javascript"> 
function saveData() { // ... SQL DATA WRITE HERE ... // } 
</script> 

validation.js

var ValidationScripting = function() { 


// ACTIVITY LOG ICON VALIDATION 
var rptActivityLogValidation = function() { 
    // for more info visit the official plugin documentation: http://docs.jquery.com/Plugins/Validation 

    var form = $('#form_rptActivityLog'); 
    var error = $('.alert-danger', form); 
    var success = $('.alert-success', form); 

    form.validate({ 
     errorElement: 'span', //default input error message container 
     errorClass: 'help-block help-block-error', // default input error message class 
     focusInvalid: false, // do not focus the last invalid input 
     ignore: "", // validate all fields including form hidden input 
     rules: { 
      txtShiftDate: { 
       required: true 
      } 
     }, 

     invalidHandler: function (event, validator) { //display error alert on form submit    
      success.hide(); 
      error.show(); 
      Metronic.scrollTo(error, -200); 
     }, 

     errorPlacement: function (error, element) { // render error placement for each input type 
      var icon = $(element).parent('.input-icon').children('i'); 
      icon.removeClass('fa-check').addClass("fa-warning"); 
      icon.attr("data-original-title", error.text()).tooltip({'container': 'body'}); 
     }, 

     highlight: function (element) { // hightlight error inputs 
      $(element) 
       .closest('.form-group').removeClass("has-success").addClass('has-error'); // set error class to the control group 
     }, 

     unhighlight: function (element) { // revert the change done by hightlight 

     }, 

     success: function (label, element) { 
      var icon = $(element).parent('.input-icon').children('i'); 
      //$(element).closest('.form-group').removeClass('has-error').addClass('has-success'); // set success class to the control group 
      //icon.removeClass("fa-warning").addClass("fa-check"); 
      $(element).closest('.form-group').removeClass('has-error')   // remove check mark for success 
      icon.removeClass("fa-warning") 
     }, 

     submitHandler: function (form) { 
      success.show(); 
      error.hide(); 
      form.submit(); // submit the form 
     } 
    }); 


} 


return { 

    //main function to initiate the module 
    init: function() { 

     console.log('Activity Log Validation'); 
     rptActivityLogValidation(); 
    } 

}; 

}(); 

Ошибки я получаю: JavaScript Ошибка: Объект не поддерживает свойство или метод «представить '

Любая помощь с благодарностью.

+0

Можете ли вы показать нам, как вы называете метод submitHandler? – Prefix

+0

Просто вопрос, вы вызываете 'form.validate', тогда почему вы вызываете' form [0] .submit'. Разве это не должно быть 'form.submit' – Rajesh

+0

@Rajesh' form.submit() 'запускает любое связанное событие, используя jQuery, а не' form [0] .submit() ' –

ответ

0

Любая функция, которую вы хотите запустить после проверки, но до того форма представить бы внутри вашего submitHandler; это не отличается от вашего success.show() и т. д.

submitHandler: function (form) { 
    // form is valid and ready to submit 
    // do stuff here 
    success.show(); 
    error.hide(); 
    form.submit(); // submit the form 
} 
+0

Как я могу вызвать 'function saveData()' из этого блока кода? – rak11

+0

@ rak11, вы пробовали 'saveData()'? То же самое, что вы бы назвали его с любым кодом JavaScript. – Sparky

+0

Вы правы. Спасибо, что указали на очевидное для меня. – rak11

0
var rptActivityLogValidation = function() { 
    var form = $('#form_rptActivityLog')[0]; 

    form.validate({ 
     // .... VALIDATE FIELDS HERE ..... // 

     submitHandler: function (form) { 
      form.submit(); // submit the form 
     } 
    }); 
} 

Вы могли бы попробовать это - сделать form Var специфическую форму [0]. Поскольку вы передаете это в submitHandler, вам не нужно [0] внутри него. Это позволит убедиться, что вы на самом деле подписываете форму.

Хотя нам нужно посмотреть, как вы называете submitHandler. Вы действительно передаете форму?

+0

Он не вызывает 'submitHandler'. 'SubmitHandler' является опцией метода' .validate() 'плагина. Это обратный вызов, который запускается, когда форма действительна, и нажата кнопка отправки. – Sparky

Смежные вопросы