Javascript Live Validation: onchange triggered only the first time

Question

I have a form with a select box and a input field: when option value of select is "8" I would have that input field must be less than 250

SELECT BOX

<select id="select_5" size="1" title="Effettua una scelta!"  name="tipo_nolavorazioni" onChange="updatethis(this.form);">
<option value="8"> A </option>
<option value="1"> B</option>
<option value="2"> C</option>
<option value="3"> D </option>
</select>

INPUT BOX

<input class="required validate-number" maxlength="150" size="5" id="text_2" name="base" type="text" onChange="updatethis(this.form);" value="" />
<p id="errore_base"></p>

On JS file I have add this:

function updatethis(form) {
if (tipo1==8) {
window.addEvent('domready', function(){
  var valid = new LiveValidation('text_2', {insertAfterWhatNode : "errore_base"});
  valid.add(Validate.Numericality, { maximum: 250, tooHighMessage: "Max 250cm" });
  });
}
}

This works but if I change option value (for example B=1).. error message remains and I cant process my form. Where I'm wrong?

Answer 1

Does this work? I've never personally used the LiveValidation library but after looking at the API I guess this will work. You need to store a reference to the validator somewhere outside the function (in a higher scope) and use the add and remove methods to control the UI.

See for more info: http://livevalidation.com/documentation#LiveValidationRemove

var validator = new LiveValidation('text_2', {insertAfterWhatNode : "errore_base"})

function updatethis(form) {
  var action = 'remove';

  if (tipo1 == 8) {
    action = 'add';
  }

  window.addEvent('domready', function(){
    validator.add(Validate.Numericality, { maximum: 250, tooHighMessage: "Max 250cm" });
  });
}