如何从SQL Server数据库创建倒计时到日期和时间



这是我第一次在JavaScript中使用倒计时,因此我对此主题进行了一些研究,我发现了一些有趣的链接:"如何倒数到日期"one_answers" https://https://www.sitepoint.com/build-javascript-countdown-timer-no-dependencies/",我的问题是我想从数据库中获取数据和时间,我该怎么做?例如:我有一个带有ID,事件,StartDate,Starttime和Endtime的表事件。我该如何从中更改:" var end = new Date('02/19/2012 10:1 am');"从第一个链接或此链接:"安排时钟自动安排"从第二到倒计时时间到事件,并带有最新时间和日期,依此类推。请记住,我是一个午夜,所以请忍受我。对不起,任何拼写错误。谢谢你!

更新:

这是控制器部分:[HttpGet] public JsonResult GetEvent(int Id) { BOL1.IMS2Entities db = new BOL1.IMS2Entities(); var ev = from e in db.tbl_Event where e.ID == Id select e; //return Json(ev.FirstOrDefault(), JsonRequestBehavior.AllowGet); return Json(Id, JsonRequestBehavior.AllowGet); }
这是脚本部分:

<script>
    function GetEvent() {
        debugger;
        $.ajax({
            type: "GET",
            url: "Home/GetEvent",
            data: { Id: ID },
            contentType: "application/json;charset=utf-8",
            dataType: "json",
            success: function (result) {
                debugger;
                alert(result)
            },
            error: function (response) {
                debugger;
                alert('error');
            }
        });
    }
    var tbl_Event.StartDate = 'yyyy-MM-dd hh:hh:hh';
    //var ServerDate_Time = '2017-02-17 10:45:00';
    //console.log(CompareDateTime(ServerDate_Time));
    console.log(CompareDateTime(tbl_Event.StartDate + tbl_Event.StartTime))
    //function CompareDateTime (ServerDateTime){
    function CompareDateTime (tbl_Event.StartDate + tbl_Event.StartTime){
        var dateString = new Date();
        var currentTime = new Date(parseInt(dateString));
        var month = ('0' + (currentTime.getMonth() + 1)).slice(-2)
        var day = ('0' + (currentTime.getDate())).slice(-2)
        var year = currentTime.getFullYear();
        var hours = ('0' + (currentTime.getHours())).slice(-2)
        var min = ('0' + (currentTime.getMinutes())).slice(-2)
        var sec = ('0' + (currentTime.getSeconds())).slice(-2)
        var date = year + "-" + month + "-" + day + " " + hours + ":" + min + ":" + sec;
        if(ServerDateTime == date){
            return true;
        }else {
            return false;
        }
    }
    }
</script>

假设您的日期时间您正在获得int tbl_event.startdate tbl_event.starttime = 2017-02-17 10:45:00

这将适合您的..

var ServerDate_Time = '2017-02-17 10:45:00';
console.log(CompareDateTime(ServerDate_Time));
function CompareDateTime (ServerDateTime){
    var dateString = new Date();
    var currentTime = new Date(parseInt(dateString));
    var month = ('0' + (currentTime.getMonth() + 1)).slice(-2)
    var day = ('0' + (currentTime.getDate())).slice(-2)
    var year = currentTime.getFullYear();
    var hours = ('0' + (currentTime.getHours())).slice(-2)
    var min = ('0' + (currentTime.getMinutes())).slice(-2)
    var sec = ('0' + (currentTime.getSeconds())).slice(-2)
    var date = year + "-" + month + "-" + day + " " + hours + ":" + min + ":" + sec;
    if(ServerDateTime == date){
        return true;
    }else {
        return false;
    }
}

希望这会有所帮助....

编辑后编辑..

更新的代码...

用于控制器 -

[HttpGet]
        public JsonResult GetEvent(int id)
        {
            using (IMS2Entities ObjEntities = new IMS2Entities())
            {
                var ev = from e in ObjEntities.tblEvents
                         where e.id == id
                         select e;
                return Json(ev.ToList(), JsonRequestBehavior.AllowGet);
            }
        }

的JavaScript代码
<script>
    $(function () {
        GetEvent(); // this will call GetEvent function once your DOM is ready, you can call this function on button click or anywhere as per your need.
        function GetEvent() {
            $.ajax({
                type: "GET",
                url: "/Home/GetEvent",
                data: { Id: '1' },  // '1' is id for my sql database record which is passing to controller to bring back record from server.
                success: function (result) {
                    // result will be collection of list return form server, since you are using id criteria it will always have only 1 record unless you have id as foreign key or something not primary/unique.
                    // I'm using only first instance of result for demo purpose, you can modify this as per your need.
                    alert(CompareDateTime(result[0].StartDateTime.substr(6))); // this will alert your true or false, as per I guess this will always return false, as your current date time will never match sql datetime. Still for your requirement.
                },
                error: function (response) {
                    alert(response);
                }
            });
        }

        function CompareDateTime (ServerDateTimeFormat){
            // Convert ServerDateTimeFormat for Comparision
            var ServerdateString = ServerDateTimeFormat;
            var ServerCurrentTime = new Date(parseInt(ServerdateString));
            var Servermonth = ('0' + (ServerCurrentTime.getMonth() + 1)).slice(-2)
            var Serverday = ('0' + (ServerCurrentTime.getDate())).slice(-2)
            var Serveryear = ServerCurrentTime.getFullYear();
            var Serverhours = ('0' + (ServerCurrentTime.getHours())).slice(-2)
            var Servermin = ('0' + (ServerCurrentTime.getMinutes())).slice(-2)
            var Serversec = ('0' + (ServerCurrentTime.getSeconds())).slice(-2)
            var Serverdate = Serveryear + "-" + Servermonth + "-" + Serverday + " " + Serverhours + ":" + Servermin + ":" + Serversec;
            // Current Date Time for Comparision
            var currentTime = new Date();
            var month = ('0' + (currentTime.getMonth() + 1)).slice(-2)
            var day = ('0' + (currentTime.getDate())).slice(-2)
            var year = currentTime.getFullYear();
            var hours = ('0' + (currentTime.getHours())).slice(-2)
            var min = ('0' + (currentTime.getMinutes())).slice(-2)
            var sec = ('0' + (currentTime.getSeconds())).slice(-2)
            var date = year + "-" + month + "-" + day + " " + hours + ":" + min + ":" + sec;
            if (date == Serverdate) {
                return true;
            }else {
                return false;
            }
        }
    });
    </script>

请确保您在...标签之前提到jQuery的参考。

这是完全有效的示例..:)

最新更新