2009-11-30 49 views
7

Actualmente estoy usando el complemento de validación para validar un formulario (utilizando controles ASP.Net). He despojado a cabo las reglas de la configuración estándar, es decir dentro del método form.validate:JQuery validar dinámicamente agregar reglas

$("form").validate({ 

    rules: { 
     ctl00$ContentPlaceHolder1$dgQuestions$ctl14$iRadList_Col0: "required" 
    } 

}); 

ahora tengo estos en diversas funciones que se suman la ruless dependiendo de lo que se hace clic en el botón. Esto funciona bien para cuadros de texto, pero para RadiobuttonList cuando el complemento intenta agregar la regla hay un error que dice que el elemento no está definido.

function addRuleSet() { 
    $("#ctl00$ContentPlaceHolder1$dgQuestions$ctl14$iRadList_Col0").rules("add", { required: true }); 

}

Creo que el problema es que estoy usando el atributo de nombre (ASP pone $ en) para definir al grupo que los botones de radio pertenecen al lugar de un ID (, pero en la estática Todos los elementos están definidos con el atributo de nombre. De todos modos, no estoy seguro de cómo mover una regla para un grupo de botones de radio asociados, cualquier consejo sería apreciado.

PD Realmente necesito llamar a RadioButtonList que los botones de radio individuales.

Respuesta

9

También puede aplicar una regla configurando clases en el elemento. Por ejemplo, si asigna la clase "requerida" a una entrada, entonces la regla requerida se aplica a ese elemento. Para hacer esto, usaría la propiedad CssClass en el control. Es posible que necesite experimentar con controles compuestos, como RadioButtonList, para asegurarse de que la clase se está aplicando a los elementos de entrada generados, no al contenedor. Si tiene problemas con esto, una forma de hacerlo sería agregar la clase usando jQuery después de que la página se cargue en función de un selector.

<asp:RadioButtonList id="RadList" runat="server" CssClass="required"> 
    ... 
</asp:RadioButtonList> 

o

<script type="text/javascript"> 
    $(function() { 
      $(':radio').addClass('required'); 
      $('form').validate(); 
    }); 
</script> 

Para un complejo, regla basada en la clase puede agregar nuevas reglas utilizando addClassRules.

<script type="text/javascript"> 
    $(function() { 
     $.validator.addClassRules({ 
      range0to10: { 
        range: [0, 10] 
      }, 
      name: { 
        minlength: 2, 
        required: true 
      } 
     }); 
     $('form').validate(); 
    }); 
</script> 

<form ... > 
<input type="text" name="rating" id="rating" class="range0to10" /> 
<input type="text" name="firstName" id="firstName" class="name" /> 
<input type="text" name="lastName" id="lastName" class="name" /> 
</form> 
+0

Sí, gracias por eso, agradezco que esto funcione para reglas simples como requerir pero ¿podría definir algo como rango: [0,10]? – Monkeeman69

+0

En realidad, no es difícil si usa el método addClassRules. Voy a actualizar. – tvanfosson

+0

Sería bueno ver gracias. – Monkeeman69

1

Después de días de esta volviendo loca, haciendo la pregunta me hizo pensar en cómo sacar el elemento de retorno correctamente, y me encontré con este método en incluir staright distancia que permite que lo haga:

$("input:radio[name='ctl00$ContentPlaceHolder1$dgQuestions$ctl14$iRadList_Col0']").rules("add", { required: true }); 
+5

nota: puede acortar ese selector a $ ("input: radio [name $ = 'iRadList']"). Rules ~ the $ after name selecciona cualquier elemento que termine con iRadList <- más fácil de leer –

+0

Eso es un consejo inteligente Poli. –

Cuestiones relacionadas