2010-09-08 68 views
0

我正在開發快速項目,列出來自bing的搜索結果,我的目標是用戶可以保存他們執行的搜索。但是我設法在模板中列出搜索結果,並且現在想要使用AJAX將結果項目保存到數據庫!這是我第一次嘗試使用ajax(jquery)和django!Django,帶有jQuery Basic幫助!

模板

{% 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的很多教程,但其中大部分我都挺過來了,主要足以膚淺離開我與開放性的問題,以及!

+0

我真的很想刪除它,我想出了第一個問題,但沒有第二個問題!我想我需要完成完整的例子週四沒有一半未完成的例子,並在這裏列出,當我感覺到它的錯誤:(我的困惑主要來自每個django-ajax教程帶有不同的技術(主要是未完成的教程週四):( – Hamza 2010-09-08 17:37:22

回答

2

你顯然必須有一個模型來存儲搜索和用於輸入用戶輸入的表單(搜索字符串)。

這將創建一個數據庫表,它將保存已保存的搜索詞並將搜索詞與特定用戶相關聯。

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,並使用簡單的HttpResponse將其與特定的mimetype mimetype="application/json"一起返回。

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; 
    }); 
}); 

這不是測試,但我希望它灑在過程中的一些光。

+0

謝謝,它不完全我需要什麼,但你的解釋我相信我會給它更多的嘗試,並使其工作,特別感謝您的解剖視圖...將盡快回來,因爲我讓它工作 – Hamza 2010-09-08 17:48:48

+0

哦,你的意思是分別保存每個結果項目不是查詢字符串? – 2010-09-08 17:55:01

+0

-1表示'明顯' – thumbtackthief 2013-11-05 18:54:37

0

您應該簽出一個JSON-RPC庫,如rpc4django。這允許你通過ajax從JavaScript訪問python函數。一個好的RPC庫使AJAX變得非常簡單。

+0

RPC4django,對我來說有點高級,剛剛從web1.0 django轉到web2.0,在AJAX動力項目中進行測試,考慮Adjax或Dajax,但首先會以獨立的jquery爲例! – Hamza 2010-09-08 17:51:25