ตัวอย่าง สคริป jquey ajax get post load ที่ใช้ใน asp
----------------------------------------------
กรณี get
$(document).ready(function(){
$("button").click(function(){
var mm=$("#m0").text();
mm=mm.substr(5).trim();
var yy=$("#y0").text();
yy=yy.substr(3).trim();
var empdate1=mm + "/" + yy ;
// alert(mm + " " + yy);
var txtquerytc="showtimecard1.asp?empid="+ empid1 +"&empdate=" + empdate1 + "&empname=" + empname1 + "&empsurname=" + empsurname1;
//alert(txtquerytc);
//
window.open(txtquerytc);
$.get('showtimecardinshowpic.asp',{empid:empid1,empdate:empdate1,empname:encodeURIComponent(empname1),empsurname:encodeURIComponent(empsurname1)},function(responseTxt,statusTxt,xhr){
if(statusTxt=="success")
alert("showtimecard loaded successfully!");
$("#showtimecard").html(responseTxt);
if(statusTxt=="error")
alert("Error: "+xhr.status+": "+xhr.statusText);
});
});
});
-------------------------
\\หาขนาด ไฟล์ภาพ ใช ้xhr
var myimg="../../grandattendance/picture/"+ mypic1;
var xhr = new XMLHttpRequest();
xhr.open('HEAD', myimg, true);
xhr.onreadystatechange = function(){
if ( xhr.readyState == 4 ) {
if ( xhr.status == 200 ) {
//alert('Size in bytes: ' + xhr.getResponseHeader('Content-Length'));
$("#imgsize").val( xhr.getResponseHeader('Content-Length'));
$("#imglastmodified").val( xhr.getResponseHeader('Last-Modified'));
// alert($("#imgsize").val());
} else {
alert('ตรวจสอบรูปภาพใหม่อีกครั้ง ว่าไฟล์เสียหายหรือขนาดไฟล์ที่ใหญ่ไป \n กว้าง*ยาว ควรจะ 128*146 และขนาดไฟล์ไม่ควรเกิน 30 kB');
}
}
};
-----------------------------------------
กรณี load
function showstats1_year(m_or_y2,xid2,monthyear2,namestopjob2)
{
$("body").css("cursor","progress");
var m_or_y1=m_or_y2;
var xid1=xid2;
var monthyear1=monthyear2;
var namestopjob1=namestopjob2;
var txtquery="showstat.asp?m_or_y=" + m_or_y1 + "&xid="+ xid1 + "&monthyear=" + monthyear1 + "&namestopjob=" + namestopjob1;
$(document).ready(function(){
$("#area2").load(txtquery,function(responseTxt,statusTxt,xhr){
if (statusTxt=="success" ) {
//alert(".." + xhr.statusText);
$("body").css("cursor","default");
}
if (statusTxt=="error" ) {
$("body").css("cursor","default");
alert("error :" + xhr.statusText);
}
});
});
}
-----------------------
รวม ตัวอย่างการใช้ get ajax post
<script>
$(document).ready(function () {
$("#userinfoUpdate").click(function () {
var myprompt = confirm("ต้องการบันทึก");
if (myprompt) {
var maxlevel = Number($("#userlevel").attr("max"));
var myvalue = $("#userlevel").attr("value").valueOf();
//alert(typeof (maxlevel) + ":" + typeof (myvalue));
if (myvalue > maxlevel) {
alert("ต้องการตัวเลข level ช่วง 1-" + maxlevel.toString() + "\nกรุณาใส่ใหม่!");
} else {
// alert($("#ID").val());
$.post("userinfoUpdate.asp", {
id: $("#ID").val(),
logname: encodeURIComponent($("#logname").val()),
//pw: $("#pw").val(),
remark: encodeURIComponent($("#remark").val()),
userlevel: $("#userlevel").val(),
// pk_passkey: $("#pk_passkey").val(),
realname: encodeURIComponent($("#realname").val()),
realsurname: encodeURIComponent($("#realsurname").val()),
realposition: encodeURIComponent($("#realposition").val())
}, function (data, status) {
alert("Data: " + data + "\nStatus: " + status);
$("#changepwd").click();
});
}
}
});
$("#utf8").click(function () {
var xxx = $("#realname").val();
var ixxx = decodeURI(xxx);
alert(ixxx);
});
$("#userinfodelete").click(function () {
var myprompt = confirm("ต้องการลบ?");
if (myprompt) {
var myid = $("#ID").val();
// alert(myid);
$.get("userinfoDelete.asp", { id: myid }, function (data, status) {
alert("Data: " + data + "\nStatus: " + status);
$("#changepwd").click();
});
}
});
//logname,pw,remark,level,pk_passkey,realname,realsurname,realposition"
$("#userinfonew").click(function () {
if ($(this).text() == "สร้างใหม่") {
$("#userinfodelete").attr("disabled", true);
$("#userinfoUpdate").attr("disabled", true);
$(this).text("บันทึก");
$("#tableuserinfo input").val("");
$("#tableuserinfo .pwd").attr("disabled", false);
} else {
var myprompt = confirm("ต้องการสร้างใหม่?");
if (myprompt) {
// alert("new rec");
$.ajax({
url: 'userinfoAdd.asp',
data: {
logname: encodeURIComponent($("#logname").val()),
pw: encodeURIComponent($("#pw").val()),
remark: encodeURIComponent($("#remark").val()),
userlevel: $("#userlevel").val(),
pk_passkey: encodeURIComponent($("#pk_passkey").val()),
realname: encodeURIComponent($("#realname").val()),
realsurname: encodeURIComponent($("#realsurname").val()),
realposition: encodeURIComponent($("#realposition").val())
},
success: function (data, status, xhr) {
alert("Status: " + status);
},
error: function (data, status, xhr) {
alert("Data error! " + "\nStatus: " + status);
},
type: 'post'
});
$("#changepwd").click();
}
}
});
$("#myclose").click(function () {
// alert("test");
// $("#showEditUser").html("<table style='border:1px solid black;'><tr><td>test</td><td>test</td></tr></table>");
$("#showEditUser1").hide();
// $("#showEditUser").load('tableLoginShow.asp?id=' + $(this).val());
});
});
</script>