Prototype ou JQuery change la valeur d'un champ caché?

Question

J'ai des problèmes avec le prototype qui change la valeur d'un champ caché.

Fonction:

function remove_fields (link) { 
    $(link).next('input[type=hidden]').value = ''; 
    $(link).up(".open_hours").hide(); 
} 

Si je commente la $(link).next('input[type=hidden]').value = ''; la fonction fonctionne cacher. Essayer de définir la valeur me donne une erreur:

$(link).next("input[type=hidden]") is undefined 

Voici mon code HTML autour de l'appel de fonction:

<div class="monday"> 

     <div class ="open_hours"> 
      <li><label for="location_monday">Monday</label> 
      Open: 06:29PM - 
      Close: 04:21PM 
      <a href="#" onclick="remove_fields(this); return false;">remove</a></li> 

      <li class="hidden optional" id="location_monday_open_input"><input id="location_monday_open" name="location[monday_open]" type="hidden" value="18:29:00" /></li> 
      <li class="hidden optional" id="location_monday_close_input"><input class="close" id="location_monday_close" name="location[monday_close]" type="hidden" value="16:21:00" /></li> 
    </div>  
</div> 

Je ne sais pas ce que je fais mal ici? Merci les gars!

Answer 1

jQuery réponse basée

Puisque vous avez fourni l'entrée avec un identifiant, vous pouvez utiliser le sélecteur d'identifiant

$("#location_monday_close").val(''); 

Si vous voulez obtenir l'élément caché non basé sur l'id vous pouvez alors utiliser quelque chose comme

$(link).closest('div.open_hours').find('input[type=hidden]').val(''); 

Aussi, si vous voulez cacher la div avec OPEN_HOURS nom de classe, vous pouvez utiliser

$("div.open_hours").hide(); 

Je re écrit le code pour vous.

$(function(){ 
    $("#anch1").click(function(){ 
     remove_fields ($(this));  
    }); 

    function remove_fields (link) 
    { 
     var parentDiv = link.closest('div.open_hours'); 
     parentDiv.find('input[type=hidden]').val(''); 
     parentDiv.hide(); 
    } 

}); 

<div class="monday"> 
    <div class ="open_hours"> 
     <li><label for="location_monday">Monday</label> 
      Open: 06:29PM - 
      Close: 04:21PM 
      <a id="anch1" href="#" return false;">remove</a> 
     </li> 
     <li class="hidden optional" id="location_monday_open_input"> 
      <input id="location_monday_open" name="location[monday_open]" type="hidden" value="18:29:00" /> 
     </li> 
     <li class="hidden optional" id="location_monday_close_input"> 
      <input class="close" id="location_monday_close" name="location[monday_close]" type="hidden" value="16:21:00" /> 
     </li> 
    </div>  
</div> 

Modifier

next trouve la fratrie immédiatement suivante du sélecteur (qui est la balise d'ancrage). Dans votre code HTML, il n'y a pas de frère suivant pour la balise d'ancrage.

Answer 2

Vous avez marqué à la fois jquery et prototype, en jquery vous pouvez essayer comme ceci:

$(link).next('input[type=hidden]').val = ''; 

Answer 3

Pour prototype faire ceci:

function remove_fields(link) { 
    var e = link.next().identify(); 
    $(e).setValue(""); 
    $(e).up(".open_hours").hide(); 
} 

Vous devez identifier/retourner l'identifiant éléments avant de pouvoir définir la valeur.