jQuery - AJAX load() နည်းလမ်း
jQuery load() နည်းလမ်း
jQuery load()
နည်းလမ်းသည် ရိုးရှင်းသော်လည်း အားကောင်းသည့် AJAX နည်းလမ်းဖြစ်သည်။
နည်းလမ်း သည် load()
ဆာဗာတစ်ခုမှ ဒေတာကို တင်ဆောင်ပြီး ပြန်လာသောဒေတာကို ရွေးချယ်ထားသော ဒြပ်စင်သို့ ထည့်သွင်းသည်။
အထားအသို-
$(selector).load(URL,data,callback);
လိုအပ်သော URL ကန့်သတ်ချက်သည် သင်တင်လိုသော URL ကို သတ်မှတ်ပေးပါသည်။
ရွေးချယ်နိုင်သော ဒေတာ ကန့်သတ်ချက်သည် တောင်းဆိုချက်နှင့်အတူ ပေးပို့ရန် querystring key/value pairs အစုံကို သတ်မှတ်ပေးပါသည်။
load()
ရွေးချယ်နိုင်သော ဖုန်းခေါ်ဆိုမှု ကန့်သတ်ဘောင်သည် နည်းလမ်းကို ပြီးမြောက် ပြီးနောက် လုပ်ဆောင်ရမည့် လုပ်ဆောင်ချက်တစ်ခု၏ အမည်ဖြစ်သည် ။
ဤသည်မှာ ကျွန်ုပ်တို့၏ နမူနာဖိုင်၏ အကြောင်းအရာဖြစ်သည်- "demo_test.txt":
<h2>jQuery and AJAX is FUN!!!</h2>
<p id="p1">This is some text in a paragraph.</p>
အောက်ပါဥပမာသည် ဖိုင် "demo_test.txt" ၏ အကြောင်းအရာကို သီးခြား <div>
ဒြပ်စင်တစ်ခုသို့ တင်သည်-
ဥပမာ
$("#div1").load("demo_test.txt");
URL ကန့်သတ်ချက်သို့ jQuery ရွေးချယ်ရေးကိရိယာကိုလည်း ထည့်နိုင်သည်။
အောက်ဖော်ပြပါ ဥပမာသည် ဖိုင် "demo_test.txt" အတွင်းရှိ id="p1" ဖြင့် ဒြပ်စင်၏ အကြောင်းအရာကို တိကျသော <div>
ဒြပ်စင်တစ်ခုသို့ တင်သည်-
ဥပမာ
$("#div1").load("demo_test.txt #p1");
load()
ရွေးချယ်နိုင်သော ဖုန်းခေါ်ဆိုမှု ကန့်သတ်ချက်သည် နည်းလမ်းပြီးမြောက် သောအခါ လုပ်ဆောင်ရန် ပြန်ခေါ်သည့် လုပ်ဆောင်ချက်ကို သတ်မှတ်သည်
။ ပြန်ခေါ်သည့်လုပ်ဆောင်ချက်တွင် မတူညီသော ကန့်သတ်ချက်များ ရှိနိုင်သည်-
responseTxt
- ခေါ်ဆိုမှုအောင်မြင်ပါက ထွက်ပေါ်လာသောအကြောင်းအရာများ ပါဝင်ပါသည်။statusTxt
- ခေါ်ဆိုမှုအခြေအနေပါရှိသည်။xhr
- XMLHttpRequest object ပါရှိသည်။
အောက်ဖော်ပြပါ ဥပမာသည် load() method ပြီးသည်နှင့် alert box တစ်ခုပြသသည်။ load()
နည်းလမ်းအောင်မြင်ပါက၊ ၎င်းသည် "ပြင်ပအကြောင်းအရာကို အောင်မြင်စွာ ဒေါင်းလုဒ်လုပ်ထားသည်" ကိုပြသမည်ဖြစ်ပြီး ပျက်ကွက်ပါက ၎င်းသည် error message ကိုပြသသည် -
ဥပမာ
$("button").click(function(){
$("#div1").load("demo_test.txt", function(responseTxt, statusTxt, xhr){
if(statusTxt == "success")
alert("External content loaded successfully!");
if(statusTxt == "error")
alert("Error: " + xhr.status + ": " + xhr.statusText);
});
});
jQuery AJAX အကိုးအကား
jQuery AJAX နည်းလမ်းများအားလုံး၏ ပြီးပြည့်စုံသောခြုံငုံသုံးသပ်ချက်အတွက်၊ ကျွန်ုပ်တို့၏ jQuery AJAX အကိုးအကားသို့ သွားပါ ။