Question

我有以下代码，对于我如何将日期附加到新输入数据的前端并不直观。

基本上我有一个文本字段，允许编辑其中的数据。它最初从数据库中提取oldVal，在td中显示它，并允许用户更新/编辑/添加它。当焦点离开textarea时，调用此方法，然后调用php文件写入数据库。

这是td：

<td class="editable-col" contenteditable="true" col-index='4' oldVal ="<?php echo nl2br($res2['status']); ?>"><?php echo nl2br($res2['status']); ?></td>

以下是调用焦点＆＃39;：

的javascript方法

<script type="text/javascript">
$(document).ready(function(){
    $('td.editable-col').on('focusout', function() {
        data = {};
        data['val'] = $(this).html().replace(/\r?\n/g, '<br />');
        data['id'] = $(this).parent('tr').attr('data-row-id');
        data['index'] = $(this).attr('col-index');
        if($(this).attr('oldVal') === data['val'])
            return false;

        $.ajax({   

              type: "POST",  
              url: "updater_1.php",  
              cache:false,  
              data: data,
              dataType: "json",       

        });
    });
});
</script>

我想追加＆＃34; 2017年3月21日 - ＆＃34;在输入的新数据的前面。

我会在这里添加＆＃34;还有另一个更新＆＃34;

所以td最终看起来像这样：

2017年3月13日 - 关于cuz blah blah blah的更新 2017年3月19日 - 这里的另一个更新
2017年3月21日 - 还有另一个更新版本

有什么建议吗？我尝试在updater_1.php文件中处理它，但是经过几个小时后，它并不像我想象的那么容易。

感谢您提出的所有建议。

添加图片：

另：

新密码测试：

$(document).ready(function(){
  $('td.editable-col').on('focusout', function() {
    data = {};
    data['val'] = getDate() + $(this).html().replace(/\r?\n/g, '<br />');
    data['id'] = $(this).parent('tr').attr('data-row-id');
    data['index'] = $(this).attr('col-index');

$.ajax({   

      type: "POST",  
      url: "updater_1.php",  
      cache:false,  
      data: data,
      dataType: "json",       

    });
  });
});

Answer 1

对于入门者，您可以使用date("F j,Y")以 月份日期，年份 格式返回日期：所以，这是在updater_1.php脚本上考虑的算法：

第1步： 获取已发布的值并对其进行清理。

第2步： 在$ _POST ['data'] ['values']中获取<br />之后的字符串的最后一部分（基于您的JS）逻辑并假设你的最后一行是这里新添加的字符串）

第3步： 将所需格式的今天日期添加到字符串的最后一部分（新添加的数据）

第4步： 从数据库中获取旧数据。这一步很重要，因为我们不相信用户输入的数据他可能已经摆弄了以前添加数据的日期

step5： 将步骤3中的数据附加到步骤4中的数据（即oldData +'br /'+ date + newData）

第6步： 将此数据写入数据库

step7： 如果一切顺利，并将这些新写入的数据返回到前端

要执行上述操作，您的php脚本应该执行以下操作：

 // When you've the post
 $_POST  = filter_input_array(INPUT_POST, FILTER_SANITIZE_STRING);
 //whatever is present in the text box
 $userData = explode("<br />",$_POST['data']['value']);
 //newly entered line/ data and current data
 $todayDate = date("F j,Y")
 $newDataToSaveWithDate =  $todayDate." - ".$dataToSave[count($dataToSave)-1]; 
 //fetech the old data from DB again we don't trust the user he might have changed the date of previously edited data
 //assuming the oldData is fetched correctly into a variable called $oldData
 $dataToSave = $oldData.'<br />'.$newDataToSaveWithDate;
// Save $date to DB
//assuming when everything goes right and the DB is updated
echo $dataToSave; //this would return a date like March 23, 2017 subjected to your datetimezone

在你的ajax电话中写下一个成功函数：

    var self = this; //or any other selector where you want to update/display the date
    $.ajax({   

          type: "POST",  
          url: "updater_1.php",  
          cache:false,  
          data: data,
          dataType: "json",
          success: function(data) {
                       $(this).html(data);
                   }       

    });

Answer 2

您可以使用本机JavaScript代码在客户端执行此操作：您可以使用global Date class来获取时间，并编写一个返回格式化日期的函数。（在JS中没有简单的内置方法来格式化Date对象，但是你可以使用moment.js之类的库来实现这一点。）

以下是从another SO answer格式化当前日期的功能：

function getDate() {
    var today = new Date();
    var dd = today.getDate();
    var mm = today.getMonth()+1; //January is 0!
    var yyyy = today.getFullYear();

    if(dd<10) {
        dd='0'+dd
    } 

    if(mm<10) {
        mm='0'+mm
    } 

    today = mm+'/'+dd+'/'+yyyy;
    return today;
}

然后您可以在现有的AJAX调用中使用它。只需在设置data['val']键时调用上述功能：

data['val'] = getDate() + $(this).html().replace(/\r?\n/g, '<br />');

在Javascript中将日期附加到变量

2 个答案: