boucle par id de

-2

J'ai ce code jQuery élément pour détecter si toutes les valeurs d'une colonne sont vides, et, si elles sont, enlever la colonne:boucle par id de

var valid=0; 
jQuery("#column1 input[type=text]").each(function(){ 
    if(jQuery(this).val() != "") valid+=1; 
}); 

if(valid ==0){ 
    jQuery("td#column1").hide(); 
} 

var valid1=0; 
jQuery("#column2 input[type=text]").each(function(){ 
    if(jQuery(this).val() != "") valid1+=1; 
}); 

if(valid1 ==0){ 
    jQuery("td#column2").hide(); 
}

Est-il possible de transformer ce pour une boucle donc, qu'il passe par chaque colonne (#column1, #column2, etc..) et supprime cette colonne si nécessaire, s je n'ai pas à dupliquer le code ci-dessus pour chaque colonne?

Merci d'avance pour toute aide.

EDIT

Merci pour toutes les suggestions. Le problème avec certaines des réponses est que la boucle supprimerait les cellules individuelles. J'ai besoin de la boucle pour fonctionner si tous les champs sous l'en-tête sont vides s'ils sont suppriment la colonne entière, y compris l'en-tête.

<table> 
<tr id="prod_specs_header"> 
<td><span class="tooltips-link" title="">Product Code</span></td> 
<td id="column1"><span class="tooltips-link isimg" title=""><img style="opacity: 1; visibility: visible;" src="templates/autcastorsandwheels/images/icon_wheel_diam.gif" data-src="templates/autcastorsandwheels/images/icon_wheel_diam.gif" border="0"></span></td> 
<td id="column2"><span class="tooltips-link isimg" title=""><img style="opacity: 1; visibility: visible;" src="templates/autcastorsandwheels/images/icon_wheel_width.gif" data-src="templates/autcastorsandwheels/images/icon_wheel_width.gif" border="0"></span></td> 
<td id="column3"><span class="tooltips-link isimg" title=""><img style="opacity: 1; visibility: visible;" src="templates/autcastorsandwheels/images/icon_overall_height.gif" data-src="templates/autcastorsandwheels/images/icon_overall_height.gif" border="0"></span></td> 
<td id="column4"><span class="tooltips-link isimg" title=""><img style="opacity: 1; visibility: visible;" src="templates/autcastorsandwheels/images/icon_plate_dimen.gif" data-src="templates/autcastorsandwheels/images/icon_plate_dimen.gif" border="0"></span></td> 
<td id="column5"><span class="tooltips-link isimg" title=""><img style="opacity: 1; visibility: visible;" src="templates/autcastorsandwheels/images/icon_hole_spacing.gif" data-src="templates/autcastorsandwheels/images/icon_hole_spacing.gif" border="0"></span></td> 
<td id="column6"><span class="tooltips-link isimg" title=""><img style="opacity: 1; visibility: visible;" src="templates/autcastorsandwheels/images/icon_hole_width.gif" data-src="templates/autcastorsandwheels/images/icon_hole_width.gif" border="0"></span></td> 
<td id="column7"><span class="tooltips-link isimg" title=""><img style="opacity: 1; visibility: visible;" src="templates/autcastorsandwheels/images/icon_offset.gif" data-src="templates/autcastorsandwheels/images/icon_offset.gif" border="0"></span></td> 
<td id="column8"><span class="tooltips-link isimg" title=""><img style="opacity: 1; visibility: visible;" src="templates/autcastorsandwheels/images/icon_carrycap.gif" data-src="templates/autcastorsandwheels/images/icon_carrycap.gif" border="0"></span></td> 
<td id="column9"><span class="tooltips-link isimg" title=""><img style="opacity: 1; visibility: visible;" src="templates/autcastorsandwheels/images/icon_unit_weight.gif" data-src="templates/autcastorsandwheels/images/icon_unit_weight.gif" border="0"></span></td> 
</tr> 

