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

Using javascript variable in ASP.NET View with WebGrid Column

本文关键字:WebGrid 带有 列的 NET 视图 变量 javascript ASP      更新时间:2023-09-26

我试图在我的WebGrid列中显示一个javascript变量。使用javascript是必须的,因为我正在寻找相应的客户端日期时间。我创建了我的webgrid在cshtml视图头

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

然后在begin form内,我尝试填充它(使用日期操作)如下:-

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")

这也不起作用。我做错了什么?什么是正确而简单的方法来达到同样的效果?

啊…最后我自己做了,方法很简单,让用服务器端数据填充webgrid,然后在脚本页面上onready事件,当所有数据都设置好,页面准备好了,我调用jquery来迭代表,并做javascript操作。所以我的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 }));
        }
    });
});