方式:
http://www.pureexample.com/tw/jquery/cross-domain-ajax.html
可能的問題:
http://jsgears.com/thread-2369-1-1.html
http://blog.toright.com/posts/3205/%E5%AF%A6%E4%BD%9C-cross-origin-resource-sharing-cros-%E8%A7%A3%E6%B1%BA-ajax-%E7%99%BC%E9%80%81%E8%B7%A8%E7%B6%B2%E5%9F%9F%E5%AD%98%E5%8F%96-request.html
其他:
https://code.google.com/p/chromium/issues/detail?id=321241
2014年9月29日 星期一
2013年7月4日 星期四
{C#} Progressbar(JQuery UI) 搭配Ajax
搭配Ajax取資料其間 進度條展示
//CSS樣版
參考資訊:
http://horacerobot.blogspot.tw/2010/12/jquery-ajax-mvc-jquery-ui-progress-bar.html
http://jqueryui.com/progressbar/#label
//CSS樣版
<style>
.progress-label {
float: left;
margin-left: 50%;
margin-top: 5px;
font-weight: bold;
text-shadow: 1px 1px 0 #fff;
}
</style>
<script>
$(function () {
//設定Progressbar
var progressbar = $("#progressbar"),
progressLabel = $(".progress-label");
progressbar.progressbar({
value: false,
change: function () {
progressLabel.text(progressbar.progressbar("value") + "%");
},
complete: function () {
progressLabel.text("Complete!");
}
});
var intervalID = setInterval(progress, 250);
//觸發Read ajax
var strURL = "source.ashx";
$.ajax({
type: 'GET',
data: { parms: Math.random() },
url: strURL,
contentType: "application/json; charset=utf-8",
dataType: 'json',
error: function () {
alert('Ajax request 發生錯誤');
},
success: function (result) {
$("#progressbar").progressbar("value", 100);
$("#progressbar").hide();
}
});
});
function progress() {
var val = $("#progressbar").progressbar("option", "value")
if (val < 100) {
$("#progressbar").progressbar("value", val + 1);
}
}
</script>
<div id="progressbar"></div>
參考資訊:
http://horacerobot.blogspot.tw/2010/12/jquery-ajax-mvc-jquery-ui-progress-bar.html
http://jqueryui.com/progressbar/#label
2012年11月9日 星期五
{C#} ajax call WebMethod &ashx 應用
一、WebMethod :
aspx:
var strURL = 'WebForm2.aspx/GetValue';
$.ajax({
type: 'POST',
url: strURL,
data: "{'orderNo':'" + value + "'}",//傳入參數
contentType: "application/json; charset=utf-8",
dataType: 'json',
error: function (xhr, ajaxOptions, thrownError) {
alert('Ajax request 發生錯誤 ' + xhr.responseText);
},
success: function (html) {
var dataArr = JSON.parse(html.d);
}
WebForm2.aspx.cs:
[WebMethod]
public static string GetValue(string orderNo)
{
object temp = new object();
temp = DateTime.Now.ToString("yyyy");
var data = new JavaScriptSerializer().Serialize(temp);
return data;
}
二、ashx 應用
aspx:
var value = $('#<%=txtOrderNo.ClientID %>').val();
var customer = $('#<%=lblCustomerNo.ClientID %>').text();
var strURL = 'OrderDetailSource.ashx';
$.ajax({
type: 'GET',
url: strURL,
data: { orderNo: value, customerId: customer },
contentType: "application/json; charset=utf-8",
dataType: 'json',
error: function (xhr, ajaxOptions, thrownError) {
alert('Ajax request 發生錯誤 ' + xhr.responseText);
},
success: function (result) {
//result 直接就是一個json
alert(result[0].屬性);
}});
OrderDetailSource.ashx:
public void ProcessRequest (HttpContext context) {
context.Response.ContentType = "text/plain";
//傳入的參數
string orderNo = context.Request.QueryString["orderNo"] ?? string.Empty;
string customerId = context.Request.QueryString["customerId"] ?? string.Empty;
//service 2.0 寫法
var result = new Service.Operator().abc(orderNo, customerId);
var temp = JsonConvert.SerializeObject(result, Formatting.Indented);
//回傳一個json格式資料
context.Response.Write(temp);
}
註:
當用方法二時,type要為GET,因為有傳入參數,用Post會直接跑error
參考資料:
http://www.dotblogs.com.tw/threeday0905/archive/2011/01/07/20648.aspx
http://zh-tw.yescript.com/JavascriptScripts-67-.ajaxFanHuiDeJSONWuF/
http://blog.sina.com.cn/s/blog_5ee49d5a0100ss13.html
xhr error message 屬性方法
http://kevyu.blogspot.tw/2010/06/ajaxerror-message.html
Jquery ajax 屬性值列表
http://www.w3school.com.cn/jquery/ajax_ajax.asp
//下面這個範例的$.toJSON({ ids : id })試不出來
http://www.dotblogs.com.tw/rx836/archive/2011/05/10/24658.aspx
aspx:
var strURL = 'WebForm2.aspx/GetValue';
$.ajax({
type: 'POST',
url: strURL,
data: "{'orderNo':'" + value + "'}",//傳入參數
contentType: "application/json; charset=utf-8",
dataType: 'json',
error: function (xhr, ajaxOptions, thrownError) {
alert('Ajax request 發生錯誤 ' + xhr.responseText);
},
success: function (html) {
var dataArr = JSON.parse(html.d);
}
WebForm2.aspx.cs:
[WebMethod]
public static string GetValue(string orderNo)
{
object temp = new object();
temp = DateTime.Now.ToString("yyyy");
var data = new JavaScriptSerializer().Serialize(temp);
return data;
}
二、ashx 應用
aspx:
var value = $('#<%=txtOrderNo.ClientID %>').val();
var customer = $('#<%=lblCustomerNo.ClientID %>').text();
var strURL = 'OrderDetailSource.ashx';
$.ajax({
type: 'GET',
url: strURL,
data: { orderNo: value, customerId: customer },
contentType: "application/json; charset=utf-8",
dataType: 'json',
error: function (xhr, ajaxOptions, thrownError) {
alert('Ajax request 發生錯誤 ' + xhr.responseText);
},
success: function (result) {
//result 直接就是一個json
alert(result[0].屬性);
}});
OrderDetailSource.ashx:
public void ProcessRequest (HttpContext context) {
context.Response.ContentType = "text/plain";
//傳入的參數
string orderNo = context.Request.QueryString["orderNo"] ?? string.Empty;
string customerId = context.Request.QueryString["customerId"] ?? string.Empty;
//service 2.0 寫法
var result = new Service.Operator().abc(orderNo, customerId);
var temp = JsonConvert.SerializeObject(result, Formatting.Indented);
//回傳一個json格式資料
context.Response.Write(temp);
}
註:
當用方法二時,type要為GET,因為有傳入參數,用Post會直接跑error
參考資料:
http://www.dotblogs.com.tw/threeday0905/archive/2011/01/07/20648.aspx
http://zh-tw.yescript.com/JavascriptScripts-67-.ajaxFanHuiDeJSONWuF/
http://blog.sina.com.cn/s/blog_5ee49d5a0100ss13.html
xhr error message 屬性方法
http://kevyu.blogspot.tw/2010/06/ajaxerror-message.html
Jquery ajax 屬性值列表
http://www.w3school.com.cn/jquery/ajax_ajax.asp
//下面這個範例的$.toJSON({ ids : id })試不出來
http://www.dotblogs.com.tw/rx836/archive/2011/05/10/24658.aspx
訂閱:
文章 (Atom)