jQuery formulaire liste de contrôle

Question

J'ai un formulaire et souhaite afficher une liste de contrôle qui sera juste une liste d'éléments pour montrer à l'utilisateur quelles sections ont été complétées. Je veux être en mesure d'appliquer une classe css à chaque élément de la liste qui affichera une croix ou une croix selon que ces champs ont été complétés comme cela;

<ul class="summary"> 
    <li class="complete">Resort</li> 
    <li class="complete">General Information</li> 
    <li class="complete">Accommodation</li> 
    <li class="incomplete">Resort Features/Services</li> 
    <li class="incomplete">Resort Extras &amp; Amenities</li> 
</ul> 

Dans certains cas, il peut y avoir plusieurs champs de formulaire pour chaque section afin de déterminer s'il faut afficher une coche ou une croix.

Je me demandais si quelqu'un avait déjà fait quelque chose comme ça avant ou s'il connaissait des exemples?

Merci.

Answer 1

Vous utiliseriez jQuery pour valider/déterminer l'exhaustivité de chaque section.

Ensuite, vous permuteriez la classe de l'élément de liste approprié. Je donnerais chacun une classe ID il:

<ul class="summary"> 
<li class="summary-resort">Resort</li> 
<li class="summary-general">General Information</li> 
<li class="summary-accomodation">Accommodation</li> 
<li class="summary-features">Resort Features/Services</li> 
<li class="summary-extras">Resort Extras &amp; Amenities</li> 
</ul> 

Ensuite, une simple ligne de jQuery:

...if summary-resort section is complete... 
$(".summary-resort").addClass("complete") 

Answer 2

Je pense changer la classe d'un élément est facile avec Jquery. essayer (avec un identifiant pour chaque élément):

$("#li_1").removeClass("complete"); 
$("#li_1").addClass("incomplete"); 

Mais, comment vous savez si une section il est complet? Avec des événements dans un formulaire? de l'information dans une base de données?