工具類語言真就是這樣，當長時間不寫，就忘的差不多了。 昨晚做了運營輔助的webform頁面，興致來了，通過ajax請求與后端交互，然后今天在一個小同學的幫助下，最終完成。
由于生產環境數據量大，涉及到分頁。不想再折騰了，還是改成同步的吧。
我有懷舊情懷，在代碼重構之前，做個小小記錄~~
asp.net webform
view
html:
<body>
<div id="Div1" class="tableExcel">
<div id="Div2" class="input">
訂單號：<input type="text" id="orderNo" name="orderNo" />
日期：<input type="text" id="startTime" name="startTime" readonly="readonly" class="runcode" style="width:100px" />
關鍵字：<input type="text" id="keyword" name="keyword" class="runcode" />
分類：<select id="logFlag" name="logFlag" class="runcode" style="width:120px;"/>
<input type="button" id="btnSearch" value="查詢" class="icon" />
</div>
<div class="table">
<table border="0" id="OrderList" cellspacing="0" cellpadding="0">
<tr class="th">
<th>時間
</th>
<th>logflag
</th>
<th>訂單號
</th>
<th>duration</th>
<th>響應報文
</th>
</tr>
</table>
</div>
</div>
</body>
js：
<script src="../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript" src="../Scripts/lhgcalendar/lhgcore.lhgcalendar.min.js"></script>
<script type="text/javascript">
Date.prototype.Format = function (fmt) { //author: meizz
var o = {
"M+": this.getMonth() + 1, //月份
"d+": this.getDate(), //日
"h+": this.getHours(), //小時
"m+": this.getMinutes(), //分
"s+": this.getSeconds(), //秒
"q+": Math.floor((this.getMonth() + 3) / 3), //季度
"S": this.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
for (var k in o)
if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
return fmt;
}
$(function () {
$("#startTime").val(new Date().Format("yyyy-MM-dd"));
$("#startTime").bind("click", function () {
$.calendar({ format: 'yyyy-MM-dd', noToday: false });
});
$.ajax({
url: "RequestLog.aspx/GetItem", //后臺webservice里的方法名稱
type: "post",
dataType: "json",
contentType: "text/json",
traditional: true,
success: function (data) {
var json = eval(data);
var optionstring = "";
for (var j = 0; j < json.length; j++) {
optionstring += "<option value=\"" + json[j] + "\" >" + json[j] + "</option>";
}
$("#logFlag").html("<option value=''>請選擇...</option> " + optionstring);
},
//error: function (msg) {
// alert(msg);
//}
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert(textStatus);
}
});
$("#btnSearch").click(function () {
$.ajax({
type: "POST",
dataType: "text/html",
url: "RequestLog.aspx",
data: {
logFlag: $("#logFlag").val(),
orderNo: $("#orderNo").val(),
startTime: $("#startTime").val(),
keyword: $("#keyword").val()
},
success: function (result) {
$("#OrderList").find(".th").nextAll().remove();
$("#OrderList").children().append(result);
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
return false;
}
});
});
})
</script>
后臺.cs代碼：
public partial class RequestLog : System.Web.UI.Page
{
PaycenterRequestsBLL bll = new PaycenterRequestsBLL();
protected void Page_Load(object sender, EventArgs e)
{
//Response.Write(Request.Url.ToString());
if (Request.Url.ToString().IndexOf("/GetItem") != -1)
{
Response.ContentType = "text/json";
Response.Clear();
string str = new PaycenterRequestsBLL().GetLogFlagJson();
Response.Write(str);
Response.End();
}
string keyword = Request.Form["keyword"];
string logFlag = Request.Form["logFlag"];
string orderNo = Request.Form["orderNo"];
string startTime = Request.Form["startTime"];
if (!string.IsNullOrEmpty(orderNo + keyword + logFlag + startTime))
{
var list = bll.GetList(DateTime.Parse(startTime), logFlag, orderNo, keyword);
string htmlFormat = "<tr class=\"td\"><td>{0}</td><td>{1}</td><td>{2}</td><td align=right>{3}</td><td align=left>{4}</td></tr>";
string html = "";
if (!list.Any())
{
html = "<tr><td colspan=5>no data</td></tr>";
}
else
{
foreach (var item in list)
{
html += string.Format(htmlFormat, item.CreatedTime,
item.LogFlag,
item.OrderNo,
item.DurationMilliSeconds,
item.ResponseMsg);
}
}
Response.Write(html);
Response.End();
}
}
}