0

I have an MVC 4 view that contains a partial view. The partial view is included in the main view as follows:

    <div id="PartialView">
        @Html.Partial("_PhotoList", @Model)    
    </div>

My partial view looks as follows:

@model ExchangeSite.Entities.EstateSaleSellerListing

<div style="width: 1300px; height: 300px; overflow: auto">
    @foreach (var photo in @Model.ImageList)
    {
        <a href="javascript:DeletePhoto(@photo.ImageId);">
            <img src="@Url.Action("GetPhoto", new { id = photo.ImageId })" alt="" title="Click on the image to remove it" width="250" height="190"/>
        </a>
    }
</div>

<script>

    function DeletePhoto(imageId) {
        var Url = "/EstateSaleSellerListing/DeletePhoto";

        $.get(Url, { imageId: imageId }, function (data) {
            $("#PartialView").html(data);
        });
    }

</script>

As you can see, when a user clicks on an image, the DeletePhoto() method is called. It makes a call to an action method named DeletePhoto on the named controller. The action method deletes the photo, generates a new list of photos and updates the partial view. Everything works except the partial view is never updated.

My controller code is as follows:

public ActionResult DeletePhoto(int imageId)
{
    var photo = this._systemLogic.GetItem<Photo>(row => row.ImageId == imageId);
    this._systemLogic.DeleteItem(photo);

    EstateSaleSellerListing listing = new EstateSaleSellerListing();
    GetPhotoList(listing);

    return PartialView(listing);
}

The EstateSaleSellerListing entity has a list of photo objects that get displayed in the partial view.

I don't have enough experience to know why my partial view isn't updating when the action method returns.

4

3 回答 3

1

Try to move your javascript to your main page and change

return PartialView(listing);

to

return PartialView("_PhotoList", listing);
于 2013-05-21T22:11:20.977 回答
0

Check your cache settings in jQuery (it looks like you're using jQuery by the syntax anyway). And I think your second parameter is a bit off (not assigning it to data)... Try this

<script>
    function DeletePhoto(imageId) {
        var Url = "/EstateSaleSellerListing/DeletePhoto";

        $.get(Url, { cache: false, data: { imageId: imageId }}, function (data) {
            $("#PartialView").html(data);
        });
    }
</script>
于 2013-05-21T23:28:40.377 回答
0

You could also have the controller method render the partial view to string if it is being loaded in a partial.

Controller...

model.PartialViewContent=PartialToString("Partials/SmallerPart",model);
return PartialView("Partials/LargerPart",model);

View

 $("#PartialView").html(data.PartialViewContent);

Fyi, PartialToString is not built into mvc. I had to hack that together

于 2013-05-21T23:50:24.727 回答