asp.net - javascript page_clientvalidate
Page_ClientValidate() con múltiples ValidationGroups: ¿cómo mostrar múltiples resúmenes simultáneamente? (6)
ASP.NET 2.0. Digamos que tengo dos grupos de validación valGrpOne y valGrpTwo; y dos resúmenes de validación valSummOne y valSummTwo; La razón para dividir las secciones es puramente estética. Un botón de enviar que activa la validación en ambos grupos.
Ahora quiero activar la validación del lado del cliente, Y quiero AMBOS resúmenes de validación para mostrar al mismo tiempo;
Así que configuro una función de Javascript que se invoca btnSubmit, y dentro de esta función llamo a Page_ClientValidate("valGrpOne") y Page_ClientValidate("valGrpTwo") en sucesión; El problema es que solo se muestra un resumen a la vez (¡Pero realmente quiero que ambos se muestren!)
¿Alguna idea sobre cómo hacer que ambos resúmenes de validación se muestren simultáneamente, desde el código del lado del cliente?
Muy similar a la siguiente pregunta, que responde por el lado del servidor. ¿Disparando múltiples grupos de validación con un solo botón?
Aquí es para mantenerlo simple, un ejemplo muy simple:
Tenga el siguiente método de JavaScript en su encabezado de página:
<script type="text/javascript" language="javascript">
function ShowModalDialog4Validations() {
var x = $find("modalPopupExtenderValidations");
Page_ClientValidate("vgValidations");
if (!Page_IsValid)
x.show();
}
modalPopupExtenderValidations es la ID del menú emergente modal. vgValidations es la ID del Grupo de Validación.
Ahora, en el método prerender de la página, agregue el atributo onclick a su botón en el que desea que ocurra la validación.
protected void Page_PreRender(object sender, EventArgs e)
{
btnMyButton.Attributes.Add("onclick", "ShowModalDialog4Validations();");
}
Espero que sea fácil de entender.
Adiós.
Aquí hay otro método simple y genérico para validar contra múltiples grupos.
// Page_ClientValidate only shows errors from the last validation group.
// This method allows showing for multiple groups
function Page_ClientValidateMultiple(groups) {
var invalidIdxs = [];
var result = true;
// run validation from each group and remember failures
for (var g = 0; g < groups.length; g++) {
result = Page_ClientValidate(groups[g]) && result;
for (var v = 0; v < Page_Validators.length; v++)
if (!Page_Validators[v].isvalid)
invalidIdxs.push(v);
}
// re-show any failures
for (var i = 0; i < invalidIdxs.length; i++) {
ValidatorValidate(Page_Validators[invalidIdxs[i]]);
}
// return false if any of the groups failed
return result;
};
Ok, entonces la respuesta no fue simple. Parece que el comportamiento predeterminado de la validación del lado del cliente es mostrar solo el último grupo / resumen que acaba de ser validado. Pero un poco de tweeking Javascript me dio una respuesta aceptable.
Siéntase libre de ofrecer mejoras.
<script type="text/javascript" language="javascript">
/* Manual client-side validation of Validator Groups */
function fnJSOnFormSubmit() {
var isGrpOneValid = Page_ClientValidate("valGrpOne");
var isGrpTwoValid = Page_ClientValidate("valGrpTwo");
var i;
for (i = 0; i < Page_Validators.length; i++) {
ValidatorValidate(Page_Validators[i]); //this forces validation in all groups
}
//display all summaries.
for (i = 0; i < Page_ValidationSummaries.length; i++) {
summary = Page_ValidationSummaries[i];
//does this summary need to be displayed?
if (fnJSDisplaySummary(summary.validationGroup)) {
summary.style.display = ""; //"none"; "inline";
}
}
if (isGrpOneValid && isGrpTwoValid)
return true; //postback only when BOTH validations pass.
else
return false;
}
/* determines if a Validation Summary for a given group needs to display */
function fnJSDisplaySummary(valGrp) {
var rtnVal = false;
for (i = 0; i < Page_Validators.length; i++) {
if (Page_Validators[i].validationGroup == valGrp) {
if (!Page_Validators[i].isvalid) { //at least one is not valid.
rtnVal = true;
break; //exit for-loop, we are done.
}
}
}
return rtnVal;
}
</script>
esta es una extensión del código útil de joedotnot. Probablemente sea excesivo para la mayoría de los usuarios de asp.net, pero esto ayudó con un proyecto en el que se tuvieron que aplicar diferentes combinaciones de grupos de validación en el envío, dependiendo de qué botones se habían seleccionado.
var validationManager = function () {
// Manual client-side validation of Validator Groups
// an empty string('''') is default - to validate controls without a validation group
var valGroups = [''''],
returnObj = { //define methods
set: function (/*string argument list*/) {
valGroups = Array.prototype.slice.call(arguments);
return returnObj;
},
add: function (/*string argument list*/) {
var i;
for (i = 0; i < arguments.length; i++) {
if (valGroups.indexOf(arguments[i]) === -1) {
valGroups.push(arguments[i]);
}
}
return returnObj;
},
remove: function (/*string argument list*/) {
var i = 0, n = 0;
for (i = 0; i < arguments.length; i++) {
var n = valGroups.indexOf(arguments[i]);
if (n > -1) valGroups.splice(n, 1);
}
return returnObj;
},
validate: function () {
var i = 0,
summariesToDisplay = [];
for (; i < valGroups.length; i++) {
if (!Page_ClientValidate(valGroups[i])) { //this will display the contents of the validator
summariesToDisplay.push(valGroups[i]);
}
}
if (!summariesToDisplay.length) { return true; }
for (i = 0; i < Page_ValidationSummaries.length; i++) { //make relevant summaries visible
if (summariesToDisplay.indexOf(Page_ValidationSummaries[i].validationGroup || '''') > -1) {
Page_ValidationSummaries[i].style.display = "inline"; //"none"; "inline";
}
}
return false;
}
};
if (arguments.length > 0) {
returnObj.set.apply(null, arguments);
}
return returnObj;
}
luego en los distintos controladores de eventos:
//set up a global object
var validateOnSubmit = validationManager('''',''BMIvalGrp'');
//within a radio click handler
validateOnSubmit.add(''weightValGrp'',''ageValGrp'')
.remove(''BMIvalGrp'');
//added to submit button handlers
validateOnSubmit.validate();
No completamente probado:
/* Manual client-side validation of Validator Groups - Remix */
function PageValidate() {
var PageIsValid = true;
for (var validator in Page_Validators) {
ValidatorValidate(validator);
PageIsValid = PageIsValid && validator.isvalid;
}
if (PageIsValid) {
return true; //postback only when ALL validations pass.
}
else {
return false;
}
}
/* This also does something similar */
function PageValidate() {
return Page_ClientValidate();
}
<b>Lets Say here is u r link button</b>
<asp:LinkButton ID="lnkbtnSubmit" runat="server" OnClientClick="return fnJSOnFormSubmit();" meta:resourcekey="lnkbtnSubmitResource1">Submit</asp:LinkButton>
<b> And u r Script is</b>
<script type="text/javascript">
function confirmAction() {
var retVal = confirm("Are you sure want to continue ?");
if (retVal == true) {
return true;
}
else {
return false;
}
}
function fnJSOnFormSubmit() {
var isGrpOneValid = Page_ClientValidate("updateuser");
var isGrpTwoValid = Page_ClientValidate("BaseKey");
var i;
for (i = 0; i < Page_Validators.length; i++) {
ValidatorValidate(Page_Validators[i]); //this forces validation in all groups
}
isGrpOneValid = Page_ClientValidate("updateuser");
isGrpTwoValid = Page_ClientValidate("BaseKey");
i =0;
for (i = 0; i < Page_Validators.length; i++) {
ValidatorValidate(Page_Validators[i]); //this forces validation in all groups
}
if (isGrpOneValid && isGrpTwoValid)
return true; //postback only when BOTH validations pass.
else
return false;
}
/* determines if a Validation Summary for a given group needs to display */
function fnJSDisplaySummary(valGrp) {
var rtnVal = false;
for (i = 0; i < Page_Validators.length; i++) {
if (Page_Validators[i].validationGroup == valGrp) {
if (!Page_Validators[i].isvalid) { //at least one is not valid.
rtnVal = true;
break; //exit for-loop, we are done.
}
}
}
return rtnVal;
}
</script>