Как преобразовать вывод DateTime в C # в «Оставшиеся дни» с помощью JavaScript? - PullRequest
1 голос
/ 02 мая 2019

Я запускаю приложение на формах .net, которое отображает вывод DateTime, который мы извлекаем из базы данных.Отображается как срок годности.

public DateTime DATE_EXPIRES { get; set; }
public String DATE_EXPIRES_STR { get; set; }

        public void FromRow(Hashtable row)
        {
            try
            {
                DATE_EXPIRES = row.ContainsKey("DATE_EXPIRES") && row["DATE_EXPIRES"] != DBNull.Value ? Convert.ToDateTime(row["DATE_EXPIRES"]) : default(DateTime);
                DATE_EXPIRES_STR = DATE_EXPIRES.ToString("MMMM dd, yyyy");
            }
            catch (Exception ex)
            {
                SCORM.Error += ex.Message + "\r\n";
            }
        }

Моя цель вместо того, чтобы отображать дату окончания срока действия, отображать «оставшиеся дни» и вычислять разницу между сегодняшним днем ​​и отображаемой датой и показывать пользователю «55 оставшихся дней» и т. Д.вперед.

Мой вопрос касается того, нужно ли мне преобразовывать и отображать с помощью C # или отображать дату как есть, и пусть JavaScript смотрит на дату, рассчитывает оставшееся время и затем выводит оставшиеся дни вместо отображенияфактическая дата истечения срока действия?

Как это выглядит в настоящее время enter image description here

Мой предполагаемый взгляд enter image description here

1 Ответ

1 голос
/ 02 мая 2019

Вы можете использовать momentjs для расчета оставшегося дня, а каждый tr - для преобразования таких значений.

Вы не обновляете код C #, только добавляете код javascript в документ, готовый для преобразования в столбец Expires.

 $(document).ready(function () {
    $("tr").each(function (index, item) {
      if (index == 0) {
        $(item).find('th').eq(1).text('Days Remaining');
      } else {
        let date = $(item).find('td').eq(1).text();
        var eventdate = moment(date, "MMMM DD, YYYY");
        var todaysdate = moment();
        days = eventdate.diff(todaysdate, 'days');
        $(item).find('td').eq(1).text(days + ' Days Left')
      }
    })
  });
table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

td, th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

tr:nth-child(even) {
  background-color: #dddddd;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.js"></script>
<!DOCTYPE html>
<html>
<head>
</head>
<body>


<table>
  <tr>
    <th>Title</th>
    <th>Expires</th>
    
  </tr>
  <tr>
    
    <td>Course 1</td>
    <td>June 24, 2019</td>
  </tr>
  <tr>
    
    <td>Course 2</td>
    <td>June 24, 2019</td>
  </tr>
</table>

</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...