[JQUERY] Fehler: TypeError: $(...).valid is not a function - finde Fehler nicht

[Crushed]

Ich habe den oben genannten Fehler: "TypeError: $(...).valid is not a function" aber irgendwie ist das auch alles total seltsam, den Fehler suche ich jetzt schon seit mehreren Stunden aber ich finde ihn einfach nicht. Ich hatte den Fehler auch schon öfter, schon klar aber dieses mal finde ich die Ursache einfach nicht.
Ich arbeite grade an einer Bearbeitungsfunktion für einen Kommentar, damit man diesen direkt bearbeiten kann und dafür wird ein Teil mit ajax zur Seite hinzugefügt:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.min.js"></script>
<script type="text/javascript" src="js/edit-comment.js"></script>

<div class="edit-comment-area">
    <h2>Kommentar bearbeiten</h2>
    <form action="comment.php" class="changeCommentForm" method="POST">
        Name
        <input type="text" name="Name" maxlength="30" value="{$name}" class="required" autofocus><br />
		<textarea cols="107" rows="10" maxlength="400" name="Content" class="required">{$content}</textarea>
        <div id="change-area">
            <input type="submit" value="Ändern" onclick="return check('Möchten Sie diesen Kommentar wirklich bearbeiten?');" name="Update">
        </div>
    </form>
</div>

Und hier ist der Javascript Teil, allerdings hat da bisjetzt immer alles einwandfrei funktioniert aber seitdem ich das valid drin habe funktioniert das alles nicht mehr so richtig.

$(document).ready(function()
{         
    $('.changeCommentForm').validate(
    {
        rules: 
        {
            Name:
            {
                 required: true,
                 minlength: 3
            },
			Content: 
            {
                required: true,
                minlength: 60
            }
		},
		messages: 
        {
            Name: 
            {
                required: "<div id='edit-comment-name'>Bitte geben Sie einen Namen an!</div><br />",
                minlength: "<div id='edit-comment-name'>Das Feld mit dem Namen muss mindestens 3 Zeichen enthalten!</div><br />" 
            },
			Content:
            {
                required: "<div id='edit-comment-content'>Bitte geben Sie eine Nachricht in das Feld ein!</div>",
                minlength: "<div id='edit-comment-content'>Das Feld mit der Nachricht muss mindestens 60 Zeichen enthalten!</div>" 
            }
        }
	});
    
        
    $(".changeCommentForm").submit(function(event) 
    {       
        event.preventDefault(); 
        
        if($(".changeCommentForm").valid()) 
        {     
            $this = $(this);
            
            $.ajax(
            { 
                method: "POST",
                url: "comments.php?update",
                cache: false,
                data: $(this).serializeArray()           
            }).done(function(data)
            {                     
                $this.next('form').after("<p style='margin-top: 15px; margin-bottom: -8px; text-align: center; color: green;'>Der Kommentar wird bearbeitet ..</p>");                 
                $this.next('.back').remove().end().html();
                $this.find('.change-area').remove().end().html();       
    
            }).fail(function()
            {
                alert("Fehler beim Abschicken der Form");
            }); 
        }
    });
});

Wenn ich bspw. dann auf bearbeiten klicke und der obere HTML Teil kommt dann zur Bearbeitung und ich ändere was, dann scheint das beim ersten mal gar nicht zu funktionieren und das valid wird komplett ignoriert aber wenn ich es dann noch einmal bearbeite, steht da dann da auch bspw:

Das Feld mit dem Namen muss mindestens 3 Zeichen enthalten!

aber trotzdem steht dann unten in der Konsole (Firefox):

TypeError: $(...).valid is not a function

und dann funktioniert auch das Absenden gar nicht mehr, obwohl die Form wohl validiert wird? Irgenwie blicke ich da mittlerweile gar nicht mehr durch ....


Achja, hier werden dann einfach nur die Kommentare aufgelistet, vielleicht hilft das ja auch noch. Das hier ist dann zum Anzeigen der Kommentare und jedes Kommentar hat einen Bearbeiten button und wenn man dann auf bearbeiten klickt, dann wird der edit-comment-area Bereich (Die HTML Seite) unter das Kommentar eingefügt, natürlich schon grafisch.

<!DOCTYPE html>
<html>
    <head>
        <title>Kommentare</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
        <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.min.js"></script>
        <script type="text/javascript" src="js/edit-comment.js"></script>
    </head>
    <body>
        .....
    </body>
</html>

 

[kkapsner]

Hast du einen Testlink, wo wir uns das live ansehen können?

 

[Crushed]

Hmm ... habe den Fehler dann doch gefunden, oh man ...
Der Fehler hat mich ja auch nur ein paar Stunden meines Lebens gekostet aber es lag an dem

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

als ich den Teil aus dem oberen HTML Dokument entfernt habe, war der Fehler verschwunden und jetzt funktioniert auch endlich (fast) alles wie gewünscht. Der zweite <script> import war auch nicht nötig, anscheinend reicht das dann in der Hauptdatei aber ich brauche bei beiden Dateien anscheinend die edit-comment.js Datei aber irgendwie verstehe ich nicht, warum ich die beiden Skripte dann bei beiden Dokumenten brauche und bei dem HTML Dokument mit der Bearbeitungsebene nicht.

Ich war ehrlich gesagt echt schon am überlegen, ob ich dann den Zugriff auf meinen Server einstellen soll aber naja, das ist ja jetzt nicht mehr nötig. Die Konfiguration hätte dann aber auch noch ein wenig Zeit verschlungen.

Danke aber trotzdem soweit schon einmal.