1

I have three different fields of Day, Month and Year, each for Start Date and End Date. I am not using Jquery Date picker as these are separate fields because only month and year are required. I want to restrict the End Date fields not to be after the Start Date fields. Please suggest me how can I do that. Any suggestion will be appreciated

This is the code I am using.

Thanks in advance.

    <div>
        <label>
            <span>Start Day</span>
            <input id="InsuranceStartDay" class="autofill" type="number" data-name="insuranceStartDay"
                   name="InsuranceStartDay" max="31" min="1" size="2">
        </label>
        <label>
            <span>Start Month</span>
            <input id="InsuranceStartMonth" class="autofill" type="number" data-name="insuranceStartMonth"
                   name="InsuranceStartMonth" min="1" max="12" size="2" required>
        </label>
        <label>
            <span>Start Year</span>
            <input id="InsuranceStartYear" class="autofill" type="number" data-name="insuranceStartYear"
                   name="InsuranceStartYear" size="4" min="1900" max="3000" maxlength="4" required>
        </label>
        <label>
            <span>End Day</span>
            <input id="InsuranceEndDay" class="autofill" type="number" data-name="insuranceEndDay"
                   name="InsuranceEndDay" max="31" min="1" size="2">
        </label>
        <label>
            <span>End Month</span>
            <input id="InsuranceEndMonth" class="autofill" type="number" data-name="insuranceEndMonth"
                   name="InsuranceEndMonth" min="1" max="12" size="2" required>
        </label>
        <label>
            <span>End Year</span>
            <input id="InsuranceEndYear" class="autofill" type="number" data-name="insuranceEndYear" name="InsuranceEndYear" size="4" min="1900" max="3000" maxlength="4" required>
        </label>
    </div>
Abood
  • 572
  • 1
  • 5
  • 13
stunner
  • 11
  • 2
  • 1
    Any relevant JavaScript code? There really isn't much to work with here. A lot of guessing what you're working with really. Posting just HTML is not very helpful to anyone who will try to help you. – Sergey Dec 22 '16 at 17:44
  • I do not have any java script files associated with this code. My requirement is that only the Month and Year of Start and End Date are required fields in the Date but the Day is optional to enter. So the jQuery date picker is not an option. So I would like to know how to make the End date fields restricted so that they are not selected prior to the Start Date fields. It is much easier using date picker but as that is not an option, I am stuck here. – stunner Dec 22 '16 at 21:07
  • 1
    Well there _must_ be something else. HTML by itself is not programming. So which language _are_ you using? – Sergey Dec 22 '16 at 21:29
  • 1
    If you're expecting HTML attribute values to reach your goal, it's not going to work. You'll _need_ to use JavaScript in order to meet your goal. I hope this helps. – Sergey Dec 22 '16 at 21:54
  • Use the `keyup` or `blur` [event](http://api.jquery.com/on/), or `submit` event if you want to check when the form is posted, construct a new date object ([`new Date( ... )`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date)), based on the user input, and [compare these dates](http://stackoverflow.com/questions/492994/compare-two-dates-with-javascript). If you get stuck, come back here and show us your code. We will gladly help you! – giorgio Dec 22 '16 at 23:18

0 Answers0