11550 sujets

JavaScript, DOM et API Web HTML5

J'ai écrit ce code qui permet d'ajouter et de supprimer des <div> (utilisé dans un formlaire)
Pour l'ajout il n'y pas de problème mais j'ai l'erreur ci-dessous lorsque supprime la <div>

Error: HIERARCHY_REQUEST_ERR: DOM Exception 3

Ca fonctionne mais une partie du code n'est pas "actif". En fait plus d'erreur une fois que tous les articles sont supprimer mais tout le code doit fonctionner pour ne pas avoir de problème.

Le lien "supprimer article" ne disparaît pas lorsqu'il n'y a plus q'un article.


$(document).ready(function () {
	        //on cache le lien "supprimer article"
		$(".supprimerArticle").hide();
		
                //fonction pour cloner le dernier élément ayant pour classe "article" contenu dans le formulaire 
		$(".ajoutArticle").click(function (){
			var article = $(this).parents("form").children(".article:last");
				article.after(article.clone(true).hide());
		$(this).parents("form").children(".article:last").fadeIn("slow");
		
                //on affiche le lien "supprimer article" précédemment caché s'il y a plus d'un "article"
		if ( $(".article").length > 1 ) { $(".supprimerArticle").fadeIn("slow"); }
		});
		
                //fonction pour supprimer le dernier élément ayant pour classe "article" contenu dans le formulaire 
		$(".supprimerArticle").click(function (){
			var article = $(".article:last");
				article.after(article.remove("slow"));
				
		//on cache le lien "supprimer article" précédemment caché s'il y a moins d'un "article" C'est la que ça coince
		if ( $(".article").length < 1 ) { $(".supprimerArticle").fadeOut("slow"); }
		
                       // Ne marche pas du tout
			var n = $(".article").length;
      			$("span").text("Il y a " + n + " article(s).");
		});
		
  	});


Le code HTML incriminé Smiley biggrin :

<div class="article">
			<label>Titre article</label>
			<input type="text" name="titre_article" class="champs" />
			
			<label>Texte article</label>
			<textarea name="texte_article" class="texte"></textarea>
			
			<label>Texte à gauche</label>
			<input type="radio" value="gauche" name="alignement"/>
			<label>Texte à droite</label>
			<input type="radio" value="droite" name="alignement"/>
			
			<input type="file" name="image" value="" />
		</div>
		
		
		<a href="javascript:;" title="Ajouter un article" class="ajoutArticle" rel="article">Ajouter un article</a>
		<a href="javascript:;" title="Supprimer un article" class="supprimerArticle" rel="article">Supprimer un article</a>


J'espère que vous pourrez m'aider, je suis vraiment mais alors vraiment pas un expert.
Merci de m'avoir lu Smiley smile
Modifié par bwaais (15 Jul 2009 - 13:14)
Bonjour,

Je pense que cela provient de

 article.after(article.remove("slow"));

si tu veux supprimer le dernier article. je te conseille de mettre cela plutôt.

article.remove();