Mvc Validierung und Loader

Question

In Form Post-Methode in MVC anzeigen, wenn Validierung ausgelöst wird dann sollte Lader nicht kommen und Dispaly nur Validierungen sonst keine Validierungen Feuer dann Lader sollte kommen und speichern Sie die Daten.

Was ich versucht habe:

platziert Loader auf Formular in javascript einreichen und auf die Schaltfläche disbale.

$("#frmContact").submit(function (e) { 
     $(".loading").css("display", "inline"); 
    }); 

1) Lader: Problem ist, dass, wenn die Validierung feuert, dann auch loader alongwith Validierungen kommen und die Seite und Eingangsdaten nachladen müssen dann.

2) Schaltfläche "Submit" deaktivieren: Wenn ich die Schaltfläche "Submit" bei Klick deaktiviere und wenn die Validierung ausgelöst wird, bleibt die Schaltfläche deaktiviert, nachdem sie aktiviert wurde. Wenn die Validierung vorhanden ist, aktivieren Sie die Schaltfläche und wenn die Validierung nicht aktiviert ist, deaktivieren Sie die Schaltfläche.

all den doppelten Eintrag zu vermeiden, wenn die Taste dann ermöglicht, wenn auf Benutzer klickt

vorlegen, wie ich es tun kann?

Danke, KK

Answer 1

prüfen Validierung auf Formular oder Submit-Button Ereignis mit Hilfe von JavaScript.

if($('#MyForms').valid()) 
 
{ 
 
    // Do something (Valid) 
 
} 
 
else 
 
{ 
 
    // Do something (invalid) 
 
}

Answer 2

Sie können es auf diese Weise

HTML tun:

<div id="ajax-loader" style="display:none;"> 
    <img src="<?php echo $loaderSrc; ?>" style="height: 200px;width: 200px;"> 
</div> 

<input type="submit" id = "btnSubmit" value="Submit" name="yt0" onclick="return validateForm();"> 

In Skript: (hier die Felder ändern können ... ich eines bin zeige meine Beispiel)

var error_flag = true; 
var error_required = true; 

$('#btnSubmit').click(function(e){ 
    e.preventDefault(); 
    if(error_flag && error_required){ 
      $("#ajax-loader").css("display", "block"); 
      $('form#login-form').submit(); 
    } 
}); 

function validateForm(){ 

var user_pass = document.getElementById('LoginForm[user_pass]').value; 
var dob = document.getElementById('LoginForm_dob').value; 
var re_pass = document.getElementById('re_pass').value; 
var user_name = document.getElementById('LoginForm[user_name]').value; 
var email = document.getElementById('LoginForm[email]').value; 
var tnc = document.getElementById('checkbox1').checked; 
// alert(tnc); 
var filter=/^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i; 

if(user_name == ''){ 
    validate('LoginForm[user_name]','Nick name is required.'); 
}else if(email == ''){ 
    removeerror('LoginForm[user_name]'); 
    validate('LoginForm[email]','Email is required.'); 
}else if(!filter.test(email)){ 
    removeerror('LoginForm[email]'); 
    validate('LoginForm[email]','Please enter valid email.'); 
}else if(user_pass == ''){ 
    // removeerror('LoginForm[email]'); 
    validate('LoginForm[user_pass]','Password is required.'); 
}else if(user_pass.length < 6){ 
    removeerror('LoginForm[user_pass]'); 
    validate('LoginForm[user_pass]','Min length should be 6.'); 
}else if(re_pass == ''){ 
    removeerror('LoginForm[user_pass]'); 
    validate('re_pass','Repeat password is required.'); 
}else if(user_pass != re_pass){ 
    removeerror('re_pass'); 
    validate('re_pass','Password does not match.'); 
}else if(dob == ''){ 
    removeerror('re_pass'); 
    validate('LoginForm_dob','Dob is required.'); 
}else{ 
    if(tnc == false){ 
    document.getElementById('tnc_check').innerHTML = 'Please agree Terms and Condition' ; 
    document.getElementById("tnc_check").style.color = "red"; 
    error_required = false; 
    }else{ 
    error_required = true; 
    document.getElementById("tnc_check").style.display = "none"; 
    removeerror('LoginForm_dob'); 
    } 
} 
} 
function validate(id,msg){ 
    document.getElementById(id).style.border='4px solid red'; 
    document.getElementById(id).value = ""; 
    document.getElementById(id).placeholder = msg; 
    error_required = false; 
} 
function removeerror(id){ 
    document.getElementById(id).style.border='none'; 
    error_required = true; 
} 

Answer 3

Die Antwort ist einfach. wird in der Form nach dem Ereignis gültig gemacht. Alles ist was du willst.

$("#frm").submit(function (e) { 
 
     if ($(this).valid()) { 
 
      $(".loading").css("display", "inline"); 
 
     } 
 
    });