Включить шаблон Django с Ajax - PullRequest
Новая
       8

Включить шаблон Django с Ajax

0 голосов
/ 28 октября 2018

Я использую mmenu из jquery в своем приложении Django, и я загружаю подстраницы с помощью iframes.Все работает нормально, но я хотел бы удалить iframes и загрузить контент с помощью ajax, чтобы позволить пользователю использовать приложение без перезагрузки всей страницы после нажатия меню.

template - home_desktop.html 

{% load compress %}
{% load static %}
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width initial-scale=1.0 maximum-scale=1.0 user-scalable=yes" />  
        <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
        {% compress css %}
        <link rel="stylesheet" href="{% static "style.css" %}" >
        <link rel="stylesheet" href="{% static "menu-nav.css" %}" >
        <link rel="stylesheet" href="{% static "jquery.mmenu.all.css" %}" >
        {% endcompress %}
        {% compress js inline %}
        <script src="{% static "scripts/jquery-3.3.1.js" %}"></script>
        {% endcompress %}
        {% compress js inline %}
        <script src="{% static "jquery.mmenu.all.js" %}" ></script>
        <script src="{% static "./script.js" %}" ></script>
        {% endcompress %}
    </head>
    <!-------------- BODY -------------->        
    <body>
        <!-------------- MENU -------------->   
        <nav id="menu">
            <div id="panel-information">
                <ul>
                    <li class="Divider">Bck/K</li>
                            <li><a id="2">News</a>                
                            <li><a id="4">Events</a></li>
                </ul>
            </div>
        </nav>
        <!-------------- END OF MENU -------------->   
        <!-------------- INTERFACE --------------> 
            <div id="inferface">            
                <div class="interface " id="interface-section2-information-rss">                      
                    <iframe class="iframe-width" src="{% url 'all_feeds' %}" >
                    </iframe>
                </div>   
                <div class="interface hidden" id="interface-section2-information-events">
                    <iframe class="iframe-width" src="{% url 'events' %}">
                    </iframe>
                </div>              
            </div>
        <!-------------- END OF INTERFACE --------------> 
        <!--------------- SCRIPTS ------------------> 
        <script>
               jQuery('#2').click(function(){
               jQuery('.interface').addClass('hidden');
               jQuery('#interface-section2-information-rss').removeClass('hidden');
        });</script>
        <script>
               jQuery('#4').click(function(){
               jQuery('.interface').addClass('hidden');
               jQuery('#interface-section2-information-events').removeClass('hidden');
        });
        </script>
    </body>
</html>

просмотров.py 

def all_feeds(request):
    feeds_all_query = Feeds.objects.all().filter(rss_is_published=True).order_by('-rss_published_date','-rss_published_time')
    return render(request, 'rss_reader.html', {'rss_feeds':feeds_all_query,})

Спасибо за любую помощь!

...