如何为每个对象 datetimepicker 创建动态数组

How to create dynamic array for each object datetimepicker

插件: eonasdan/Bootstrap 3 Datepicker

解释:

我想编写一个应用程序,用户可以每天 select 5 个不同的时间。所以我创建了一个数组并每天添加(不重复),例如用户 select 31/12/201730/12/2017 ,现在我想给他们这种能力 select 只有 5 selected 的每一天都有不同的时间。

尝试过的代码:

var limit = 5;
var i = 0;
var dateArray = new Object();

$('#ss').click(function() {
  if ($('#datetimepicker1 input').val().length > 0) {
    var date = $('#datetimepicker1 input').val();
    var getDate = date.split(' ');
    var unqdate = getDate[0];
    var unqtime = getDate[1];

    if ($.inArray(unqdate, dateArray) == -1) {
      dateArray[unqdate] = unqtime
    }

  }
  console.log(dateArray);
});

JSFiddle

(为了测试,select一个日期,然后点击保存按钮,然后检查控制台)

目标:

var dateArray = {
  "31-12-2017": [{
    "time": "14:00"
  }, {
    "time": "17:15"
  }],
  "30-12-2017": [{
    "time": "13:00"
  }, {
    "time": "12:15"
  }]
}

问题:

  1. 我想不通如何才能每天增加一个时间。这是我第一次像这样使用数组和对象。

  2. 我想防止重复输入,每天只有五个不同的小时。

不知何故我在学习。

您的 JS 代码有问题:

var limit = 5;
var i = 0;
var dateArray = new Object();

$('#ss').click(function() {
  if ($('#datetimepicker1 input').val().length > 0) {
    var date = $('#datetimepicker1 input').val();
    var getDate = date.split(' ');
    var unqdate = getDate[0];
    var unqtime = getDate[1];

    if ($.inArray(unqdate, dateArray) == -1) {
      if(dateArray[unqdate] && dateArray[unqdate].length < limit) {
         if(!dateArray[unqdate].find((ele) =>ele.time === unqtime)){
          dateArray[unqdate].push({"time": unqtime})
         }
      } else {
         dateArray[unqdate] = [{"time": unqtime}]
      }
   }

  }
  console.log(dateArray);
});

注意包括时间分割的逻辑。您可以使用 split by : 并获取数组的前 2 个元素。

我已经根据您的要求创建了 JSON 响应。

结果 :: JSON.stringify(parentObject)

代码如下

$(document).ready(function() {

$('#datetimepicker1').datetimepicker({
    stepping: 30,
    sideBySide: true,
    showTodayButton: true,
    format: 'DD-MM-YYYY HH:mm:ss',
});

// my code

var limit = 5;
var i = 0;
var parentObject = new Object();
var parentArray = [];
var dateAndTimeObject;


function isDateSelectedExists(date) {

    for (var i = 0; i < parentArray.length; i++) {
        var obj = parentArray[i];
        if (obj["date"] === date) {
            return i;
        }
    }
    return -1;
}

$('#ss').click(function() {
    if ($('#datetimepicker1 input').val().length > 0) {

        var date = $('#datetimepicker1 input').val();
        var getDate = date.split(' ');
        var unqdate = getDate[0];
        var unqtime = getDate[1];

        var tempIndex = isDateSelectedExists(unqdate);
        console.log("tempIndex :: " + tempIndex);
        if (tempIndex == -1) {

            console.log("date doesn't exists");
            dateAndTimeObject = new Object();
            dateAndTimeObject["date"] = unqdate;
            var timeArray = [];
            timeArray.push(unqtime);
            dateAndTimeObject["time"] = timeArray;
            parentArray.push(dateAndTimeObject);
            parentObject["res"] = parentArray;

        } else {
            console.log("date exists");
            dateAndTimeObject = parentArray[tempIndex];
            var timeArray = dateAndTimeObject["time"];
            if(timeArray.length<5) timeArray.push(unqtime);
            dateAndTimeObject["time"] = timeArray;

        }
        console.log("final res :: " + JSON.stringify(parentObject));
    }
});});