Question

我正在尝试为基于asp.net网络表单构建的电子商务网站创建一个AJAX功能。在这个AJAX功能中，我必须从数据库加载产品并在我的页面中显示。

我正在使用 jQuery 加载方法来进行AJAX调用。我知道如何使用.load（）方法，但我对如何从数据库中获取产品感到困惑。

这里的主要问题是我必须传递2个参数来过滤产品。这些是＆＃34;产品关键字＆＃34;和＆＃34;产品类别＆＃34;。所以请指导我从jQuery Load Method创建这个功能。

谢谢

Answer 1

您当然可以使用jQuery Load方法从数据库中获取产品。为此你从第1页到第2页从jQuery Load进行AJAX调用。

第1页： 添加ID为＃34; resultDiv＆＃34;。

的div

<div id="resultDiv"></div>

在这个div中，产品将从jQuery加载方法中显示出来并显示出来。

然后添加如下的加载方法代码：

$("#resultDiv").load("page2.aspx #productData", { "keyword": "" + $("#keywordInput").val() + "", "category": "" + $("#categorySelect").val() + "" }, function (response, status, xhr) {
    if (status == "error")
        alert("Error: " + xhr.status + ": " + xhr.statusText);
});

＆＃34; productData＆＃34;将是page2中的div，jQuery load将获取其内容。在load（）函数的第二个参数中，我传递了关键字和类别。

你可以在这里想象＆＃34; keywordInput＆＃34;可以是一个文本框，而＆＃34; categorySelect＆＃34;可以是一个选择控件。用户在文本框中添加关键字并选择类别，然后按下提交按钮。按钮的单击事件是jQuer Load代码的写入位置。

第2页：添加div＆＃34; productData＆＃34;在页面中：

<div id="productData" runat="server"></div>

在Page_load事件中的.cs页面上，您调用了一个函数＆amp;将其命名为＆＃34; FetchProduct＆＃34;。

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        FetchProduct();
    }
}

在FetchProduct（）中，您可以使用Request.Form获取参数关键字和参数类别值，然后从数据库中获取产品并在productData div中显示它们。代码belwo解释了这一点：

void FetchProduct()
{
    string keyword = Request.Form["keyword"];
    string category = Request.Form["category"];

    string information="";
    //get products form databaase then add them to information variable and show them inside productData div 
    productData.InnerHtml = information;
}

现在，productData将显示产品，但由于第1页通过jQuery Load调用了第2页，因此它们也将显示在第1页上。

我建议您查看 - 这个jQuery Load方法教程，它解释了在您的网站中使用.load（）方法的一些好方法。

如何使用jQuery加载来获取电子商务网站的产品

1 个答案: