[WhatsOld] Hi! Json.NET and post data to iframe : 認識 Json.NET 並用 post 方式傳資料到 iframe 裡

Combo4

今天接著回到本來要玩的 Json.NET，官網上（連結）也講得很清楚基本該怎麼用，但是沒有動手做之前，我還是覺得對 Json.NET 有點距離感。到 CodePlex 上面的 Json.NET Downloads 下載了最新的版本 Json.NET 4.5 Release 11 (source + binary) ，來動手吧！

哦！另一個主角是 iframe，iframe 有什麼特別的？已經每天在用啦！
是阿，但是它有一招別人玩很久的而我還沒玩過，用 iframe 來做非同步執行的網頁。除了已經流行很久的 AJAX (Asynchronous Javascript And XMLHttpRequest)，兩年前同事有說，用 iframe 做的非同步執行方式也行之有年了。今天先從 post 資料到 iframe 開始吧。

怎麼 post 資料到 iframe ？這裡有講 XD 參考後，把我昨天的 json2Test 改成這個樣子，

javascript /

?

1 2 3 4 5 6 7 8

function fillParameter() {     var objTest = {};     objTest.account = "lozentest";     objTest.password = "123123";       var loginConditions = document.getElementsByName("loginConditions")[0];     loginConditions.value = JSON.stringify(objTest); }

html /

?

1 2 3 4 5 6 7 8 9 10

<form action="http://localhost:2363/jsonNet20Test/jsonServices.ashx" target="serviceContainer" method="post">     <input name="loginConditions" type="hidden" />     <input type="submit" onclick="fillParameter();" /> </form> <span id="result"></span> <div> an iframe/   <iframe name="serviceContainer" src="http://localhost:2363/jsonNet20Test/jsonServices.ashx" width="100%"></iframe> </div>

jsonServices.ashx 和兩個相關類別 /

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

context.Response.ContentType = "text/plain";   string jsonLoginConditions = context.Request.Form["loginConditions"] ?? ""; context.Response.Write("context.Request.Form[\"loginConditions\"] = '" + jsonLoginConditions +"'"); context.Response.Write("\n\n");   if (jsonLoginConditions != "") {     LoginConditions loginConditions = JsonConvert.DeserializeObject<LoginConditions>(jsonLoginConditions);     context.Response.Write("loginConditions.account = '" + loginConditions.account + "'");     context.Response.Write("\n");     context.Response.Write("loginConditions.password = '" + loginConditions.password + "'");     context.Response.Write("\n\n");       LoginResult loginResult = new LoginResult();     loginResult.isSuccess = false;     loginResult.errMsg = "account is invalid!";     string jsonLoginResult = JsonConvert.SerializeObject(loginResult);     context.Response.Write("jsonLoginResult = '" + jsonLoginResult + "'"); }

?

1 2 3 4 5 6 7 8 9 10 11

public class LoginConditions {     public string account;     public string password; }   public class LoginResult {     public bool isSuccess;     public string errMsg; }

最後，把我的 HTML 檔案用瀏覽器開起來，按下那顆鈕，就完成啦！

其實也沒那麼順利 ...

第一個遇到的問題就是 jsonServices.ashx 上面的 Request.Form["loginConditions"] 抓不到值！？原來是 <input id="loginConditions" type="hidden" /> 裡面要再加個 name="loginConditions" ，Request.Form 認的是 name ...（ASP.NET 寫太久，我連這最基本的規則都忘了 Qrz）

第二個遇到的問題是把 input 的 id 拿掉，只留 name 之後，用 getElementsByName("loginConditions") 抓出來的物件取不到 value 內容！？原來 getElementByName 回傳的是陣列 Qrz 

大概就這樣囉。附上我的作業檔 連結，晚安～