2016-08-09 51 views
0

Ich habe eine Tabelle mit 8 Spalten. Jeder Datumswert in der letzten Spalte muss in den lokalen Browser konvertiert werden. Im Moment zeigt es als UTC:Wie konvertiert man jedes Col nach Index in einer Tabelle in einen lokalen Moment?

enter image description here

So habe ich einig JQuery Schleife durch jede Zeile an dem Index .eq(index) mit dem Index '6' in JQuery sein ausarbeitet. Aber wenn ich diese Funktion zu testen wandelt es nur die letzte Zeile UpdatedTime in der Tabelle, und die Zeit ist nicht lokal wie unten zu sehen:

enter image description here

Wie kann ich jede Zeile in einer bestimmten Spalte zu lokalem Moment konvertieren?

Dies ist die JQuery-Funktion I-Schleife durch:

$(".td-limit").eq(6).each(function() { 
     var updatedTimeISO = moment.utc($(this).data('order')).toISOString(); 
     var updatedTimeLocal = moment(updatedTimeISO); 
    $(this).text(updatedTimeLocal); 
    }); 

Und das sind die Spalten in der Datentabelle, wo die letzte Spalte das Ziel UpdatedTime, die konvertiert werden muss:

    @foreach (Models.Escalation item in Model) 
        { 

         <tr> 
          <td>@item.ID</td> 
          <td>@item.Application</td> 
          <td class="td-limit">@item.EMAD</td> 
          <td class="td-limit">@item.Event</td> 
          <td class="td-limit">@item.Status</td> 
          <td style="font-size: 16px;" class=" td-limit">@item.Statement</td> 
          <td class="td-limit">@item.Created</td> 
          <td class="td-limit">@item.Update</td> 
          <td data-order="@item.UnixTimeStamp" class="td-limit">@item.UpdatedTime</td> 

         </tr> 

        } 
+1

können Sie den gerenderte HTML-Code für die Tabelle? –

+0

Chek out Spaltenrendering: https://datatables.net/examples/advanced_init/column_render.html. Aber ich bin nicht 100% es wird für Ihren Fall funktionieren, da Sie die Tabelle mit HTML-Tags anstelle von Json bevölkern. –

Antwort

1

Ändern Sie Ihr Razor so, dass Sie die aktualisierte Uhrzeit nicht angeben.

Verwenden Sie dann diese jQuery, um es auf der Clientseite zu aktualisieren.

$("td[data-order]").each(function() { 
 
    var updatedTimeISO = moment.utc($(this).data('order')).toISOString(); 
 
    var updatedTimeLocal = moment(updatedTimeISO); 
 
    $(this).text(updatedTimeLocal); 
 
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.14.1/moment.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table border="1"> 
 
    <tr> 
 
    <td>ID</td> 
 
    <td>Application</td> 
 
    <td class="td-limit">EMAD</td> 
 
    <td class="td-limit">Event</td> 
 
    <td class="td-limit">Status</td> 
 
    <td style="font-size: 16px;" class="td-limit">Statement</td> 
 
    <td class="td-limit">Created</td> 
 
    <td class="td-limit">Update</td> 
 
    <td data-order="2013-02-02T21:01:26.0828604Z" class="td-limit"></td> 
 
    </tr> 
 
    <tr> 
 
    <td>ID</td> 
 
    <td>Application</td> 
 
    <td class="td-limit">EMAD</td> 
 
    <td class="td-limit">Event</td> 
 
    <td class="td-limit">Status</td> 
 
    <td style="font-size: 16px;" class=" td-limit">Statement</td> 
 
    <td class="td-limit">Created</td> 
 
    <td class="td-limit">Update</td> 
 
    <td data-order="2013-03-02T21:01:26.0828604Z" class="td-limit"></td> 
 
    </tr> 
 
    <tr> 
 
    <td>ID</td> 
 
    <td>Application</td> 
 
    <td class="td-limit">EMAD</td> 
 
    <td class="td-limit">Event</td> 
 
    <td class="td-limit">Status</td> 
 
    <td style="font-size: 16px;" class=" td-limit">Statement</td> 
 
    <td class="td-limit">Created</td> 
 
    <td class="td-limit">Update</td> 
 
    <td data-order="2013-07-02T21:01:26.0828604Z" class="td-limit"></td> 
 
    </tr> 
 
</table>