【问题标题】:Django: create a "changing button" or waiting pageDjango:创建“更改按钮”或等待页面
【发布时间】:2015-05-04 10:10:15
【问题描述】:

我有一个名为 c.py 的外部 python 程序,它“计数”最多 20 秒。 我从我的 Django 应用程序 views.py 中调用它,在 html 页面中我有一个按钮来启动它。没关系(= 在 Eclipse 中,当我按下网页上的按钮时,我可以看到 c.py 打印 0,1,2,3,...20)但我希望按钮从“GO”变为“WAIT” " 在 c.py 过程中(或者我想在计数期间执行等待页面或弹出窗口)。

c.py

import time

def prova(z):
    z = 0
    while z < 20:
        time.sleep(1)
        z = z + 1
        print(z)

views.py

    from django.shortcuts import render_to_response
    #etc.

    import c


def home_user(request):
    return render_to_response('homepage/home.html',{'user.username':request}, context_instance = RequestContext(request))

def conta(request):
    c.prova(0)
    return redirect(home_user)

如果 conta 函数正在运行,我想在 homepage.html 中的哪个位置更改“等待”中的“GO”按钮。

urls.py

        urlpatterns =patterns('',
    url(r'^homepage/home/$', views.home_user, name='home'),
    #etc.
    url(r'^conta', views.conta, name='conta'),


)

home.html

{% if c.alive %}
<a href="" class="btn btn-danger" role="button">WAIT</a>
{% else %}
<a href="/conta/" class="btn btn-primary" role="button">GO</a>
{% endif %}

我没有放整个代码..我希望这足以理解我的麻烦。 我也看到How to create a waiting page in Django,但我会从更简单的开始。

到目前为止,当我启动 c.py 时,我看到我的网页正在加载一些东西(=它正在“计数”),但我的按钮没有改变,之后 strong> c.py 执行,我返回 127.0.0.1:8000/homepage/home/ 页面。 是 html 中的问题还是我的函数定义中的问题,或两者兼而有之?

更新

我尝试简化问题: 我找到了这个脚本...

    <button onclick="myFunction()">Try it</button>

<p id="demo"></p>

<script>
function myFunction() {
    var text = "";
    var i = 0;
    while (i < 10) {
        text += "<br>The number is " + i;
        i++;
    }
    document.getElementById("demo").innerHTML = text;
}
</script>

我想在 while 中“导入”我的 conta() 函数,而不是 i++ 中的 cicle

即我想要一个类似的东西: 当 conta() 运行时,出现类似

Waiting..

当它停止时我返回我的主页.. 我不知道如何在脚本中“放置”conta() .. 这可能吗?我是梦想家吗? :)

【问题讨论】:

    标签: javascript python django


    【解决方案1】:

    您正在尝试检查客户端上的服务器端值,但问题是 if c.alive 语句仅在您的视图呈现时才被评估 - 而不是 c 的状态更改。

    您需要能够通过 ajax 长轮询或 WebSockets 向客户端报告 c 的状态,或者,如果您不关心 c 的增量状态而只想更改链接的文本,当链接的点击事件触发时,您需要使用 JavaScript 设置值:

    // assuming jQuery for brevity...
    
    $(document).ready(function() {
    
        // avoid hard-coding urls...
        var yourApp = {
            contaUrl: "{% url 'conta' %}"
        };
    
        $('#btnGo').click(function(e) {
            e.preventDefault();  // prevent the link from navigating
    
            // set css classes and text of button
            $(this)
                .removeClass('btn-primary')
                .addClass('btn-danger')
                .text('WAIT');
    
            $.get(yourApp.contaUrl, function(json) {
                 window.top = json.redirect;
            });
        });
    });
    

    但是...您的 conta 函数需要返回 JsonResponse 而不是 HttpResponse 才能在客户端进行重定向:

    from django.core.urlresolvers import reverse
    from django.http import JsonResponse
    
    def conta(request):
        c.prova(0)
        redirect = reverse('name_of_home_user_view')
        return JsonResponse({'redirect': redirect})
    

    【讨论】:

    • 目前对我来说非常模糊......我在哪里可以研究这些论点?请给我一些链接来推荐我吗?
    • 不,不是。这是一个相当基本的概念。您有一个在服务器端执行的进程,您的模板对此一无所知,除非它通过 Ajax 与服务器端通信。
    • 好的,我理解这个概念。我指的是我还不知道的jquery代码语法。
    • 啊,这很容易 - jquery.com :)
    • 嗯,你需要在你的主页 url 模式中添加一个名称参数,在主页上包含 JavaScript,在链接中添加一个 id 参数,重构 HTML ......很多东西。我的例子只是为了让你朝着正确的方向前进。
    【解决方案2】:

    我发布了我的工作解决方案。感谢@Brandon 提供有用的答案。

    conta.js 中进行了一些更改:

    $(document).ready(function() {
    
        // avoid hard-coding urls...
        var yourApp = {
            contaUrl: "/conta/"
        };
    
    
        $('#btnGo').click(function(e) {
            e.preventDefault();  
            // set css classes and text of button
            $(this)
                .removeClass('btn-primary')
                .addClass('btn-danger disabled') // with *disabled* I'm sure that the button is not clickable
                .text('WAIT');
    
    
    
            $.get(yourApp.contaUrl, function(json) {     
                 alert("I have finished counting");                    
                 parent.window.location.reload(true);               
    
    
            });
        });
    });
    

    views.py

    def conta(request):
        c.prova(0)
        redirect = reverse('home')                  
        return JsonResponse({'redirect': redirect})
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2019-12-28
      • 1970-01-01
      • 2012-05-18
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多