MVC Ajax返回部分视图,但没有显示

时间:2022-10-08 12:30:08

I have a page that asks for some details first and then returns a partial view in a div below it.

我有一个页面,它先询问一些细节,然后在它下面的div中返回部分视图。

This is my Ajax (details are being taken and passed to the controller accordingly since I tested it):

这是我的Ajax(自从我测试它以来,详细信息正在被获取并相应地传递给控制器):

<script type="text/javascript">
function Filter() {
    var startd = $('#startdt').val();
    var endd = $('#enddt').val();
    var itemname = $("#Products option:selected").val();

    var param = { StartD: startd, EndD: endd, ItemName: itemname };

    $.ajax({
        url: '@Url.Action("FilterTransaction")',
        type: "POST",
        datatype: "html",
        UpdateTargetId: "divResult",
        data: param,
        error: function (xmlHttpRequest, errorText, thrownError) {
            alert(xmlHttpRequest + "|" + errorText + "|" + thrownError);
        },
        success: function (data) {
            $('divResult').html(result);
        }
    });
}
</script>

This is the controller (methods and variables are processed all properly):

这是控制器(方法和变量都被正确处理):

public PartialViewResult FilterTransaction(string StartD, string EndD, string ItemName)
    {
        try
        {
            int productid = new ProductService.ProductsServiceClient().GetProductID(ItemName);
            Product p = new ProductService.ProductsServiceClient().GetProduct(productid);
            ViewBag.ItemNo = productid;
            ViewBag.ItemName = p.Name;
            ViewBag.AmmountP = p.Price;
            int orderid = new OrderService.OrderServiceClient().GetOrderID(productid, User.Identity.Name);
            Order o = new OrderService.OrderServiceClient().GetOrder(orderid);
            ViewBag.DatePurchased = o.Date;
            ViewBag.WarrantyExpiryDate = o.Date.AddYears(2);

            DateTime fromd = Convert.ToDateTime(StartD);
            DateTime todate = Convert.ToDateTime(EndD);
            todate = todate.AddDays(1);

            List<PrintViewFD> printv = new List<PrintViewFD>();
            foreach (FaultDetail fs in new FaultService.FaultServiceClient().GetListOfFaultDetailsbetweenDATES(orderid, productid, fromd, todate))
            {
                PrintViewFD pvd = new PrintViewFD();
                pvd.date = fs.Date.ToString();
                pvd.details = fs.Details;
                pvd.faultid = fs.FaultID;
                FaultStatu fss = new FaultService.FaultServiceClient().GetStatus(fs.FaultStatusID);
                pvd.status = fss.Status;
                printv.Add(pvd);
            }

            ViewBag.FaultDetailsLIST = printv;
            return PartialView("_filtertransactions");
        }
        catch
        {
            return PartialView("_filtertransactions");
        }
    }

I debugged the function and it is entering both the controller method and the Partial View. The only problem is that the partial view is not being displayed in the view then. I think that it has to do with the ajax!

我调试了这个函数,它同时输入控制器方法和部分视图。唯一的问题是局部视图没有显示在视图中。我认为这和ajax有关!

This is the div that should display it:

这是应该显示它的div:

<div id="divResult">test</div>

1 个解决方案

#1


2  

There's a mistake on your success method of the ajax call. You need to change divResult to "#divResult " and append 'data' to the html instead of 'success' Try something like this:

ajax调用的成功方法有一个错误。您需要将divResult更改为“#divResult”,并将“数据”附加到html,而不是“成功”尝试如下:

$.ajax({
    url: '@Url.Action("FilterTransaction")',
    type: "POST",
    datatype: "html",
    UpdateTargetId: "divResult",
    data: param,
    error: function (xmlHttpRequest, errorText, thrownError) {
        alert(xmlHttpRequest + "|" + errorText + "|" + thrownError);
    },
    success: function (data) {
        $("#divResult").empty(); //In case you're going to refresh this multiple times
        $("#divResult").html(data);
    }
});

#1


2  

There's a mistake on your success method of the ajax call. You need to change divResult to "#divResult " and append 'data' to the html instead of 'success' Try something like this:

ajax调用的成功方法有一个错误。您需要将divResult更改为“#divResult”,并将“数据”附加到html,而不是“成功”尝试如下:

$.ajax({
    url: '@Url.Action("FilterTransaction")',
    type: "POST",
    datatype: "html",
    UpdateTargetId: "divResult",
    data: param,
    error: function (xmlHttpRequest, errorText, thrownError) {
        alert(xmlHttpRequest + "|" + errorText + "|" + thrownError);
    },
    success: function (data) {
        $("#divResult").empty(); //In case you're going to refresh this multiple times
        $("#divResult").html(data);
    }
});