用数据类型html元素调用jQuery load或$ .ajax后不更新

Question

I am currently having a problem where when the jQuery Load is called an element which was previously updateable is no longer updateable it reverts to its original state and although it is still accessible and updateable the visual on the screen does not change.

The element is in the a partial view in the layout page. While the load event is being called from a click in a <li> menu item. Which then calls load and attempts to get the possible changes in cart.

Partial View Code

<div id="cart" style="float:right;clear:right;margin-top:31px;height:21px;">
    <span>
        <a href='/ShoppingCart/ShoppingCart'><img style='height:16px;margin-bottom:5px;' src='../Content/images/cartImage.gif' alt='cart' />0 Total : 0</a> 
    </span>
</div>

Layout Code

function GetCart() {
    var url = "/ShoppingCart/GetCartAmount/";
    $.ajax({
        url: url,
        data: {},
        cache: false,
        type: "POST",
        success: function (result) {
            var markup = "<span> <a href='/ShoppingCart/ShoppingCart'><img style='height:16px;margin-bottom:5px;' src='../Content/images/cartImage.gif' alt='cart'/></a> " +
                result.ItemCount + "  Total: " + result.Total + "</span>";

            $("#cart").html(markup);
            alert($('#cart').html());

            alert("after set");
        },
        error: function (reponse) {
            alert("error : " + reponse);
        }
    });
}

The Ajax code is in a function with other processing.

$.ajax({
    url: data.redirectUrl,
    dataType: "html",
    success: function (responseText) {
        var tempDiv = $.parseHTML(responseText);
        $("#result").html(tempDiv).show();
    }
});
 GetCart();

Controller Code

<HttpPost()>
Function GetCartAmount() As ActionResult
        Dim ItemCount = GetCart().Count
        Return Json(New With {.Total = GetCartTotal().ToString, .ItemCount = ItemCount})
End Function

Public Function GetCart() As List(Of WebItemModel)
        Dim retValue As New List(Of WebItemModel)
        If Session("Cart") IsNot Nothing Then
            retValue = DirectCast(Session("Cart"), List(Of WebItemModel))
        End If
        Return retValue
End Function

If any further code should be provided please do tell me. I didn't post it all since it would take up too much space and possibly confuse people. Also to make a point it initially works before the jQuery load occurs.

Answer 1

I finally got it working by doing the following

function GetCart() {
    var url = "/ShoppingCart/Cart/";

    var $partialDiv = $('#PartialCart div')

    $.get(url, function (data) {
         $partialDiv.replaceWith(data);
    });
}

It seems to be working perfectly now the replaceWith did the trick for me.

Controller Code

Public Function GetCart() As List(Of WebItemModel)
        Dim retValue As New List(Of WebItemModel)
        If Session("Cart") IsNot Nothing Then
            retValue = DirectCast(Session("Cart"), List(Of WebItemModel))
        End If
        Return retValue
End Function