Шаблоны jQuery - замена содержимого DIV

Question

Поэтому я использую шаблоны jQuery, и в моем приложении работает следующий код:

@using (Html.BeginForm())
    {
        @Html.DropDownList("StateList",
                            Model.States,
                            "< Select >"
                            )

        <div id="designCenters"></div>

        <script id="designCenterTemplate" type="text/html">
            <p><li>${Name}</li></p>
        </script>           
    }

    <script language="javascript" type="text/javascript">
        $("#StateList").change(function () {
            $.getJSON("/api/designcentersbystate/" + $(this).val(), 
              function (data) { 
                  $("#designCenterTemplate").tmpl(data).appendTo("#designCenters")
               });
        });
    </script>

Поскольку я вызываю .appendTo в параметре функции обратного вызова функции шаблона, очевидно, списокдизайн-центр добавлен в список.Моя цель - ЗАМЕНИТЬ содержимое в <div id="designCenters"> с шаблонными результатами.

В поисках наиболее эффективного способа сделать это.

Спасибо.

Answer 1

Измените функцию успеха следующим образом:

function (data) { 
    $("#designCenters").html($("#designCenterTemplate").tmpl(data))
}

Или вы можете каждый раз опорожнять контейнер.

$("#designCenters").empty();
$("#designCenterTemplate").tmpl(data).appendTo("#designCenters");

Answer 2

Вы можете заменить html в таком элементе:

$("#designCenters").html(YOUR HTML HERE);