javascript - Adding class to Label Works except for first row -


i have simple table series of yes/no radio button questions , have added javascript should apply red colour label of adjacent text area input. it's working not first row in table - other rows works.

here's cutdown version of html first 3 rows in table:

<table width="71%" class="record">      <tr>       <td width="63%" valign="top" class="field_name_left"><p><strong>section 1</strong><br>         (a) section 1a.</p>         </td>       <td width="11%" valign="top" class="field_data">                     <input type="radio" name="scale1a" value="yes" validate = "required:true " class = "radioclick">yes                                              <input type="radio" name="scale1a" value="no" validate = "required:true " class = "radioclick">no           <label = "scale1a" class = "error">please ensure completed</label> </td>       <td width="26%" valign="top" class="field_data">       <span class="field_name_left style1" id = "scale1awherelabel"><strong>where:</strong></span>        <textarea id = "scale1awhere" class="where" name="scale1awhere" cols="25" rows="2" validate="required:'input[name=scale1a][value=yes]:checked'"> </textarea>                 <label = "scale1awhere" class = "error">please ensure completed</label>        </td>       </tr>     <tr>       <td valign="top" class="field_name_left">            (b) section 1b.</td> <td valign="top" class="field_data">              <input type="radio" name="scale1b" value="yes" validate = "required:true " class = "radioclick" />         yes                            <input type="radio" name="scale1b" value="no" validate = "required:true " class = "radioclick" />         no                          <label = "scale1b" class = "error">please ensure completed</label>          </td>       <td valign="top" class="field_data"><span class="field_name_left style1" id = "scale1bwherelabel"><strong>where:</strong></span>           <textarea id = "scale1bwhere" class="where" name="scale1bwhere" cols="25" rows="2" validate="required:'input[name=scale1b][value=yes]:checked'"></textarea> <label = "scale1bwhere" class = "error">please ensure completed</label>           </td>   </tr>       <tr>       <td width="63%" valign="top" class="field_name_left"><strong>section 2.</td>       <td valign="top" class="field_data">                 <input type="radio" name="scale2" value="yes"validate = "required:true" class="radioclick">yes                      <input type="radio" name="scale2" value="no"validate = "required:true" class="radioclick">no            <label = "scale2" class = "error">please ensure completed</label>     </td>       <td valign="top" class="field_data">       <span class="field_name_left style1" id = "scale2wherelabel"><strong>where:</strong></span>       <textarea id = "scale2where" class="where" name="scale2where" cols="25" rows="2" validate="required:'input[name=scale2][value=yes]:checked'"></textarea> <label = "scale2where" class = "error">please ensure completed</label></td>       </tr>        <tr class="submit_btn">                       <td colspan="3">                             <input type="submit" name="-edit" value="finish">                             <input type="reset" name="reset" value="reset">            </td>         </tr>       </table> 

and here's script:

$(".radioclick").click(function(){     thestr = $("#"+this.name+"where").val().length;     if($(this).val()=="yes" && thestr == 0){         $("#"+this.name+"wherelabel").addclass("emphasise");     } else {         $("#"+this.name+"wherelabel").removeclass("emphasise");     } $(".where").keyup(function(){     str = this.value.length;     if(str == 0){         $("#"+this.name + "label").addclass("emphasise");     }else{         $("#"+this.name + "label").removeclass("emphasise");     } }); });  $.metadata.settype("attr", "validate"); $("#editrecord").validate(); 

you can see in action on @ jsfiddle

for reason can't fathom label question 1a never changed red when yes button clicked, others?

issue space in text area. need trim it. or remove it.

thestr = $.trim($("#"+this.name+"where").val()).length; 

extra space in text area:-

  <textarea id = "scale1awhere" class="where"    name="scale1awhere" cols="25" rows="2"    validate="required:'input[name=scale1a][value=yes]:checked'"> </textarea>    

fixed code


Comments

Popular posts from this blog

c# - DetailsView in ASP.Net - How to add another column on the side/add a control in each row? -

javascript - firefox memory leak -

Trying to import CSV file to a SQL Server database using asp.net and c# - can't find what I'm missing -