2014-11-12 2 views
0

메인 페이지는 .aspx 파일입니다. 팝업을 생성하려고합니다. 사용자가 이메일 보내기을 클릭하면 페이지의 자바 스크립트가 아래 표시된 openEmailPopup 함수를 호출합니다.동적으로 자바 스크립트 코드를로드하는 방법

function openEmailPopup(taskId, popupElementName, gridElementName) { 
$("#" + popupElementName).dialog({ 
    width: 1300, 
    height: 500, 
    draggable: false, 
    resizable: false, 
    modal: true, 
    open: function() { 
     $.get("/Resources/Sendmail", function (data) { 
      $('#masterPvlEmailGrid').html(data); 
     }); 

     //more code here... 
    } 
    }); 
} 

문제는 SendEmail.cshtml 파일이 일부 자바 스크립트 파일에 달려 있다는 것입니다.

아약스 호출의 응답이 반환되면 자바 스크립트 위의 응답이 실행되지 않습니다. 이를위한 두 가지 해결책이 있습니다. 어느 쪽이든 .aspx 페이지에 자바 스크립트 참조를 추가하십시오. 그러나 이렇게하려면 마스터 페이지에 콘텐츠 자리 표시 자 요소를 추가해야합니다. 큰 문제는 실제 aspx 파일에 다른 마스터 페이지의 2 배 깊이 중첩 된 마스터 페이지가 있다는 것입니다.

많은 사람들이 이러한 마스터 페이지를 사용하므로, 나는 그것을 만지기 전에 해결 방법이 있는지 확인하고 싶습니다.

동적으로 자바 스크립트 파일을로드하고 실행하는 방법은 무엇입니까? 나는 몇 가지 연구를 해왔지만 jquery로는 어떻게 작동하는지 아직도 이해할 수 없다.

아이디어가 있으십니까? 내가 그 파일을 전화 드렸습니다 방법

편집

이다.

$.getScript("/Scripts/file1.js", function() { 
}); 
$.getScript("/Scripts/file2.js", function() { 
}); 
$.getScript("/Scripts/file3.js", function() { 
}); 

Google 도구를 확인할 때로드되는 모든 파일이 표시됩니다. 당신은 RequireJS 같은 AMD (http://requirejs.org/)에서 볼 수도 있습니다

http://api.jquery.com/jquery.getscript/

+1

해당 문제에 대한 jQuery의 해결책은 [$ .getScript()] (http://api.jquery.com/jQuery.getScript/)입니다. 자신이 적절한 체인을 구현함으로써 스크립트 간의 종속성을 관리해야합니다. –

답변

1

. RequireJS는 필요에 따라 JavaScript 리소스를로드하도록 설계되었으므로 기본 페이지에서로드하지 않아도됩니다. 귀하의 예제에서 귀하의 팝업 양식에 대해 세 파일 모두 비동기 적으로 반환 될 수 있습니다.

+1

위의 경우로드해야하는 파일이 3 개 있습니다. 각 파일마다 3 건의 아약스 호출이 발생합니까? – Richard77

1

: 당신은 HTTP를 통해 자바 스크립트를로드 한 다음 실행할 수 있습니다 jQuery의 getScript 방법을 사용할 수 있습니다

0

지금 테스트 할 수 없기 때문에 문제가 해결 될지 확실하지 않습니다. 이걸 시험해 볼래?

function openEmailPopup(taskId, popupElementName, gridElementName) { 
    $("#" + popupElementName).dialog({ 
     width: 1300, 
     height: 500, 
     draggable: false, 
     resizable: false, 
     modal: true, 
     open: function() { 

      var deferreds = []; 

      //Store a deferred into the array 
      function addDeferred(url) { 
       deferreds.push(
        $.getScript(url) 
        .done(function() { 
         console.log("Module loaded: " + url); 
        }) 
        .fail(function(ex) { 
         console.error(ex); 
        }) 
       ); 
      }; 

      //Call the scripts 
      addDeferred("/Scripts/file1.js"); 
      addDeferred("/Scripts/file2.js"); 
      addDeferred("/Scripts/file3.js"); 


      //When all the scripts has been loaded.... 
      $.when.apply($, deferreds) 
       .done(function() { 
        $.get("/Resources/Sendmail", function(data) { 
         $('#masterPvlEmailGrid').html(data); 
        }); 
       }) 
       .fail(function(ex) { 
        console.log(ex); 
       }); 

      //more code here... 
     } 
    }); 
} 
관련 문제