Question

我正在尝试在我的WebGrid列中显示一个javascript变量。因为我找到相应的客户端日期时间，所以必须使用javascript。我在cshtml视图头

中创建了我的webgrid

WebGrid grid = new WebGrid(Model,...)

然后在开始表单中我尝试填充它（使用日期操作），如下所示： -

grid.Table(
    tableStyle: "table table-bordered",
    columns: grid.Columns(
        grid.Column("FirstCol", "First Column"),            
        grid.Column("SometTime", "Local Time",
            format: @<text>
            @{
                var sDate="";
                <script>                        
                    var isoDate = '@item.SometTime.ToString("o")';
                    var date = new Date(isoDate);
                    if(isNaN(date.getTime()))
                        date = new Date(isoDate.slice(0, isoDate.lastIndexOf(".")).replace(/-/g, '/'));
                    sDate = date.toLocaleString('en-US', { hour12: true })                                                
                </script>                   
                @sDate    <<<<  I like this sDate to be part of column data
            }
            </text>),
        grid.Column("LastCol", "Last Column")
        ....
        ...

sDate是我想在所有行的特定列中显示的内容。我确认使用chrome调试器，sDate中的值是正确的，我得到了我想要显示的内容。但我正在努力展示价值。上面是空的。我也尝试过以下方法： -

        grid.Table(
    tableStyle: "table table-bordered",
    columns: grid.Columns(
        grid.Column("FirstCol", "First Column"),            
        grid.Column("SometTime", "Local Time",
            format: @<text>
            @{
                var cDate="";
                <script>                        
                    var sDate="";
                    var isoDate = '@item.SometTime.ToString("o")';
                    var date = new Date(isoDate);
                    if(isNaN(date.getTime()))
                        date = new Date(isoDate.slice(0, isoDate.lastIndexOf(".")).replace(/-/g, '/'));
                    sDate = date.toLocaleString('en-US', { hour12: true })                                                
                    @cDate = sDate;
                </script>                   
                @cDate    <<<<  I like this sDate to be part of column data
            }
            </text>),
        grid.Column("LastCol", "Last Column")

这也没有奏效。我做错了什么？什么是正确而简单的方法来实现同样的目标？

Answer 1

啊......最后我自己做了，通过让webgrid用服务器端数据填充然后在onready事件上的脚本页面上设置所有数据并且页面准备好后，方法很简单，我将jquery称为迭代表并执行javascript manupulation。所以我的webgrid是

grid.Table(
tableStyle: "table table-bordered",
columns: grid.Columns(
    grid.Column("FirstCol", "First Column"),            
    grid.Column("SometTime", "Local Time"),
    grid.Column("LastCol", "Last Column")
    ....
    ...

然后页面末尾的脚本就像

<script>
        jQuery(document).ready(function () {
    $("td").each(function (index, el) {
        if (this.cellIndex == 1) {
            var sDate = $(el).html();
            var date = new Date(sDate)
            if(isNaN(date.getTime()))
                date = new Date(isoDate.slice(0, sDate.lastIndexOf(".")).replace(/-/g, '/'));
            $(el).html(date.toLocaleString('en-US', { hour12: true }));
        }
    });
});

在ASP.NET视图中使用带有WebGrid列的javascript变量

1 个答案: