2011-02-03 2 views
5

그래서 교체 :jQuery를 템플릿 - 내가 jQuery를 템플릿을 사용하여 내 응용 프로그램에서 작업 다음과 같은 코드를 가지고있어 DIV 내용

@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"> 내의 콘텐츠를 템플릿 결과로 바꾸는 것입니다.

이 작업을 수행하는 가장 효율적인 방법을 찾고 있습니다.

감사합니다.

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

답변

9

변경 성공 기능과 같이 :

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

을 또는 당신은 컨테이너마다 빈 수

+0

빙고. 나는 이것을 10 분 안에 대답으로 받아 들일 것이다. – Scott

1

이 같은 요소에 HTML을 대체 할 수 있습니다. .

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

나는에 템플릿 코드를 변경 시도 : ("#의 designCenters") $ ("#의 designCenterTemplate") tmpl (데이터) .html 중에서하지만 그것은 완전히 템플릿 표시를 중지하게하는 것 외에는 아무런 영향을 미치지 않습니다 데이터 (JS 오류 없음). jQuery에 익숙하지 않으므로 아마도 내가 호출하는 방식의 기본 문제 일 것입니다. – Scott

+0

방금 ​​html 메소드를 잘못 사용했습니다. 제 버전이 맞습니다. Josiash의 답변은 내 것과 비슷하지만 시나리오가 더 완벽합니다. – stephen776

관련 문제