MVC 3 App의 자동 데이터로드

Question

좋아, jquery/ajax로드 함수를 사용하여 데이터가 드롭 다운에서 동적으로로드되는 페이지가 있습니다. 이렇게하면 드롭 다운 선택이 변경되면 부분 뷰에서 모든 데이터가있는 격자를 동적으로로드 할 수 있습니다.

이 문제는 페이지가 처음으로로드 될 때 데이터가로드되어 j 선택로드 기능으로 전송되는 ID 선택이 없음을 의미합니다. 드롭 다운 목록 자체에 대한로드 함수를 추가하여이 문제를 해결하려고 했으므로로드 될 때 데이터보기가 다시로드되지만 아무런 소용이 없습니다. 나는 그것이 데이터가로드되기 전에 컨트롤이로드되기 때문이라고 생각합니다. 그러나 나는 무엇을 해야할지를 놓치고 있습니다. 지금까지 제가 가지고있는 코드는 다음과 같습니다.

내가 말했듯이

<script> 
$(document).ready(function() { 
    $.ajax({ 
      type: 'GET', 
      url: '@Url.Action("SessionsPartial", "Sessions")', 
      data: 'id=' + $("#ScheduleTypeId").value, 
      success: function (data) { 
       $('#SessionData').fadeOut().html(data).fadeIn(); 
      } 
     }); 
    $(function() { 
    $("#ScheduleTypeId").change(function() { 
     $.ajax({ 
      type: 'GET', 
      url: '@Url.Action("SessionsPartial", "Sessions")', 
      data: 'id=' + this.value, 
      success: function (data) { 
       $('#SessionData').fadeOut().html(data).fadeIn(); 
      } 
     }); 
    }); 
      }); 

    $(function() { 
     $("#ScheduleTypeId").load(function() { 
      $.ajax({ 
        type: 'GET', 
        url: '@Url.Action("SessionsPartial", "Sessions")', 
        data: 'id=' + this.value, 
        success: function(data) { 
         $('#SessionData').fadeOut().html(data).fadeIn(); 
        } 
       }); 
     }); 
    }); 
}); 

, 부하 부분과 마지막 부분은 내가 방금 추가, 그래서 비판 주시기 것입니다.

Answer 1

부분에 데이터를로드하는 액션 함수를 호출했지만 드롭 다운의 ID가 아닌 초기로드에서 모델의 ID를 보내 데이터가 비어있게로드했습니다.

값이 0인지 확인한 다음 가장 먼저 표시 될 항목의 ID를로드하도록 수정했습니다. 매력처럼 일했다.

Answer 2

처음으로 페이지를로드 할 때 실제로 데이터를로드하기 위해 AJAX 호출을 수행 할 필요가 없습니다. 당신은 단순히 그리드에 포함 된 부분 포함 할 수있다 : 새로 고침

<div id="SessionData"> 
    @Html.Partial("SessionsPartial") 
</div> 

하고 만 드롭 다운의 .change() 이벤트에 가입을 부분 :

문제는 아약스 기능이 참이었다이었다

<script type="text/javascript"> 
$(function() { 
    $('#ScheduleTypeId').change(function() { 
     $.ajax({ 
      type: 'GET', 
      url: '@Url.Action("SessionsPartial", "Sessions")', 
      cache: false, 
      data: { id: $(this).val() }, 
      success: function (data) { 
       $('#SessionData').fadeOut().html(data).fadeIn(); 
      } 
     }); 
    }); 
}); 
</script>