Django + Jquery, AJAX div 확장

사용자가 링크를 클릭하면 AJAX를 통해 링크를로드하는 링크 바로 아래 div를 열 수 있습니까?Django + Jquery, AJAX div 확장

도움 주셔서 감사합니다. 나는 어떻게하는지 알 수 없다. 페이지를로드하는 동안 서버 측에서 div를 정적으로 채우는 것만으로도 문제가 없지만 너무 많은 내용을 담고 있습니다.

누군가가 가지고있는 경우 특정 장고 버전의 솔루션을 찾고 있습니다. 이 같은

2009-08-09 CharlesS

jQuery.load이 정확하게 수행 작동합니다

$("div#my-container").load("/url/to/content/ #content-id")

이, /url/to/content/에서 콘텐츠를 가져 오는 #content-id하여 필터링하고 div#my-container에 결과를 주입한다.

편집 : 모든 클라이언트 측에 있기 때문에 Django에 관한 구체적인 내용은 없습니다. 하지만 당신은 ...

templates/base.html

<html> 
    <head> 
     <title>My funky example</title> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
     {% block extrahead %}{% endblock %} 
    </head> 
    <body> 
     {% block content %}{% endblock %} 
    </body> 
</html>

templates/page.html

{% extends "base.html" %} 
{% block extrahead %} 
    <script type="text/javascript"> 
     $(function(){ 
      $('a.extendable').click(function(){ 
       $(this).after($('<div class="external-content"></div>').load($(this).attr('href') + ' #content')); 
       return false; 
      }); 
     }); 
    </script> 
{% endblock extrahead %} 
{% block content %} 
    <p>Hi! <a href="/external/content/a/" class="extendable">Click here</a> and wait for something funny to happen!</p> 
    <p><a href="/external/content/b/" class="extendable">This link</a> is cool, too!</p> 
{% endblock content %}

templates/a.html

{% extends "base.html" %} 
{% block content %} 
    <div id="content">so long and thanks for all the fish</div> 
{% endblock %}

templates/b.html

,691을 주장하는 경우

{% extends "base.html" %} 
{% block content %} 
    <div id="content">Don't panic</div> 
{% endblock %}

은

from django.conf.urls.defaults import * 
urlpatterns = patterns('django.views.generic.simple', 
    (r'^$',     'direct_to_template', {'template': 'page.html'}), 
    (r'^external/content/a/$', 'direct_to_template', {'template': 'a.html'}), 
    (r'^external/content/b/$', 'direct_to_template', {'template': 'b.html'}), 
)

당신은 모든 코드 here을 다운로드 할 수 있습니다.

출처

2009-08-09 21:13:59

뭔가

<html> 
<head> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
    <script type="text/javascript"> 
    function loadDiv() { 
     $.get("test.php", function(data){ 
      $('#thediv').html(data); 
     }); 
    } 

</script> 
</head> 
<body> 
<a href="javascript:loadDiv();">Load Div</a> 
<div id="thediv"></div> 

</body> 
</html>

출처

2009-08-09 21:08:58 Rob

Django + Jquery, AJAX div 확장

답변

관련 문제