Question

问题背景：

我正在尝试在MVC网站视图的表格中显示数组的内容。

问题：

我有一个JQuery'AddRow'函数，它可以动态地向表添加行，但是很多'CartItems'都在Controller的传递列表中，用于'foreach'迭代循环。

目前，当我将参数传递给'AddRow'时，没有行被添加到表中。如果我没有提供参数并提供虚拟表数据，它会添加。

以下是代码：

<table id="Table1" cellspacing="3">
<tr>
    <td>Product</td>
    <td>Unit Price</td>
    <td>Qty</td>
</tr>
</table>

<script type="text/javascript">

var AddRows = function (productName,productPrice,productQty)
{
     var html = '<tr>'
                '<td>'+productName.toString+'</td>' +
                '<td>'+productPrice.toString+'</td>' +
                '<td>'+productQty.toString+'</td>' +
                '</tr>'
     $(html).appendTo($("#Table1"))
};

@foreach (var cartItem in (List<LoginTest.Models.CartItem>)ViewBag.Data)
{
<script>
    AddRows(@cartItem.CartItemName, @cartItem.CartItemPrice, @cartItem.CartItemQty)
</script>
}

Answer 1

我认为你必须使用文档就绪函数，因为你的AddRows函数在加载jQuery之前执行

<script>
    $(function(){
       @foreach (var cartItem in (List<LoginTest.Models.CartItem>)ViewBag.Data)
       {
           AddRows('@cartItem.CartItemName', '@cartItem.CartItemPrice', '@cartItem.CartItemQty' );
       } 
    }); 
</script>


var AddRows = function (productName,productPrice,productQty)
{
     var html = '<tr>'
                '<td>'+productName+'</td>' +
                '<td>'+productPrice+'</td>' +
                '<td>'+productQty+'</td>' +
                '</tr>'
     $(html).appendTo($("#Table1"))
};

Answer 2

您使用toString()方法的错误语法。使用方法如下

number.toString(radix)

radix是一个经常未使用的可选参数，用于设置表示数字的基数。

Answer 3

我曾经遇到过这个问题，这与JavaScript不喜欢Razor对象有关：

我这样修好了：

@foreach (var cartItem in (List<LoginTest.Models.CartItem>)ViewBag.Data)
{
<script>

var cartItemName = '@cartItem.CartItemName';
var cartItemPrice = '@cartItem.CartItemPrice';
var cartItemCartItemQty = '@cartItem.CartItemQty';

    AddRows(cartItemName , cartItemPrice , cartItemCartItemQty )
</script>
}

然后你不需要toString（）

var AddRows = function (productName,productPrice,productQty)
{
     var $html = $('<tr>'
                '<td>'+productName+'</td>' +
                '<td>'+productPrice+'</td>' +
                '<td>'+productQty+'</td>' +
                '</tr>');
     //$(html).appendTo($("#Table1"));

    $('#Table1 > tbody:last').append($html);
};

Jquery函数不使用参数值

3 个答案: