django：在同一页面中接受输入并显示输出

Posted 2023-02-24

【中文标题】django：在同一页面中接受输入并显示输出

【英文标题】：django: taking input and showing output in the same page

【发布时间】：2013-01-28 00:58:19

【问题描述】：

我对 django 很陌生，并且努力做一些非常简单的事情。 我有以下型号的ModelForm：

class Queries(models.Model):
    user_id=models.CharField(max_length=200)
    query=models.CharField(max_length=200)

我正在向用户展示一个简单的表单，这将有助于执行以下操作：

用户会问一个问题

将处理问题（将生成数据库查询 基于问题）

那么查询结果应该显示在表格的正下方 同一页。

这就是我的 views.py 的样子：

from django.http import HttpResponse
from django.shortcuts import get_object_or_404, render
from basicapp.models import QueryForm

def index(request):
    form=MyForm()
    real_form=form.getForm(request)
    response=form.response
    return render(request,'basicapp/index.html',
        'form': real_form,
        'response':response,
    )
class MyForm:
    response=''
    def getForm(self,request):
        form = QueryForm(request.POST)
        if form.is_valid():
            response=form.cleaned_data['query']
            form.save()
        return form

现在我正在尝试简单的东西，我正在获取表单查询字段中的值并尝试将其发送回页面；到目前为止我失败了。 这是 index.html：

<form action=" " method="post">% csrf_token %
 form 
<p>response</p>
<input type="submit" value="Submit" />
</form>

如果我能做到这一点，我认为查询内容不会那么困难。表单工作正常，数据正在保存在数据库中。提交表单后，无法在index.html 中检索到来自views.py 的response 字符串。你能帮忙吗？

编辑： 根据霍夫的回答在index.html 中尝试了以下操作：

<form id="myForm" action=" " method="get">% csrf_token %
     form 
    <input type="submit" value="Submit" />
</form>
<div id="response">
</div>
<script language="javascript">
    $(document).ready(function() 
        $("#myForm").submit(function()  // catch the form's submit event
            $.ajax( // create an AJAX call...
                data: $(this).serialize(), // get the form data
                type: $(this).attr('GET'), 
                success: function(response)  // on success..
                    $("#response").html(response); // update the DIV
                
            );
            return false;
        );
    );
</script>

仍然没有运气:(

【问题讨论】：

您应该使用 GET 而不是 POST。我认为您进行了搜索

【参考方案1】：

<input type="text" name="query" />
<input type="submit" name="submit" value="Submit" />

您可以检查表单是否已提交（即是否为发布请求）：

if 'submit' in request.POST: #you could use 'query' instead of 'submit' too
    # do post related task
    # add context variables to render post output
    # add another context variable to indicate if it's a post
    # Example:
    context.update('post_output': request.POST.get('query',''))
...
return render(request, 'index.html', context)

然后在模板中，检查上下文变量post_output是否存在，如果确实显示输出：

% if post_output %
    Output:  post_output 
% endif %

---

简而言之，逻辑是：

检查您的视图中是否存在相关的request.POST dict 键。 如果key存在，那么就是post请求；添加发布相关的上下文变量并执行发布相关的任务。 检查模板中是否有任何帖子相关的上下文变量可用，如果有，则显示帖子相关的输出。

如果您不想在发布后仅刷新页面时显示输出，请将 request 对象传递给模板并进行如下检查：

% if request.POST.submit and post_output %

【参考方案2】：

views.py

def index(request):
    questions=None
    if request.GET.get('search'):
        search = request.GET.get('search')
        questions = Queries.objects.filter(query__icontains=search)

        name = request.GET.get('name')
        query = Queries.object.create(query=search, user_id=name)
        query.save()

    return render(request, 'basicapp/index.html',
        'questions': questions,
    )

html

<form method="GET">
    Question: <input type="text" name="search"><br/>
    Name: <input type="text" name="name"><br/>
    <input type="submit" value="Submit" />
</form><br/><br/>


% for question in questions %
<p>question</p>
% endfor %

【讨论】：

整个代码：P 所有这些都应该驻留在views.py 中还是html 部分应该在index.html 中？如果那是我的 ModelForm 被使用的地方？

当用户提交问题“if”条件将被触发并开始搜索该问题。输出：它将显示包含您提交内容的问题列表。

感谢凯茜的解释 :)

我想保存用户刚才提出的问题，我的意思是应该保存'搜索'的东西。

我要澄清一下，您是否在用户进入索引之前对其进行了身份验证？或者他们是匿名用户？

【参考方案3】：

按照霍夫的回答...

将 URL 属性添加到 ajax 调用：

$(document).ready(function() 
    $("#myForm").submit(function()  // catch the form's submit event
        $.ajax( // create an AJAX call...
            data: $(this).serialize(), // get the form data
            type: $(this).attr('GET'),
            url: '/URL-to-ajax-view/',
            success: function(response)  // on success..
                $("#response").html(response); // update the DIV
            
        );
        return false;
    );
);

views.py 中的一些 ajax 处理程序：

# /URL-to-ajax-view/
def ajax_get_response(request):
    if request.method == "GET" and request.is_ajax:
        form = QueryForm(request.POST or None)
        if form.is_valid():
            form.save()
            return HttpResponse(form.response)  
    raise Http404

试过类似的方法吗？

【讨论】：

告诉我进展如何：)

【参考方案4】：

您需要的是一个异步帖子 (ajax)，使用 jQuery 很容易，请参阅此答案以获得完整的解决方案：How to POST a django form with AJAX & jQuery