JavaScript가 별도의 파일에서 작동하지 않습니다.

Question

JS를 페이지에 직접 배치하는 대신 별도의 파일로 이동하려고합니다. 하지만, 어떤 이유로, 나는 그것을 작동시키지 못합니다.

드롭 다운 선택에 따라 사이트를 업데이트하고 싶습니다.

보기 :이이 작동

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#EntityType").change(function() { 
     /* Get the selected value of dropdownlist */ 
     var selectedID = $(this).val(); 

     /* Request the partial view with .get request. */ 
     $.get('/Entity/Create_DropDownList/' + selectedID, function (data) { 

      /* data is the pure html returned from action method, load it to your page */ 
      $('#entity_form_attributes').html(data); 
      /* little fade in effect */ 
      $('#entity_form_attributes').fadeIn('fast'); 
     }); 
    }); 
}); 
</script> 

    <div class="editor-field"> 
     @Html.DropDownList("EntityType", (SelectList)ViewData["Types"]) 
    </div> 

    <div id="entity_form_attributes"></div> 

내가 지금하고 있어요 방법은 이것이다. 부분 뷰는 div 태그에로드됩니다. 그러나 JavaScript 파일을 만든 다음 스크립트를 파일로 이동하면 실패합니다. 공유 시작 사이트에서 자바 스크립트 파일을 포함합니다.

내가 잘못하고있는 것을 누구든지 볼 수 있습니까? 응용 프로그램은 MVC3 응용 프로그램입니다. 이 작품을 만들기 위해 설정해야 할 설정/속성이 있습니까?

Answer 1

누구든지 잘못하고있는 것을 볼 수 있습니까?

예, URL 생성기를 사용하는 대신 여기에 URL을 하드 코드했습니다. 다음과 같이하면 안됩니다 :

$.get('/Entity/Create_DropDownList/' 

URL이 잘못되어 응용 프로그램을 배포하면이 기능이 중단됩니다. 이 하드 코딩 된 URL로 인해 처음부터 가상 디렉터리 이름을 포함하지 않았습니다.

ASP.NET MVC 응용 프로그램에서 URL을 처리 할 때 항상 URL 도우미를 사용하십시오.

@Html.DropDownList(
    "EntityType", 
    (SelectList)ViewData["Types"], 
    new { data_url = Url.Action("Create_DropDownList", "Entity") } 
) 

을 한 다음 별도의 자바 스크립트 파일에 간단하게이 URL을 검색하고 사용 : 그래서 귀하의 경우에 당신은 HTML5 data-* 속성으로보기에서이 URL을 생성 할 수

$("#EntityType").change(function() { 
    /* Get the selected value of dropdownlist */ 
    var selectedID = $(this).val(); 

    /* Get the url from the data-url HTML attribute */ 
    var url = $(this).data('url'); 

    /* Request the partial view with .get request. */ 
    $.get(url, { id: selectedID }, function (data) { 
     /* data is the pure html returned from action method, load it to your page */ 
     $('#entity_form_attributes').html(data); 
     /* little fade in effect */ 
     $('#entity_form_attributes').fadeIn('fast'); 
    }); 
});