Required things for time slots :
        1. start time must be there
        2. end time must be there
        3. if it is 12 hours format then AM and PM radio buttons also must be there.
        4. end time must be greater than start time
please find how to do hours validation here , please find how to do minutes validation here

Here it is java script to validate time slots :

function get_radio_value(name) {
  var inputs =     document.getElementsByName(name);
  for (var i = 0; i < inputs.length; i++) {
    if (inputs[i].checked) {
       return inputs[i].value;
    }
  }
}

function validateHour(id,event) {
 var val=document.getElementById(id).value;
 var reg = /^([0][0-9]|[0-1][0-2]|[0-9])$/;
 if (reg.test(val)){  
 }
 else {
   var len=val.length;
   document.getElementById(id).value=val.substring(0,len-1);
 }
}

function validateMinutes(id,event) {
 var val=document.getElementById(id).value;
 var reg = /^([0][0-9]|[0-5][0-9]|[0-9]|[6][0])$/;
 if (reg.test(val)){  
 } else {
   var len=val.length;
   document.getElementById(id).value=val.substring(0,len-1);
 }
}

function verify(prefix) {
 var i1=document.forms[prefix][prefix+"1"].value;
 var i2=document.forms[prefix][prefix+"2"].value;
 var i3=document.forms[prefix][prefix+"3"].value;
 var i4=document.forms[prefix][prefix+"4"].value;
 var i5=get_radio_value(prefix+"5");
 var i6=get_radio_value(prefix+"6");
 if(i5 == i6) {
    if(i1 == i3) {
       if(i4 < i2) {
          alert('end time must be greater than start time');
       }
    } else if(i3<i1) {
        alert('end time must be greater than start time');
    } else {
        alert('valid');
    }
 } else if (i5 == 'pm' && i6 == 'am') {
 alert('end time must be greater than start time');
 } else {
        alert('valid');
 }
}

Here it is html to create time slots :
<div>
  <table style="border:1px solid #ccc;background-color:#ffffcc">
    <form name="input">
      <tr>
       <td> start time </td>
       <td> <input id="input1" name="input1" onkeyup="return validateHour('input1',event);" size="2" maxlength="2" value="00"/> : <input id="input2" name="input2" onkeyup="return validateMinutes('input2',event);" size="2" maxlength="2" value="00"/> </td>
       <td>am</td>
       <td><input value="am" size="2" name="input5" type="radio" checked/> </td>
       <td>pm</td>
       <td><input value="pm" size="2" name="input5" type="radio"/></td>
     </tr>
     <tr>
       <td> end time </td>
       <td> <input id="input3" name="input3" onkeyup="return validateHour('input3',event);" size="2" maxlength="2" value="00"/ checked> : <input id="input4" name="input4" onkeyup="return validateMinutes('input4',event);" size="2" maxlength="2" value="00"/> </td>
       <td>am</td>
       <td><input value="am" size="2" name="input6" type="radio" checked/> </td>
       <td>pm</td>
       <td><input value="pm" size="2" name="input6" type="radio"/></td>
     </tr>
    </form>
     <tr>
       <td>
         <button onclick="return verify('input')">ok</button>
       <td>
     </tr>
  </table>
</div>




9 comments:

  1. I am all that much satisfied with the substance you have specified. I needed to thank you for this extraordinary article.  넷마블 먹튀

    ReplyDelete
  2. I am looking for and I love to post a comment that "The content of your post is awesome" Great work บาคาร่า

    ReplyDelete
  3. I am all that much satisfied with the substance you have specified. I needed to thank you for this extraordinary article.  dg casino

    ReplyDelete
  4. It is somewhat fantastic, and yet check out the advice at this treat. 먹튀폴리스

    ReplyDelete
  5. In Game Mix channel, subscribers can view up to 8 live games on a single screen and also televises 30 minute commercial free replays of entire games. The Red Zone Channel delivers final yards of every scoring. 스포츠중계

    ReplyDelete
  6. Nice post! This is a very nice blog that I will definitively come back to more times this year! Thanks for informative post. 메이저놀이터

    ReplyDelete
  7. This is very intriguing substance! I have totally savored the experience of examining your concentrations and have arrived at the resolution that you are directly about a strong bit of them. You are phenomenal. เกมสล็อตWin Win Won

    ReplyDelete
  8. We are also noticing that traditional medical doctors are also recognizing the increased interest in holistic healing and are finally starting to incorporate these healing methods into their practice to keep up with the current trends. There are many ways to obtain a construction job interview, but some are more effective than others. idn slot online

    ReplyDelete
  9. Cheers to the article along with wonderful guidelines.. perhaps My spouse and i in addition feel that efforts can be the key element of receiving good results. 먹튀검증사이트

    ReplyDelete

Blogroll

Popular Posts