动态添加新项目的速度极慢

Question

我使用ASP.NET MVC和Razor。 用户需要填充某种由对象列表组成的表格。 因此，我将空对象列表从控制器传递到视图。 这是我主要观点的一部分：

foreach ( var product in Model.Products )
{
    Html.RenderPartial( "ProductPartial", product );
}

在ProductPartial中，用户为每个产品输入一些字段。 用户可以从列表中动态添加或删除产品。 删除我解决了jQuery的实时功能，这很好。 但是我在添加新产品时遇到问题。

我通过以下方式解决了问题：在加号上单击javascript函数调用控制器操作：

public ActionResult NewProduct()
{
    Product product = new Product();
    product.UniqueId = Guid.NewGuid();
    return PartialView( "ProductPartial", product );
}

我需要每个产品都有唯一的ID，因为我希望能够通过ID从jquery访问产品。 添加可以正常工作，但是速度非常慢，因为我要为每个新产品使用服务器。 有什么好方法可以使其更快？

Answer 1

好吧，您可以使用jQuery.clone（）来代替向服务器请求更多相同的HTML。

在示例中，我要复制列表中的第一个产品并为其赋予新的ID，然后将其添加到列表的末尾。

var newProductHtml = $('.MyProducts')[0].clone();
newProductHtml.attr('id', MyNewId);
newProductHtml.appendTo('.MyProductsContainer');