Modification d'html généré à la volée

Modification d'html généré à la volée - HTML/CSS - Programmation

Marsh Posté le 12-11-2008 à 10:54:21    

Bonjour,
 
Je suis en train de réaliser un formulaire d'ajout de liens. Mais j'ai un soucis avec l'html, si il a été généré avec le javascript je n'arrive pas à le modifier à nouveau part l'intermédiaire du javascript. Vous pouvez voir l'exemple ici : http://www.mangedeschips.net/temp/test.html
 
Si on ajoute un lien il est impossible de le supprimer ou de le modifier en cliquant dessus.
Pour les liens déjà présents, il est possible de les modifier une fois, mais après cela il est impossible de les rééditer ou de les supprimer.
 
Donc je voulais savoir si il y avait une solution à mon problème.
 
Voilà l'html :

Code :
  1. <input id="Links" name="Jobs" />
  2. <input id="Description" name="Description" />
  3. <input id="RSS" name="RSS" />
  5. <a id="addLinks" href="#">addLinks</a>
  7. <ul id="listLinks">
  8. <li>
  9.  <a class="deleteLinks" href="#"><img src="delete.png" /></a>
  10.  <a class="editLinks" href="#">http://www.test.com</a>
  11.  <p>
  12.   <img src="feed.png" title="http://www.test.com/feed" />
  13.   <img src="information_off.png" title="Le site de test. " />
  14.  </p>
  15. </li>
  16. </ul>


 
et le javascript :

Code :
  1. $(document).ready(function(){
  2. $("#addLinks" ).click(function(){
  3.  var newLinks = document.getElementById('Links').value;
  4.  if(newLinks!="" ){
  5.   var newRSS = document.getElementById('RSS').value;
  6.   var newDescription = document.getElementById('Description').value;
  7.   if(newRSS=="" ){
  8.    var iRSS = "feed_off.png";
  9.   } else { var iRSS = "feed.png"; }
  10.   if(newDescription=="" ){
  11.    var iDesc = "information_off.png";
  12.   } else { var iDesc = "information.png"; }
  13.   $("#listLinks" ).append('<li><a class="deleteLinks" href="#"><img src="delete.png" /></a><a class="editLinks" href="#">'+newLinks+'</a><p><a href="'+newRSS+'" target="_blank"><img src="'+iRSS+'" title="'+newRSS+'" /></a><img src="'+iDesc+'" title="'+newDescription+'" /></p></li>\n');
  14.  } else {
  15.   alert("Veuillez remplir le premier champ pour le lien." )
  16.  }
  17. });
  18. });
  19. $(document).ready(function(){
  20. $(".editLinks" ).click(function(){
  21.  ancienTexte = $(this).text();
  22.  $(this).replaceWith('<input class="inputLinks" type="text" value="' + ancienTexte + '" />');
  23.  $("input" ).keypress(function (e) {
  24.   if(e.which == 13) {
  25.   nouveauTexte = $(".inputLinks" ).val();
  26.    $(this).replaceWith('<a class="editLinks" href="#">' + nouveauTexte + '</a>');
  27.   }
  28.  });
  29. });
  30. });
  31. $(document).ready(function(){
  32. $(".deleteLinks" ).click(function(){
  33.  $(this).parent().remove();
  34. });
  35. });


 
Merci d'avance pour vos réponses.  :)


Message édité par Peusly le 12-11-2008 à 11:33:39
Reply

Marsh Posté le 12-11-2008 à 10:54:21   

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed