2010-05-30 8 views
0

AJAX 링크가있는 콘텐츠를 반환하는 양식이있는 iFrame을 사용하고 있습니다.
그런 다음 반환 된 콘텐츠를 iFrame에서 기본 페이지로 이동합니다.AJAX 링크가 iFrame 밖으로 이동하면 어떻게 작동합니까?

그러나 링크를 클릭하면 ajax 링크가 작동하지 않고 "Element is null"오류가 생성됩니다.

iFrame에서 콘텐츠를 이동하면서 AJAX 링크가 작동하도록하려면 어떻게해야합니까?

<span id="top"> 
    <a id="link8" onclick=" event.returnValue = false; return false;" href="/item_pictures/delete/7"> 
     <img src="/img/delete.bmp"/> 
    </a> 

    <script type="text/javascript"> 
     parent.Event.observe('link8', 'click', function(event) { 
      new Ajax.Updater('top','/item_pictures/delete/3', { 
       asynchronous:true, evalScripts:true, 
       onCreate:function(request, xhr) { 
        document.getElementById("top").innerHTML = "<img src=\"/img/spinner_small.gif\">"; 
       }, 
       requestHeaders:['X-Update', 'top'] 
      }) 
     }, false); 
    </script> 

</span> 

답변

0

내가 한 것은 외부 js 파일로 AJAX 호출을 이동하고 링크를 클릭하면 함수를 호출하는 것입니다. 이제 작동합니다.

0

난 당신의 코드에 두 가지 문제를 참조하십시오

다음은 iFrame에 의해 반환되는 코드입니다.

첫 번째 솔루션 (나는 :-) 생각)

당신은 iframe로드, 거기에 자바 스크립트가 실행

. Javascript는 관찰자를 부모 문서의 link8에 연결합니다.

관찰자 내부에서 다른 함수 (onCreate)를 정의합니다. 이 함수는 iframe 컨텍스트에서 실행되며 문서 객체는 주 문서가 아닌 iframe을 참조합니다. iframe에서 link8을 제거하여 주 문서로 이동하면 document.getElementById ("top")는 null이되므로 오류가 발생합니다. 당신이 주요 문서 (스크립트 포함) 전체 범위를 이동하는 경우, 자바 스크립트가 실행됩니다 (즉 정말이 특정한 경우에 문제가되지 않습니다)

parent.document.getElementById("top").innerHTML = "<img src=\"/img/spinner_small.gif\">"; 

두 번째 문제 :

아마로 변경 다시 주 문서의 맥락에서. 귀하의 경우 부모가 null (또는 유사한)이라는 내용의 내용을 이동 한 후에 오류 또는 경고가 표시되어야합니다.

두 번째 문제를 제거하려면 iframe 데이터를 두 div 등으로 반환하십시오. 그런 다음 div로만 div를 주 문서로 복사하십시오.

+0

고맙습니다, 루크. "부모"접두어를 추가하면 실제로 "요소가 null입니다."라는 문제가 제거되었습니다. 그러나 AJAX는 여전히 실행되지 않았습니다. 오류 없음. 내가 한 일은 AJAX 호출을 외부 js 파일로 이동시키고 링크가 클릭되면 함수를 호출하는 것입니다. 이제 작동합니다. – KcYxA

관련 문제