Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Oct 2012
    Posts
    1
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Question Date conflict between new event & existed events startDate,endDate

    i have a add button and three text boxesfrom where the user will Add eventName,event startDateand ,endDate. now while adding the java script must check wheather the new events date are falling inside of any other events duration time.
    as example if first event is from 05/01/22012 to 10/01/2012 , then the second event must start and also comolete BEFORE 05/01/22012 or else
    second event must start and comolete AFTER 10/01/22012 and for each new event entry javaScript should check with all previous entry.
    and at last i have to show the varified events in a dynamic table

    i am a new learner of java script, so please if you can add some code with reply. thanks for reading my problem and also heartfull thanks in advance for your valuable reply.

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,895
    Thanks
    202
    Thanked 2,530 Times in 2,508 Posts
    There is quite a lot of code involved in this. Here is an outline to point you in the right direction. Essentially you need to convert your dates into Javascript Date Objects so that a comparison can be made.

    But you must still ensure that the input is valid - only valid dates (not 31st February), in the right format dd/mm/yyyy, and that the end date is after the start date.
    I leave that to you. I have invented data for the first three items.

    This outline should move you forward:-

    Code:
    Event Title <input type = "text" id = "evtit">
    Start Date dd/mm/yyyy <input type = "text" id = "stdate">
    End Date dd/mm/yyyy <input type = "text" id = "endate">
    <br><br>
    <input type = "button" value = "Add Event" onclick = "add()">
    
    <script type = "text/javascript">
    
    var eventName = ["Event1", "Event2", "Event3"];
    var startDate = ["05/01/2012", "12/02/2012", "08/03/2012"];
    var endDate = ["12/01/2012", "20/02/2012", "19/03/2012"];
    
    function add() {
    var t = document.getElementById("evtit").value;
    var sd = document.getElementById("stdate").value;
    var ed = document.getElementById("endate").value;
    // CHECK THE VALIDITY OF START AND END DATES
    var ssplit = sd.split("/");
    var esplit = ed.split("/");
    var sobj = new Date(ssplit[2],ssplit[1]-1,ssplit[0]);  // months in Javascript are 0-11
    var eobj = new Date(esplit[2],esplit[1]-1,esplit[0]);
    
    for (var i =0; i<eventName.length; i++) {
    var s = startDate[i].split("/");
    var ss = new Date(s[2],s[1]-1,s[0]);  // months in Javascript are 0-11
    var e = endDate[i].split("/");
    var es = new Date(e[2],e[1]-1,e[0]);  // months in Javascript are 0-11
    if ((eobj < ss) || (sobj > es)) {
    alert ("OK - no overlap with Event " + i);
    }
    else {
    var OK = false;
    alert ("The event dates overlap with Event " + i");
    return false;
    }
    }
    
    // if the dates do not overlap add the details to the 3 arrays
    
    }
    
    </script>

    If you closed your eyes you wouldn't be able to tell which was the Premier League team - Commentator Radio 5 Live
    Last edited by Philip M; 10-09-2012 at 12:15 PM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • Users who have thanked Philip M for this post:

    anirbanguha (10-10-2012)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •