I have a form with radiobuttons, checkboxes and textfields. For example, Group 1 includes radiobuttons.
<ul class="radios">
<li><input id="const-style" class="radio-form" type="radio" name="material" value="w1" /><span>test</span></li>
<li><input id="const-style" class="radio-form" type="radio" name="material" value="w2" /><span>test2</span></li>
<li><input id="const-style" class="radio-form" type="radio" name="material" value="w3" /><span>test3</span></li>
...
</ul>
Group 2 includes checkboxes.
<ul class="checks">
<li><input id="const-style1" class="checkbox-form" type="checkbox" name="style[]" value="ch1" />ch1</li>
<li><input id="const-style2" class="checkbox-form" type="checkbox" name="style[]" value="ch2" />ch2</li>
<li><input id="const-style3" class="checkbox-form" type="checkbox" name="style[]" value="ch3" />ch3</li>
...
</ul>
Group 3 with textfields (Name, Surname, Email).
<ul class="form-info">
<li><input id="name" class="text inline" type="Name" name="name" size="25" placeholder="Name" maxlength="30" autocomplete="off"/></li>
<li><input id="SurName" class="text inline" type="SurName" name="surname" size="25" placeholder="Surname" maxlength="30" autocomplete="off"/></li>
<li><input id="email" class="text inline" type="Email" name="email" size="25" placeholder="Email" maxlength="30" autocomplete="off"/></li>
</ul>
When a user click at least 1 checkbox or radiobutton or feel a textfield, a script adds +1 to variable (1 point maximum on a hole group) and after that it should show a tooltip with this counter (anywhere). If he/she uncheck his/her choice (and a group with checkboxes or textfields or radiobuttons become unchecked) it should subtruct 1 point.
How to do that with JS or Jquery?
Aucun commentaire:
Enregistrer un commentaire