我想为我的网页创建一个基于AJAX的搜索。到目前为止,我能够发送表单数据并对我的Django模型进行适当的调用。我正在努力的只是发送Queryset并使用Django模板系统进行渲染。非常感谢您的帮助/建议。
以下是我正在使用的代码。
views.py
if request.is_ajax():
if request.method == 'POST':
format = 'json'
mimetype = 'application/json'
try:
q = request.POST['obj']
o = Object.objects.filter(name__icontains=q)
return render_to_response( 'project_view_objects.html', {'username': request.user.username, 'results':o})
view.html
<script>
$(document).ready(function(){
$("#search_form").submit(function(event)
{
event.preventDefault();
$.ajax({
type: "POST",
url: "/objects/search/",
data: $(this).serialize(),
processData: false,
dataType: "json"
});
});});
</script>
<article>
<blockquote>
<form class="create_form" id="search_form">
<p>
<input id="objectSearchNameInput" type="text" name="obj" value="Object name">
<input type="submit" value="search objects">
</p>
</form>
</blockquote>
</article>
<br />
{% if results %}
<blockquote>
<aside class="column">
{% for object in results %}
<b><a href="#" class="extra-text-special">{{ object.name }}</a></b><br />
{% endfor %}
</aside>
<aside class="column">
{% for object in results %}
<font class="extra-text-nospecial">{{ object.created_when }}</font><br />
{% endfor %}
</aside>
</blockquote>
{% else %}
<p>haha</p>
{% endif %}
目前,我在网页上看到的所有内容都是“哈哈”。
答案 0 :(得分:5)
你遗漏的是,在AJAX被解雇时,模板已经被渲染了 - 当然它必须是,因为模板是服务器端的,而javascript是客户端的。
所以要做的是让你的Ajax视图不返回JSON,而是渲染模板,然后你的Javascript回调就会插入到模板中。
答案 1 :(得分:2)
这是最终答案
蟒
if request.is_ajax():
if request.method == 'POST':
format = 'json'
mimetype = 'application/json'
try:
q = request.POST['obj']
#message = {"object_name": "hey, you made it"}
o = Object.objects.filter(name__icontains=q)
except:
message = {"object_name": "didn't make it"}
#m = str(q['id'])
#json = simplejson.dumps(message)
#data = serializers.serialize(format, o)
#return HttpResponse(data, mimetype)
html = render_to_string( 'results.html', { 'username': request.user.username, 'objects': o } )
res = {'html': html}
return HttpResponse( simplejson.dumps(res), mimetype )
HTML
<script>
$(document).ready(function(){
$("#search_form").submit(function(event)
{
event.preventDefault();
$.ajax({
type: "POST",
url: "/objects/search/",
data: $(this).serialize(),
processData: false,
dataType: "json",
success: function( data ){
$( '#results' ).html( data.html );
}
});
});});
</script>
。 。
<article>
<blockquote>
<form class="create_form" id="search_form">
<p>
<input id="objectSearchNameInput" type="text" name="obj" value="Object name">
<input type="submit" value="search objects">
</p>
</form>
</blockquote>
</article>
<br />
<aside id="results">
</aside>
答案 2 :(得分:-1)
我的解决方案是使用Dajax,创建小片段模板,例如渲染列表。然后在Dajax函数中渲染它们,并使用适当的javascript调用将它们写入文档中。你可以看到一个例子(实际上dajax的所有文档都非常好): http://www.dajaxproject.com/pagination/
我最近发现的另一种解决方案(但我自己没试过)是: http://www.jperla.com/blog/post/write-bug-free-javascript-with-pebbles
最后你可能完全采用其他方式并使用Backbone.js,但这样你(或多或少)最终会遇到同样的问题,如何与django模板共享主干模板(我认为你应该能够编写一个模板标签,它依赖于'模式'写入值或骨干模板标签,从而允许您重复使用模板)