PartialView MVC 3에서 JavaScript 함수를 실행하는 방법




asp.net-mvc partial-views (5)

\\code
public ActionResult mapPartial(DataTable dt)
        {
            string strEvents = "[";
            foreach (DataRow row in dt.Rows)
            {
                strEvents += "[" + row["Lat"].ToString() + ", " + row["Long"].ToString() + ", " + "\"" +
                row["LastName"].ToString() + row["DateOfBirth"].ToString() + "\"" + "],";
            }
            strEvents = strEvents.Remove(strEvents.LastIndexOf(","));
            strEvents += "]";

            ViewBag.locpoints = strEvents;

            return PartialView(dt);
        }

//in the partial view page
<script type="text/javascript">
       function mapInit(Viewbag.locpoints) {

              var arr = $.parseJSON(Viewbag.locpoints);
              //more code which assigns a map to div map below 
       }
</script>

<div id="map" class="map"></div>

부분 뷰가로드 될 때 어떻게 JS 함수를 호출하여 맵을 렌더링 할 수 있습니까? 컨트롤러의 부분 메서드는 JS 함수에서 매개 변수로 사용되는 문자열을 반환합니다. 희망을 갖기를 바랍니다.


왜 JQuery를 사용하는 것처럼 보일 까?

<script type="text/javascript">
       $(document).ready(function(){
              var arr = $.parseJSON("@Viewbag.locpoints");
              //more code which assigns a map to div map below 
       });
</script>

ViewBag 값을 참조한 방법을 변경 한 ViewBag JavaScript에서 문자열 리터럴이 아닙니다.

또한 JSON 직렬 변환기를 사용하여 데이터를 JSON으로 변환하는 것을 고려하십시오. 위에서 한 것처럼 수동으로 수행하는 것은 나쁜 습관으로 간주됩니다.


정의한 후에는 호출 만하면됩니다. 그러나 JS 함수 정의에 MVC Viewbag 값을 포함하는 것처럼 보입니다. JS 메서드를 호출 할 때 이러한 값을 전달해야합니다.

<script type="text/javascript">
       function mapInit(locPoints) {    
              var arr = $.parseJSON(locPoints);
              //more code which assigns a map to div map below 
       }
       mapInit(@(Viewbag.locpoints));
</script>

참고 : 여기서는 jQuery가로드되었다고 가정합니다.


onSuccess Ajax Option을 사용하고 jquery가 작성된 자바 스크립트 함수를 사용하는 것을 고려해보십시오. 예를 들어, 부분 뷰를 호출하는 mainView에 작성된 다음 스크립트가 있습니다. 부분 뷰의 앵커 태그를 클릭했을 때 무언가를하고 싶다고 가정 해보십시오

var fromPartial=function()
            {
                var v = $(this).closest("div");
                var mId = v.attr('id');
                if (mId == 'divDetail') {
                    event.preventDefault();
                    //what you want to achieve
                }
            }

이제 부분 뷰에서 앵커 태그가 아래와 같이 생성됩니다.

           @Ajax.ActionLink("Select", "AssignSpeaker", new { 
        conferenceId = ViewBag.ConferenceId, sessionId = session.Id },
                                 new AjaxOptions() { HttpMethod="Get",
     InsertionMode= InsertionMode.Replace, UpdateTargetId="yourTarget",
 OnSuccess="fromPartial" })

컨트롤러를 JQuery를 통해 호출 해보십시오.

$(document).ready(function () {
 $.ajax({
            type: 'GET',
            url: 'your_controller_url',
            success: function (data) {

                //Do your stuffs here
            }
        });
}

이렇게하는 유일한 방법은 JQuery를 사용하여 컨트롤러 액션을 호출하고 부분 뷰를 반환하는 것입니다. Jquery를 사용하여 부분 뷰가 이동하는 페이지의 모든 섹션을 업데이트 한 다음지도를 렌더링 할 javascript 메서드를 호출하십시오.





partial-views