jQuery validate Element ohne Formular

Arbeiten an der Validierung mit ASP.Net Webforms.jQuery validate Element ohne Formular

ASP.Net fügt standardmäßig ein Formular auf der Stammebene hinzu. Was bedeutet, dass wir alle Steuerelemente nur im Formular hinzufügen müssen.

Allerdings muss ich einen kleinen Teil der Seite definieren, die Validierung benötigt, habe ich jQuery Validierung Plugin.

HTML

<html> 
<body> 
    <form method="post" action="AssetDetails.aspx" id="Form1" enctype="multipart/form- 
    data"> 
    //Other page content goes here. which doesnt require validation 

    <form class="form-horizontal" id="validation-form" method="get"> 
         <div class="row-fluid"> 
          <div class="widget-header header-color-blue2"> 
           <h5> 
            Step 1</h5> 
          </div> 
      <input type="email" name="ctl00$MainContent$AssetTabs$DefineCriticality$email" id="email" class="span6" /> 
         </div> 

    </form> 
    </form> 
    </body></html>

Javascript

$(document).ready(function(){ 
    alert($('#validation-form').length); // gives 0, because this form nested under 
              another form generated by ASP.Net 

    $('#validation-form').validate({ 
      errorElement: 'span', 
      errorClass: 'help-inline', 
      focusInvalid: false, 
      rules: { 
       email: { 
        required: true, 
        email: true 
       }}, 
      messages: { 
       email: { 
        required: "Please provide a valid email.", 
        email: "Please provide a valid email." 
       }}, 
    errorPlacement: function (error, element) { 
     error.insertAfter(element); 
    } 
    }); 
    });

Aber das Problem ist, ich bin immer Fehler this[0] in jquery Validierungsdatei nicht definiert. Ich habe festgestellt, dass #validation-form nicht im DOM gefunden wird, da dieses Formular in diesem dummen ASP.Net-generierten root (parent) -Element ist.

Wie gehen wir damit um?

Gibt es eine Möglichkeit, das Element mit jQuery validate Plugin ohne ein Formular zu validieren?

Edit: Got some Abhilfe Lösung:

Schließlich habe ich diese Arbeit mit Eltern Form und das Hinzufügen von Regeln basierend auf den Feldnamen. Das ASP.Net-Webformular hat erneut Probleme verursacht, indem das Steuerelementnamenfeld anders erstellt wurde.

Hier ist die Arbeit um Code.

var validationParams = { 
     errorElement: 'span', 
     errorClass: 'help-inline', 
     focusInvalid: false, 
     rules: {}, 
     messages: {}, 

     invalidHandler: function (event, validator) { 
      $('.alert-error', $('.login-form')).show(); 
     }, 

     highlight: function (e) { 
      $(e).closest('.control-group').removeClass('info').addClass('error'); 
     }, 

     success: function (e) { 
      $(e).closest('.control-group').removeClass('error').addClass('info'); 
      $(e).remove(); 
     }, 

     errorPlacement: function (error, element) { 
      error.insertAfter(element); 
     }, 

     submitHandler: function (form) { 
     }, 
     invalidHandler: function (form) { 
     } 
    }; 

    var emailFieldName = $('#email').attr('name'); 

    validationParams['rules'][emailFieldName] = { required: true }; 
    validationParams['messages'][emailFieldName] = { required: "Email is required" }; 

    $('#Form1').validate(validationParams);

Gibt es eine andere bessere Möglichkeit, es zu tun?

Quelle

2013-08-06 Murali Murugesan

möglich Duplikat [jQuery Validierung ohne „Form "tag] (http: // Stapelüberlauf.com/questions/6282680/jquery-validation-ohne-form-tag) –

Ich erzähle Ihnen keine anderen Optionen, aber was Sie gefragt haben, wenn Sie validate plugin ohne Formular verwenden können.

Es ist unbedingt erforderlich, dass Sie <form></form> Tags für das jQuery Validate-Plugin haben, um ordnungsgemäß oder überhaupt zu funktionieren.

Wenn Sie ajax verwenden, müssen Sie [setzen Sie Ihre ajax innerhalb der submitHandler des jQuery Validate-Plugin

Sie können die action entfernen oder blockieren und noch jQuery Validate verwenden.

Sie können Ihre ajax und ein return false im submitHandler und keine regelmäßige Vorlage auftreten setzen:

$(document).ready(function() { 

    $('#myform').validate({ // initialize plugin 
     // your rules & options, 
     submitHandler: function(form) { 
      // your ajax would go here 
      return false; // blocks regular submit since you have ajax 
     } 
    }); 

});

Siehe Demo: http://jsfiddle.net/NEPsc/5/

Quelle

2013-08-06 07:47:41

Das Problem ist aufgrund der Elternform, meine '# validation-form' ist nicht verfügbar. Ich habe meine Frage aktualisiert. Ich brauche eine Validierung mit jquery Validierung Plugin, arbeitet mit einem Formular :) –

Sie können einfach $ (Eltern-Form) .validate(), und verwenden Sie Prüfungen (Validierung) für die Elemente, die Sie benötigen, warum verwenden Sie ein Formular in Form? –

verwende ich nicht. So gestaltet ASP.Net dumme Webformulare. Wir haben keine Kontrolle über das Entfernen dieses Elternformular –

jQuery validate Element ohne Formular

Antwort

Verwandte Themen