<tr> 
<td>37TAS5700</td> 
<td class="field" id="column1"><input value="50" type="text"></td> 
<td class="field" id="column2"><input value="" type="text"></td> 
<td class="field" id="column3"><input value="71" type="text"></td> 
<td class="field" id="column4"><input value="" type="text"></td> 
<td class="field" id="column5"><input value="46/38x46/38" type="text"></td> 
<td class="field" id="column6"><input value="" type="text"></td> 
<td class="field" id="column7"><input value="" type="text"></td> 
<td class="field" id="column8"><input value="40" type="text"></td> 
<td class="field" id="column9"><input value="0.14" type="text"></td> 
</tr> 

<tr> 
<td>37TAS5701</td> 
<td class="field" id="column1"><input value="75" type="text"></td> 
<td class="field" id="column2"><input value="" type="text"></td> 
<td class="field" id="column3"><input value="100" type="text"></td> 
<td class="field" id="column4"><input value="" type="text"></td> 
<td class="field" id="column5"><input value="46/38x46/38" type="text"></td> 
<td class="field" id="column6"><input value="" type="text"></td> 
<td class="field" id="column7"><input value="" type="text"></td> 
<td class="field" id="column8"><input value="50" type="text"></td> 
<td class="field" id="column9"><input value="0.34" type="text"></td> 
</tr> 

<tr><td>37TAS5702</td> 
<td class="field" id="column1"><input value="100" type="text"></td> 
<td class="field" id="column2"><input value="" type="text"></td> 
<td class="field" id="column3"><input value="122" type="text"></td> 
<td class="field" id="column4"><input value="" type="text"></td> 
<td class="field" id="column5"><input value="46/38x46/38" type="text"></td> 
<td class="field" id="column6"><input value="" type="text"></td> 
<td class="field" id="column7"><input value="" type="text"></td> 
<td class="field" id="column8"><input value="65" type="text"></td> 
<td class="field" id="column9"><input value="0.55" type="text"></td> 
</tr> 
</table>

Source

2013-07-16 Mark Booth

À quoi ressemble le code HTML comme? – j08691

Comme les ID doivent être uniques sur la page de contexte, votre code me semble étrange, pouvez-vous poster du code HTML pertinent? –

Vous devez attribuer une classe à chaque colonne, et non un identifiant, puis suivre la suggestion de @ virus721. – Sablefoste

Vous pouvez d'abord boucler la colonne et les éléments internes

jQuery("[id^=column]").each(function(){ 
    valid = 0; 
    jQuery(this).find("input[type=text]").each(function(){ 
     if(jQuery(this).val() != "") valid+=1; 
    }); 

    if(valid ==0){ 
    jQuery(this).hide(); 
    } 
});

Source

2013-07-16 13:47:04 Adil

Raison du vote vers le bas? – Adil

var valid = new array(); 
$('[id^="column"]').each(function() { 
    if ($(this).find('input:text').val().length !== 0) { 
     valid[$(this).index()] = 1; 
    } else { 
     valid[$(this).index()] = 0; 
     $(this).hide(); 
    } 
});

Vous aurez besoin de créer un tableau de valid et vous pouvez parcourir les colonnes, la fixation d'un indicateur valide pour chacun en cachant les vides.

Source

2013-07-16 13:48:42 DevlshOne

Donner à tous les TDs la classe column, puis:

$("td.column").each(function() { 
    var valid = false; 
    $(this).find("input[type=text]").each(function() { 
     if(jQuery(this).val() != "") { 
      valid = true; 
      return false; // end the .each immediately 
     } 
    }); 
    if (!valid) { 
     $(this).hide(); 
    } 
});

Source

2013-07-16 13:51:44 Barmar

Merci pour votre aide - j'ai essayé cette suggestion qui a fonctionné presque indépendamment de cela ne détecte pas si tous les champs dans la colonne sont vides et enlèvent alors la pleine colonne comprenant son en-tête - il semble enlever tous td sans contenu? tous les en-têtes disparaissent? Si l'un des champs de la colonne a une valeur, je veux que la colonne complète reste. –

Je l'ai écrit avant de poster votre code HTML. Le HTML ne correspond pas à ce que je l'imaginais être basé sur votre code. Comme les identifiants doivent être uniques, je pensais que chaque # columnN serait un simple TD avec un tas d'INPUT. – Barmar

Depuis sa courte réponse jour:

$('[id^="column"]:not(:has(input:text:not([value=""])))').hide();

Source

2013-07-16 14:06:25

boucle par id de

Répondre

Questions connexes