2010-10-31 159 views
0

假設所有形式的應用程序具有這樣的結構:AJAX(jQuery的)響應

<div id="result_messages"></div> 
<form action="/action"> 
<!-- all the form --> 
</form> 

用於這種形式提交按鈕看起來是這樣的:

<input type="button" onclick="$.post('/action', $(form).serialize(), function (data) { 
    $('#result_messages').html(data);  // At this point the 'data' is an standard HTML with a message 
});" /> 

可是,卻並不總是響應消息......當數據信息或不如何檢測??????:

<input type="button" onclick="$.post('/action', $(form).serialize(), function (data) { 
    if (isMessage(data)) 
     $('#result_messages').html(data);  
    else 
     doActionWith(data); 
});" /> 

使用JSON可能的解決方案:

{ response_type : 'message', data: 'all_data_here' } 

{ response_type : 'nomessage', data: 'all_data_here' } 

其他的解決辦法是把一個特殊的字符串在開始的數據:

<!--message--><ul><li>form was processed</li></ul> 

你有沒有其他的想法?你對這個解決方案有什麼看法?

+1

你是什麼意思«不總是消息»?那是什麼,其他時間呢? – 2010-10-31 09:31:08

回答

0

有什麼選擇,除了簡單的html輸出? JSON?

如果是這樣,您可以發回一個對象並在回調中檢查它。

2

您對這個解決方案有什麼看法?

<input type="button" onclick="$.post("/action", $(form).serialize(), function (data) {

  1. 這將翻倒。 /action之前的報價將終止onclick屬性值
  2. 內聯JS是討厭的。將您的事件處理程序與外部腳本綁定。
  3. 如果JS不可用,這將不起作用。編寫一個可以工作的表單(使用常規的提交按鈕),然後用JS逐步增強。
  4. form是未定義的,應該是this.form
  5. /action重複你自己。寫更多的可重用代碼:this.form.action

使用JSON可能的解決方案

是。使用結構化的數據格式而不是一堆代碼推入頁面。

+0

這個問題的所有代碼都完全是說明性的......這有助於你理解問題 – 2010-10-31 09:40:03