Django，在 jQuery Basic 的帮助下！

Question

我正在做一个快速项目，列出来自 bing 的搜索结果，我的目标是用户可以保存他们执行的搜索。但是我设法在模板中列出搜索结果，现在想使用 AJAX 将结果项保存到数据库中！好吧，这是我第一次尝试使用 ajax (jquery) 和 django！

模板

{% for result in results %}<div class="resimgb">
    <a href="{{ result.MediaUrl }}"><img src="{{ result.Thumbnail.Url }}" /></a>
    <br />
    <input type="text" value="{{ result.MediaUrl }}" id="#urlink">
    <input type="submit" id="#savethis" name="add"></span><a herf="#" id="">save</a></div>{% endfor %}

JS：

<script type="text/javascript">
 $( document ).ready( function() {
  $( '#savethis' ).click( function() { data = 
            $( '#urlink' ).val(); $.get("/save/", function(data) {
              alert(data); 
          }); 
    }); 
}); 
</script>

-

我不写视图，因为我实际上卡在那里！从这里开始对我来说很复杂，因为在

中我有点困惑

• 如何将数据保存到我的模型中？
• 如何向模板发送响应以确认保存结果？
• 作为 jquery 的新手，我知道在循环中使用 id 是非常错误的，谁能建议如何解决这个问题？

---

关于 Django / jQuery 的教程有很多，但我读过的大部分教程都非常肤浅，给我留下了悬而未决的问题！！

Answer 1

您显然必须有一个用于存储搜索的模型和一个用于获取用户输入（搜索字符串）的表单。

这将创建一个数据库表，该表将保存保存的搜索词并将搜索词与特定用户相关联。

models.py

class Search(models.Model):
    user = models.ForeignKey(User)
    search = models.CharField(max_length=255)

最简单的方法是创建一个模型表单，该表单将具有输入字段，用户可以在其中编写搜索词，并且还验证发布的数据，因为所有用户输入都应该得到验证：

forms.py

class SearchForm(forms.ModelForm):
    class Meta:
          model = Search

当您使用 AJAX 调用从表单将表单数据发布到保存视图时，发布数据将被验证，在您搜索数据后，带有搜索词的实例将保存在数据库中。

剩下要做的就是将上下文字典中的所有数据发送到您的模板并渲染它。 渲染后，您可以使用数据构造一个字典，将其转储到 JSON 并使用具有特定 mimetype mimetype="application/json" 的简单 HttpResponse 返回它。

views.py

def save(request):
    if request.method == 'POST':
        form = SearchForm(request.POST):
        if form.is_valid():
             # Do some search with forms.cleaned_data['search'] and save it to result
             result = #SomeSearchCode...
             instance = form.save()

    html = render_to_string('ajax_template.html', {'search':instance, 'result':result}, RequestContext(request))
    if request.is_ajax():
         response = {'result':"Success", 'html':html}
         return HttpResponse(json.dumps(response), mimetype="application/json")
    retrun render_to_response('full_template.html', {'html':html }, RequestContext(request)

模板

至于模板，full_template.html 是显示搜索表单的模板，并包含 ajax_template.html 以显示结果，因此我们可以轻松地使用 JavaScript 附加它。这样即使没有 JavaScript 也能正常工作。

jQuery

AJAX 调用也是直截了当的。您从表单中收集数据并将其与data 一起发送到视图，视图将以request.POST 接收它。 success 用于处理您从保存视图返回的数据。在此示例中，它将视图中呈现的 html 附加到某个随机 div。

var dataString = 'search='+ $("search-field").val();;
$(function() {
    $("#search-form").live("click", function() {
        $.ajax({
            type: "POST",
            url:  $("#search-form").attr("action"),
            data: dataString,
            dataType: "json",
            success: function(data, textStatus, XMLHttpRequest) {
                jQuery(data["html"]).appendTo(".some-div");
            }
        });
        return false;
    });
});

这没有经过测试，但我希望它对这个过程有所帮助。

Answer 2

您应该查看 JSON-RPC 库，例如 rpc4django。这使您可以通过 ajax 从 javascript 访问 python 函数。一个好的 RPC 库使 AJAX 变得非常简单。