سلام
من چطور میتونم از آجاکس برای نمایش محتوایی که خودم تعیین کردم استفاده کنم؟ یعنی لحظه ای باشه اگر مثلا متنی رو که از بانک خوندم ویرایش شد همون لحظه بدون رفرش سفحه اون متن رو عوض کنه
از چه کدی؟
Printable View
سلام
من چطور میتونم از آجاکس برای نمایش محتوایی که خودم تعیین کردم استفاده کنم؟ یعنی لحظه ای باشه اگر مثلا متنی رو که از بانک خوندم ویرایش شد همون لحظه بدون رفرش سفحه اون متن رو عوض کنه
از چه کدی؟
سلام.نقل قول:
[HTML]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Ajax</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="author" content="eAmin Q!" />
<script type="text/javascript">
function xmlObj() {
return window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
};
function req(url, method, func) {
var xmls = xmlObj();
xmls.open(method.toUpperCase(), url, true);
xmls.onreadystatechange = function() {
if ( xmls.readyState == 4 && ( xmls.status >= 200 || xmls.status == 300 ) ) {
if ( typeof func == 'function' ) func(xmls);
}
};
xmls.send(null);
};
function send() {
req('insert.php?names='+document.getElementById('n ames').value, 'get', function(xmls) {
req('index.php', 'get', function(xmls) {
document.getElementById('content').innerHTML = xmls.responseText;
});
});
};
</script>
</head>
<body>
<form method="get" onsubmit="return false">
name: <input type="text" id="names" name="names" />
<input type="submit" value="Go!" onclick="send()" />
</form>
<div id="content"></div>
</body>
</html>[/HTML]
توضیح خاصی فکر نکنم بخواد، ولی خب، یکمی در موردش توضیح می دم.
اون قسمتهایی رو که پر رنگ کردم، بیشتر بهش توجه کن، تابع send دوتا درخواست، رو به سرور می فرسته، اول باید اطلاعاتی رو که از طرف کاربر فرستاده شده رو به سرور بفرستیم تا به دیتابیسمون منتقل بشه، در صورتی که اینکار به صورت موفقیت آمیز انجام بشه، صفحه ی ایندکس ما یعنی همونی که اطلاعات رو از دیتابیس می خونه، در div ی که id اون به نام content هست، قرار می ده.
به قسمت فرم توجه کن می بینی که من از این استفاده کردم:
دلیلش هم اینه که هر وقت رو submit کلیک کردیم، هیچ عمل خواصی رو انجام، یعنی صفحه دوباره رفرش نشه!کد:onsubmit="return false"
به همین راحتی، به همین خوشمزگی!!!:31:
مشکلی چیزی بود، استاتید برتر:10:، و بنده در خدمتیم.
-----------------------------------------------------------------
داش یادم می رفت هااااا!!!
جای خوبی رو برای سوالت انتخاب نکردی! از این به بعد بیشتر در انتخاب جای سوالت دقت کن، از شما بعیده:13:
کلا هنگ کردم :31: این کد همونکاری که میخوام رو میکنه؟ میشه یه نمونه نشون بدی تا بهتر بهم فهم بشه؟ :31:
آخه این چیزی نیست که بخوای هنگ کنی:18::13:نقل قول:
تو اطلاعاتت رو چه طوری می فرستی، به اون صفحه ی php ؟
بزار من بگم اینطوری:
تا اینجای کار که مشکلی نیست؟کد:<form method="get" action="inset.php">
name: <input type="text" id="names" name="names" />
<input type="submit" value="Go!" />
</form>
خب اگر ما بخوایم با ای جکس این کار رو بکنیم، اول باید اسکریپتهای ای جکس رو بنویسیم، که اینا هستن:
این اسکریپتهای مربوط به ای جکس هست، حالا برای اینکه ازش استفاده کنیم، باید اون تابع ای جکس خودمون، که در اینجا send نام داره رو فراخوانی کنیم، به اینصورت:کد:function xmlObj() {
return window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
};
function req(url, method, func) {
var xmls = xmlObj();
xmls.open(method.toUpperCase(), url, true);
xmls.onreadystatechange = function() {
if ( xmls.readyState == 4 && ( xmls.status >= 200 || xmls.status == 300 ) ) {
if ( typeof func == 'function' ) func(xmls);
}
};
xmls.send(null);
};
در قسمت url که همون آدرس صفحه رو می دیم، تا صفحه ای که اطلاعات توش هست رو در div ی که مشخص کردیم، نشون بده. مثل کد بالا. بعد متدش رو مشخص می کنیم GET ، بعد از اون هم یه تابع در اختیار شما هست، تا هرکاری رو که بخواین بعد از کامل شدن اون اطلاعات، انجام بدین رو توی اون تابع قرار می دین.کد:// آرگومانهای تابع send(url, method, function)
req('index.php', 'get', function(xmls) {
document.getElementById('content').innerHTML = xmls.responseText;
});
ولی اگر بخوایم، یک نوشته ای چیزی رو توی دیتابیس ذخیره کنیم، باید اینطوری بنویسیمش:
نحوه ی آدرس دهی توی جاوااسکریپت یا ای جکس، یه خرده با فرم های معمولی فرق داره، یعنی شما باید اون نام اون query string رو بنویسی و مقدارش که مقابلش هست رو خالی بزاری:کد:req('insert.php?names='+document.getElementById('names').value, 'get', function() { });
بعد باید المنت textbox رو پیدا کنی، و مقدارش رو در بیاری تا بتونه اطلاعات وارد شده توسط کاربر رو بفرسته:کد:'insert.php?names='
خب حالا یه چیز می مونه که اونم المنتهای form و اینجورچیزها هست:کد:document.getElementById('names').value
[HTML]<form method="get" onsubmit="return false">
name: <input type="text" id="names" name="names" />
<input type="submit" value="Go!" onclick="send()" />
</form>[/HTML]
در مورد این کدها هم بالا توضیح دادم.
------------------------------------------
اگر باز هم متوجه نشدی، خبر بده تا یه مثال واست بزارم.
:31: این سوال رو جواب بدی حله :31: :31: ( این روزا خیلی هنگی شدم :31: فکرام جای دیگست :31: )
ببین اصلا بگو ببینم این کد آجاکس چیکار میکنه؟ :31:
اینکار رو می کنه:نقل قول:
نقل قول:
یعنی لحظه ای باشه اگر مثلا متنی رو که از بانک خوندم ویرایش شد همون لحظه بدون رفرش سفحه اون متن رو عوض کنه
خوب اینکار رو هم میکنه؟ : فقط بیاد محتوای بانک فلان رو نمایش بده
اشتباه نکن!نقل قول:
ای جکس نمی تونه به بانک و اینجور چیزها وصل بشه، برای اینکار فقط باید از زبانهای سرورساید استفاده کنی.
خوب الان Wordpress چطور ادمینش کار میکنه؟ یا همین انجمن؟ که ارسال پاسخت سریعش
کل اشتباه داری می کنی!نقل قول:
در واقع ای جکس رابطیه بین، سرور و کلاینت!!!
یعنی تو اطلاعات رو می فرستی، ای جکس اون اطلاعات رو منتقل می کنه به سرور مثلا insert.php بعد، کدهای php هست که توی سرور اجرا می شه، که توی بانک تغییرات رو ایجاد می کنه!
باز اگر بخوای اطلاعات رو از سرور بخونی بازم هم به همون صورت هست، اول کدها index.php توی سرور اجرا می شه، بعد از طریق ای جکس، تو می تونی اون نتیجه ش رو بدون رفرش شدن صفحه ببینی!!!