javascript - alternate of html tag required? -

i have been working on project, there seems issue poll:

on site, have created opinion poll, on have included 5 options, each option having 2 corresponding radio buttons yes/no. want make sure user has selected 1 radio button each of statements/questions, used attribute "required" on input, however, did not seem work:

<tr>     <td>         <label for="">close liquor shops near , on national highways. reduce drunken driving on highways.</label>     </td>     <td>         yes<input type=radio name="close" id="close" value=1 required>         no<input type=radio name="close" id="close" value=2>     </td> </tr>

i have tried following instead of "required" attribute:

<tr>     <td>         <label for="">close liquor shops near , on national highways. reduce drunken driving on highways.</label>     </td>     <td>         yes<input type=radio name="close" id="close" value=1 required="required">         no<input type=radio name="close" id="close" value=2>     </td> </tr>

i tried attribute data-required required, didn't work.

for each of examples tried worked, each worked in 1 browser (e.g. chrome), didn't work in ie. few others tried did not work @ all.

at simplest, i'd suggest (and please bear in mind don't agree you're doing (forcing user make choice) or available choices (horribly) leading, , coercive, questions):

$('form').submit(function(e){         // in version we're using once, caching may not necessary     var self = $(this),         // finds radio input elements:         radios = self.find('input[type="radio"]'),         /* iterates on radio elements, creates array of names,            discards duplicates: */         groups = $.unique(radios.map(function(){             return this.name;         }).get()),         // gets checked radio elements:         checked = radios.filter(function(){ return this.checked; });      /* if checked length not equal number of 'groups',        there left unchecked: */     return checked.length === groups.length ? true : false; }); 

js fiddle demo.

notes:

html: has been corrected following:

<form action="#" method="post">     <table>         <tbody>             <tr>                 <td>                     <label for="">close liquor shops near , on national highways. reduce drunken driving on highways.</label>                 </td>                 <td>yes                     <input type="radio" name="close" value="1" />no                     <input type="radio" name="close" value="2" />                 </td>             </tr>             <tr>                 <td>                     <label for="">electronic watch on national highways check speed limit of vehicles. speed governors should installed in vehicles.</label>                 </td>                 <td>yes                     <input type="radio" name="ewatch" value="1" />no                     <input type="radio" name="ewatch" value="2" />                 </td>             </tr>             <tr>                 <td>                     <label for="">data base of road accidents on national highways , effective data collection mechanism.</label>                 </td>                 <td>yes                     <input type="radio" name="data_collection" value="1" />no                     <input type="radio" name="data_collection" value="2" />                 </td>             </tr>             <tr>                 <td>                     <label for="">stricter punishment traffic offenders on highways , license cancellation of repeat offenders. there should online review of license status.</label>                 </td>                 <td>yes                     <input type="radio" name="punishment" value="1" />no                     <input type="radio" name="punishment" value="2" />                 </td>             </tr>             <tr>                 <td>                     <label for="locality">people should follow lane system. lead reduction in number of accidents</label>                 </td>                 <td>yes                     <input type="radio" name="follow" id="follow" />no                     <input type="radio" name="follow" id="follow" />                 </td>             </tr>         </tbody>     </table>     <button type="submit">submit</button> </form> 

duplicate ids have been removed, checked attributes have been removed (since want enforce user-interaction, don't offer pre-checked options, makes no sense); left empty for attributes alone, label inputs should yes/no text (since that's what'll clicked interact options available. require unique id each input (as html specification), or nest input within label element, giving following:

<label>yes <input type="radio" name="close" value="1" /></label> <label>no <input type="radio" name="close" value="2" /></label> 

references:

• attribute-equals ([attribute=value]) selector.
• filter().
• find().
• get().
• jquery.unique().