從服務器jQuery ajax處理請求

-1

所以我有點新jQuery與ajax。基本上，該頁面發送一個http文章，服務器端dll以json格式向該頁面寫入響應。我想弄清楚如何處理這個響應的響應。到目前爲止，當我到達網站並填寫所有信息時，點擊提交，然後發佈到iis web服務器頁面並處理請求並序列化爲json格式，並將HttpContext.Current.Response.Write返回到頁面。該頁面現在剛剛以json格式顯示文本。從服務器jQuery ajax處理請求

我如何捕獲這個響應做的東西與數據，並以更具可讀性的格式呈現在屏幕上。我需要在所有頁面上執行此操作都不是jquery/ajax格式。

下面是我完全的html代碼。大部分的Java腳本的是一個例子，我發現：

<HTML> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> 
</script> 
<script> 
// variable to hold request 
var request; 
// bind to the submit event of our form 
$("#frmLookup").submit(function(event){ 
// abort any pending request 
if (request) { 
    request.abort(); 
} 
// setup some local variables 
var $form = $(this); 
// let's select and cache all the fields 
var $inputs = $form.find("input, select, button, textarea"); 
// serialize the data in the form 
var serializedData = $form.serialize(); 
// let's disable the inputs for the duration of the ajax request 
$inputs.prop("disabled", true); 

// fire off the request to /form.php 
request = $.ajax({ 
    url: "http://server1/RWebService/users", 
    type: "post", 
    data: serializedData 
}); 

// callback handler that will be called on success 
request.done(function (response, textStatus, jqXHR, json){ 
    // log a message to the console 
    console.write("HELLO WORLD"); 

}); 

// callback handler that will be called on failure 
request.fail(function (jqXHR, textStatus, errorThrown){ 
    // log the error to the console 
    console.error(
     "The following error occured: "+ 
     textStatus, errorThrown 
    ); 
}); 

// callback handler that will be called regardless 
// if the request failed or succeeded 
request.always(function() { 
    // reenable the inputs 
    $inputs.prop("disabled", false); 
}); 

// prevent default posting of form 
event.preventDefault(); 
}); 
</script> 
</head> 

<body> 
    Look up user 

    <form id="frmLookup" name="input" action = "http://server1/RWebService/users" method = "post" > 
    BWS HostName: <input type="text" name="wBWSHostName" value="foobar.com" /> 
    <BR> 
    UserName: <input type="text" name="wBWSUserName" value="admin" /> 
    <br /> 
    Password: <input type="password" name="wBWSPassword" value="password"/> 
    <BR> 
    Lookup User: <input type="text" name="wUser" value="[email protected]"/> 
    <input type="submit" name="wLookup" value="Lookup" /> 

    </form> 

    <div id="data"> 

    </div> 
</body> 

</HTML>

來源

2014-02-28 user1158745

用戶回調done處理response並在頁面做的工作。

編輯：我創建了一個小提琴向你展示ajax是如何表現的。您可以將其作爲示例：http://jsfiddle.net/Jvzn5/

來源

2014-02-28 19:08:05 Joqus

你可以舉個例子嗎？現在所有的數據都以json格式顯示在頁面上 – user1158745

確保您實際上沒有通過使用提交按鈕等提交表單本身。您只想通過jQuery發佈表單數據。

變化：

<input type="submit"

要：

<input type="button" id="lookup-button"

防止表單被提交。

然後：

$("#frmLookup").submit(...

要：

$(document).ready(function() { 
    $("#lookup-button").click(... 
    ... 
    ... 
});

注意：您將需要一個額外的}）;最後關閉$ {document} .ready（function（）{這就是說，在DOM加載之後，用我所有的東西在那裏連接我的按鈕的click事件

這樣你的按鈕提交然後，你需要處理結果，就像Joqus提到的那樣，但是我們需要知道你正在返回的JSON是什麼樣的，一般來說，雖然，你應該可以做一些像response.MyProp或response.MyObject.MyProp done（）

來源

2014-02-28 19:25:24 SethMW

什麼你的意思是我用usi整理表格本身ng提交按鈕，Dd你的意思是在我的HTML代碼

你不一定需要刪除任何東西，但是如果你只通過jQuery發佈，你並不需要動作和方法屬性。查看我編輯的回覆以獲取更多詳情。 – SethMW

所以我改變了我的提交鍵入按鈕。所以我的$ .ajax代碼實際上並沒有提交發布請求。 – user1158745

從服務器jQuery ajax處理請求

回答

相關問題