将表行动态添加到asp.net MVC 3.0中的现有表

时间:2011-08-19 14:08:54

标签: jquery asp.net-mvc-3 jquery-selectors

我现有的表格看起来像这样。

<table class="subheader" id="tableTelephone">
    <thead class="subheader">
        <tr>
            <td>
                @Resources.TYPE
            </td>
            <td>
                @Resources.TELEPHONE_NUMBER
            </td>
        </tr>
    </thead>
    <tbody class="subheader">
        @{foreach (Telephone phone in Model.TelephoneList)
        {
        <tr>
             <td>@phone.TelephoneType</td>
             <td>@phone.Number</td> 
        </tr>
        }
    }
    </tbody>
</table>

点击按钮我想从文本框中获取值&amp;附加到上面的现有表格。 我在jquery下面使用相同的,但它不起作用,除非我在foreach循环后附加一个空TR。

$('#tableTelephone > tr:last').after("<tr><td>" + type + "</td><td>" + number + "</td></tr>");

空检查数据时会导致问题,所以请告诉我是否有任何解决方案可以追加行(不使用空的tr)

1 个答案:

答案 0 :(得分:1)

$('#tableTelephone').append(

"<tr><td>" + type + "</td><td>" + areaCode + "-" + number + "</td></tr>"
);

DEMO

$("<tr/>").append(
$("<td/>").text(type))
   .append($("<td/>").text(areaCode+"-"+number))
   .appendTo("#tableTelephone");

这里是小提琴http://jsfiddle.net/MecUs/2/

jquery .appendTo

Description:
Insert every element in the set of matched elements to the end of the target.