سه شنبه ۰۱ آبان ۱۴۰۳

Tuesday, October 22, 2024 GMT +3:30

ارسال و دریافت اطلاعات با متد GET و POST در ای جکس (Ajax)

ajax-asynchronous

به طور کلی ارسال و دریافت اطلاعات در بستر وب با دو متد GET و POST صورت می گیرد که جزئی از استانداردهای تعریف شده پروتکل HTTP هستند و توسط مرورگرها و سرورهای مختلف پشتیبانی می شوند، متد GET معمولا برای ارسال پارامترهای قابل روئیت در آدرس URL درخواستی و دریافت پاسخ از سرور کاربرد دارد، از متد POST نیز به طور معمول در کدنویسی HTML در هنگام کار با فرم ها (تگ form) و ارسال اطلاعات به صورت غیرقابل روئیت استفاده می شود، در ای جکس GET و POST کارکردی مشابه دارند با این تفاوت که در هر دو متد درخواست در پس زمینه ارسال شده و خللی در پیمایش صفحه کاربر ایجاد نمی شود، درک این دو شیوه با توجه به استفاده در بدنه اصلی یک درخواست مبتنی بر ای جکس (Ajax) جهت طی ادامه روند آموزش های این بخش اهمیت زیادی دارد.

متد GET و POST در ای جکس (Ajax)


همانطور که پیش از این گفتیم درخواست های مبتنی بر ای جکس (Ajax) از چند قسمت اصلی تشکیل شده اند (آبجکت XMLHttpRequest، متد open، متد send، متد onreadystatechange و readyState)، آبجکت XMLHttpRequest ساز و کار مورد نیاز را برای ارسال و دریافت اطلاعات بر بستر Ajax فراهم می کند، متد open یک فایل را در سرور با یکی از متدهای GET یا POST فراخوانی کرده و پارامترهای مورد نیاز در قسمت send ارسال می شوند، متد onreadystatechange نیز در کنار متد readyState وضعیت های مختلف را در طی این فرآیند بررسی می کند، با ذکر این ساختار کلی این قسمت از آموزش را به متد open و send اختصاص می دهیم که خود از متدهای GET و POST در پروتکل HTTP استفاده می کنند، به طور خلاصه:
- open و send توابعی در Ajax هستند که برای فراخوانی یک فایل از سرور و ارسال پارامتر به آن از آنها استفاده می کنیم (این توابع را در اصطلاح برنامه نویسی شی گرا، متد می گویند).
- متد open برای فراخوانی فایل از سرور از یکی از شیوه های تعریف شده در پروتکل HTTP استفاده می کند، در پروتکل HTTP دو متد GET و POST برای ارسال و دریافت اطلاعات بین کاربر (Client) و سرور (Server) تعریف شده که جزء استانداردهای این پروتکل هستند.

پارامترهای متد open و send در ای جکس (Ajax)


هر درخواست مبتنی بر ای جکس (Ajax) در نهایت باید یک فایل را از سرور فراخوانی کند، این فراخوانی می تواند با ارسال مقادیر یا بدون ارسال مقادیر باشد، ای جکس برای این نیاز از دو متد open و send استفاده می کند که درخواست ها با این دو متد از طریق استاندارد HTTP و متدهای GET و POST در این استاندارد ارسال و نتیجه دریافت می شود، در نمونه کدهای زیر بخش مربوط به متد open و send از یک درخواست مبتنی بر ای جکس را بررسی می کنیم:
xmlHttp.open("GET", "index.php?action=add&id=22", true);
xmlHttp.send(null);

var params = "action=add&id=22";
xmlHttp.open("POST", "index.php", true);
xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlHttp.send(params);
همان طور که در نمونه کدهای بالا مشخص است، زمانی که متد GET در قسمت open استفاده می شود، پارامترها از طریق آدرس URL به سرور ارسال می شوند و قسمت send مقدار null یا خالی دارد، اما در حالت استفاده از POST باید تنظیماتی اعمال شود که از جمله استفاده از متد setRequestHeader است، این متد در ای جکس برای تنظیم سربرگ (Header) های HTTP در یک درخواست استفاده می شود، در مثال بالا نیز سربرگ Content-type با مقادیر application/x-www-form-urlencoded تنظیم شده است، این دستور به مرورگر تفهیم می کند که اطلاعات را مانند یک فرم ساده HTML ارسال کند، پارامترها در حالت استفاده از متد POST، هم می توانند از طریق آدرس URL (مشابه متد GET) و هم در بخش send ارسال شوند که هر کدام برای شرایط خاصی مناسب هستند که در ادامه در این رابطه بیشتر خواهیم گفت، پارامتر سوم متد open نیز برای تعیین غیر همزمانی (هم روند یا Asynchronous) بودن یا نبودن درخواست است، در صورتی که این مقدار true باشد در پیمایش صفحه کاربر خللی ایجاد نمی شود اما اگر این مقدار را false تنظیم کنیم، تا زمانی که فرآیند درخواست ای جکس به پایان نرسیده، کاربر نمی تواند در صفحه پیمایش کند.

GET یا POST، کدام متد را استفاده کنیم؟!


GET و POST هر کدام با هدف خاصی در HTTP تعریف شده اند، متد GET برای ارسال پارامترها در آدرس URL به کار می رود و از POST برای ارسال بسته های اطلاعات به صورت غیر قابل روئیت استفاده می شود.
کجا از GET استفاده کنیم؟
- متد GET معمولا برای ارسال پارامترهای دستوری در آدرس URL استفاده می شود، به طور مثال می توانیم شماره ID کاربر یا کلمه جستجو شده را در این متد ارسال کنیم.
- در صورتی که اطلاعات ارسال شده حالت عمومی داشته باشند استفاده از GET مانعی ندارد، به طور مثال ارسال اطلاعات حساس مانند رمز عبور از این طریق توصیه نمی شود چرا که در آدرس URL و به صورت آشکار قابل روئیت خواهد بود.
- در مواردی که نیاز به ذخیره سازی موقت (Cache) اطلاعات باشد GET گزینه مناسبی است (البته این حالت را می توان با برنامه نویسی جاوا اسکریپت به نحو دلخواه تغییر داد).
- متد GET در ای جکس سریعتر از متد POST است و برای موارد عمومی که صرفا نیاز به فراخوانی یک فایل از سرور با Ajax است، گزینه مناسبی است، متد POST در ای جکس به صورت دو مرحله ای عمل می کند (ابتدا سربرگ های HTTP و سپس اطلاعات ارسال می شوند).
جهت آشنایی بیشتر در مثال زیر اطلاعات فرضی را توسط متد GET برای یک فایل PHP با نام ajax-get.php ارسال و پاسخ را در بلاکی با آی دی result خروجی می دهیم:

فایل ajax-get.php


<?php
@$site = $_GET['site'];
@$domain = $_GET['domain'];
echo "نام سایت: $site<br>";
echo "آدرس دامنه: $domain<br>";
echo "متد استفاده شده: GET<br>";
?>

کد HTML درخواست و تنظیمات Ajax


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>وبگو | ارسال و دریافت اطلاعات با متد GET</title>
<!-- Webgoo.ir -->
<style type="text/css">
body {
    font-family: Tahoma, Geneva, sans-serif;
    direction: rtl;
    font-size: 12px;
}
</style>
<script type="text/javascript">
function ajaxCallFile(id) {
    var xmlHttp;
    
    try {
        //Opera, Firefox, Safari
        xmlHttp = new XMLHttpRequest();
    } catch (e) {
        //Internet Explorer
        try {
            xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {
                alert("متاسفانه مرورگر شما از ای جکس پشتیبانی نمی کند");
                return false;
            }
        }
    }
    xmlHttp.onreadystatechange = function () {
        if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
            document.getElementById(id).innerHTML = xmlHttp.responseText;
            document.getElementById('button-1').innerHTML = 'ارسال درخواست ای جکس';
            document.getElementById('button-1').disabled = false;
        } else {
            document.getElementById('button-1').innerHTML = 'لطفا چند لحظه صبر کنید...';
            document.getElementById('button-1').disabled = true;
        }
    }
    
    xmlHttp.open("GET", "ajax-get.php?site=Webgoo&domain=https://webgoo.ir", true);
    xmlHttp.send(null);
}
</script>
</head>
<body>
<noscript>
جاوا اسکریپت در مرورگر شما غیر فعال است!<br>
</noscript>

<button id="button-1" type="button" onclick="ajaxCallFile('result')">ارسال درخواست ای جکس</button>
<div id="result"></div>
<hr>
پس از کلیک بر روی دکمه بالا، تابع جاوا اسکریپتی فراخوانی شده و درخواست ای جکس به فایل PHP در سرور ارسال می شود، سپس نتیجه دریافت و در بلاک نمایش داده خواهد شد، در این مثال از متد GET استفاده شده است.
</body>
</html>
پیش نمایش
متد POST در ای جکس شباهت زیادی به GET دارد، با این تفاوت که در این شیوه درخواست، مانند تگ form در HTML سربرگ های HTTP یا HTTP Headers نیز به مرورگر ارسال می شوند، از طرفی xmlHttp.send به جای مقادیر null، پارامترهایی با مقادیر رشته ای دارد.
کجا از POST استفاده کنیم؟
- در ای جکس هرکجا نیاز به ارسال اطلاعات حساس مانند نام کاربری، کلمه عبور، مشخصات حساب بانکی و... باشد، بهتر است از POST استفاده کنیم، چرا که اطلاعات در این شیوه در آدرس URL قابل روئیت نیست.
- برای ارسال اطلاعات حجیم (به طور مثال اطلاعات یک فرم HTML) از POST استفاده می شود، متد GET از نظر میزان اطلاعات مجاز با محدودیت های بیشتری در مقایسه با POST روبرو است.
جهت آشنایی بیشتر در مثال زیر اطلاعات فرضی را توسط متد POST برای یک فایل PHP با نام ajax-post.php ارسال و پاسخ را در بلاکی با آی دی result خروجی می دهیم:

فایل ajax-post.php


<?php
@$site = $_POST['site'];
@$domain = $_POST['domain'];
echo "نام سایت: $site<br>";
echo "آدرس دامنه: $domain<br>";
echo "متد استفاده شده: POST<br>";
?>

کد HTML درخواست و تنظیمات Ajax


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>وبگو | ارسال و دریافت اطلاعات با متد POST</title>
<!-- Webgoo.ir -->
<style type="text/css">
body {
    font-family: Tahoma, Geneva, sans-serif;
    direction: rtl;
    font-size: 12px;
}
</style>
<script type="text/javascript">
function ajaxCallFile(id) {
    var xmlHttp;
    
    try {
        //Opera, Firefox, Safari
        xmlHttp = new XMLHttpRequest();
    } catch (e) {
        //Internet Explorer
        try {
            xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {
                alert("متاسفانه مرورگر شما از ای جکس پشتیبانی نمی کند");
                return false;
            }
        }
    }
    xmlHttp.onreadystatechange = function () {
        if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
            document.getElementById(id).innerHTML = xmlHttp.responseText;
            document.getElementById('button-1').innerHTML = 'ارسال درخواست ای جکس';
            document.getElementById('button-1').disabled = false;
        } else {
            document.getElementById('button-1').innerHTML = 'لطفا چند لحظه صبر کنید...';
            document.getElementById('button-1').disabled = true;
        }
    }
    
    xmlHttp.open("POST", "ajax-post.php", true);
    xmlHttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    xmlHttp.send('site=Webgoo&domain=https://webgoo.ir');
}
</script>
</head>
<body>
<noscript>
جاوا اسکریپت در مرورگر شما غیر فعال است!<br>
</noscript>

<button id="button-1" type="button" onclick="ajaxCallFile('result')">ارسال درخواست ای جکس</button>
<div id="result"></div>
<hr>
پس از کلیک بر روی دکمه بالا، تابع جاوا اسکریپتی فراخوانی شده و درخواست ای جکس به فایل PHP در سرور ارسال می شود، سپس نتیجه دریافت و در بلاک نمایش داده خواهد شد، در متد POST از متد setRequestHeader استفاده و پارامترها در قسمت send تنظیم و ارسال می شوند، در این مثال از متد POST استفاده شده است.
</body>
</html>
پیش نمایش
ارسال پارامترها در ای جکس صرفا به روش ثابت مانند نمونه کدهای بالا محدود نمی شود، در آموزش های بعدی خواهیم دید که چگونه می توان به نحو حرفه ای تر و با قابلیت تعاملی بیشتر به صورت پویا از قابلیت های ای جکس در طراحی امکانات و رابط کاربری برنامه های تحت وب استفاده کرد.
دسته بندی: آموزش مقدماتی » Ajax
related مطالب بیشتر:
نمایش پیام در حال بارگذاری با ای جکس (Ajax)
فریم ورک های ای جکس (Ajax Frameworks)
نمایش افکت fade in با ای جکس (Ajax)
آموزش ای جکس (Ajax)، تکنیک غیرهمزمانی در وب
ذخیره و نمایش اطلاعات فایل با ای جکس (Ajax) و PHP
دیدگاه
more ۵۴ دیدگاه برای این مطلب ارسال شده است.
more دیدگاه جدید بر اساس تاریخ ارسال در انتهای دیدگاه های موجود نمایش داده می شود.
امیرحسین
۱۷:۲۲ ۱۳۹۱/۰۶/۱۴
مرسی خیلی آموزش عالی بود من که استفاده کردم!
رضا
۱۷:۳۷ ۱۳۹۱/۱۰/۱۹
سلام
من میخواهم یک فیلد متنی داشته باشم و چند تا آپشن .
کاربر مثلا نامش رو تایپ میکنه و بعد یکی از گزینه ها رو انتخاب میکنه و وقتی دکمه ثبت رو میزنه اطلاعاتش بصورت زیر به یک آدرس خاص با متد پست ارسال بشه
[name-option-matn delkhahe man]
ممنون میشم اگه راهنماییم کنید
برای ارسال اطلاعات یک فرم به سرور از نمونه ارائه شده در آموزش های سایت استفاده کنید، لطفا در وب عبارت "ارسال اطلاعات فرم با Ajax + وبگو" را جستجو نمائید.
۱۷:۱۱ ۱۳۹۱/۱۰/۲۴
سلام.
من آموزشتون رو دیدم و خواستم یکم روش کار کنم. خیلی جالب بود. ولی مشکلی برخوردم.
سایت موزیک رو در نظر بگیرید که برای هر خبرش دکمه های لایک و دیسلایک داره. مثل
http://www.tehranmusic240.com
منم رفتم مثل این بسازم. ولی الان مشکل اینه که اسکریپت رو توی حلقه php گذاشتم تا مشخص بشه که لایک یا دیسلایک برای کدوم خبر زده شده. ولی وقتی روی هر کدوم از خبر ها دکمه ی لایک یا دیسلایک رو میزنم، فقط مال اولین خبر اضافه میشه تو بانکش!!!
کدهای php خبرها:
<?php 
if($totalRows_rs_post >0){
do{ ?>
<div class="pastmanage"><div class="pasthead">
<div class="title"><a href="post-view-<?php echo $row_rs_post['id']; ?>-<?php echo $row_rs_post['title']; ?>"><?php echo $row_rs_post['title']; ?></a></div><div class="detailpst">
<div class="aut">نویسنده : <?php echo $row_rs_post['author']; ?></div>
<div class="cat">شاخه : <?php
$catid = $row_rs_post['cat'];
mysql_select_db($database_cn, $cn);
$query_Recordset2 = "SELECT * FROM ne_cat WHERE id = {$catid} AND active = '1'";
$Recordset2 = mysql_query($query_Recordset2, $cn) or die(mysql_error());
$row_Recordset2 = mysql_fetch_assoc($Recordset2);
$totalRows_Recordset2 = mysql_num_rows($Recordset2);
echo $row_Recordset2['title'];
mysql_free_result($Recordset2);
?></div>
<div class="vis">مشاهده : <?php echo $row_rs_post['visit']; ?></div>
<div class="scr">نظرات : <?php

$news_id = $row_rs_post['id'];
mysql_select_db($database_cn, $cn);
$query_Recordset1 = "SELECT * FROM ne_nazar WHERE id_post = {$news_id} AND active = '1'";
$Recordset1 = mysql_query($query_Recordset1, $cn) or die(mysql_error());
$row_Recordset1 = mysql_fetch_assoc($Recordset1);
$totalRows_Recordset1 = mysql_num_rows($Recordset1);
echo $totalRows_Recordset1;
mysql_free_result($Recordset1);
?></div></div></div>
<div class="pastcon"><p align="center"><font color="#000000"><?php echo $row_rs_post['kholase']; ?></font></p>
<br></div><div class="pastmor"><div class="mro"><a href="post-view-<?php echo $row_rs_post['id']; ?>-<?php echo $row_rs_post['title']; ?>">ادامه</a></div>
<div class="rate">
<style>
.dislike{background:url(images/dislike.png) no-repeat !important;
border:none;
width:25px;
}
.like{background:url(images/like.png) no-repeat !important; border:none;
width:25px;
}
</style><script type="text/javascript">
//<![CDATA[
function likeloadFile()
{
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{ document.getElementById("divid1").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","get-ajax.php?id=<?php echo $row_rs_post['id']; ?>&like=1",true);
xmlhttp.send();
}
function dislikeloadFile()
{
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("divid2").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","get-ajax.php?id=<?php echo $row_rs_post['id']; ?>&dislike=1",true);
xmlhttp.send();
}

//]]>
</script>
<input type="button" class="like" onclick="likeloadFile()">می پسندم(<?php echo $row_rs_post['like']; ?>)</button>

<input type="button" class="dislike" onclick="dislikeloadFile()"> نمی پسندم(<?php echo $row_rs_post['dislike']; ?>) </button>
<div id="unit_long1611">

</div>
</div><div class="psti"><?php echo $row_rs_post['date']; ?></div></div></div>

<?php } while ($row_rs_post = mysql_fetch_assoc($rs_post));} ?>
کد های فایل get-ajax.php
<?php require_once('../Connections/cn.php');  
if (!function_exists("GetSQLValueString")) {
function GetSQLValueString($theValue, $theType, $theDefinedValue = "", $theNotDefinedValue = "")
{
if (PHP_VERSION < 6) {
$theValue = get_magic_quotes_gpc() ? stripslashes($theValue) : $theValue;
}

$theValue = function_exists("mysql_real_escape_string") ? mysql_real_escape_string($theValue) : mysql_escape_string($theValue);

switch ($theType) {
case "text":
$theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
break;
case "long":
case "int":
$theValue = ($theValue != "") ? intval($theValue) : "NULL";
break;
case "double":
$theValue = ($theValue != "") ? doubleval($theValue) : "NULL";
break;
case "date":
$theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
break;
case "defined":
$theValue = ($theValue != "") ? $theDefinedValue : $theNotDefinedValue;
break;
}
return $theValue;
}
}
$colname_Recordset1 = "-1";
if (isset($_GET['id'])) {
$colname_Recordset1 = $_GET['id'];
}
if(isset($_GET['like'])){
mysql_select_db($database_cn, $cn);
$query_Recordset1 = sprintf("SELECT * FROM ne_post WHERE id = %s", GetSQLValueString($colname_Recordset1, "int"));
$Recordset1 = mysql_query($query_Recordset1, $cn) or die(mysql_error());
$row_Recordset1 = mysql_fetch_assoc($Recordset1);
$totalRows_Recordset1 = mysql_num_rows($Recordset1);
$updateSQL = sprintf("UPDATE ne_post SET `like`=%s WHERE id={$_GET['id']}",
GetSQLValueString($row_Recordset1['like']+1, "int"),
GetSQLValueString($_GET['id'], "int"));

mysql_select_db($database_cn, $cn);
$Result1 = mysql_query($updateSQL, $cn) or die(mysql_error());
}
if(isset($_GET['dislike'])){
mysql_select_db($database_cn, $cn);
$query_Recordset1 = sprintf("SELECT * FROM ne_post WHERE id = %s", GetSQLValueString($colname_Recordset1, "int"));
$Recordset1 = mysql_query($query_Recordset1, $cn) or die(mysql_error());
$row_Recordset1 = mysql_fetch_assoc($Recordset1);
$totalRows_Recordset1 = mysql_num_rows($Recordset1);
$updateSQL = sprintf("UPDATE ne_post SET `dislike`=%s WHERE id=%s",
GetSQLValueString($row_Recordset1['dislike']+1, "int"),
GetSQLValueString($_GET['id'], "int"));

mysql_select_db($database_cn, $cn);
$Result1 = mysql_query($updateSQL, $cn) or die(mysql_error());

}
mysql_free_result($Recordset1);
?>
مشکل از چیه؟ از حلقه ی php ؟ ممنون میشم بگین چجوری اصلاحش کنم
تا آنجا که کدهای شما را بررسی کردیم حلقه ای وجود نداشت! حلقه ها در PHP یا از نوع for هستند یا while (عبارت do به تنهایی حلقه نیست و در کنار while به کار می رود) و یا foreach، ضمن اینکه استفاده از حلقه برای کپی اسکریپت به تعداد نظرات کار کاملا اشتباهی است، روش صحیح این است که کد اصلی اسکریپت (کد ای جکس) را یک بار در صفحه قرار دهید و در عوض موارد داینامیک را به عنوان ورودی در هنگام فراخوانی به کد بدهید، به فرض برای هر نظر شماره نظر و سایر موارد مورد نیاز را به عنوان آرگومان تابع خروجی دهید، مثال:
<input type="button" class="like" id='like-22' onclick="likeloadFile('22', 'this.id')">
که در اینجا ما در آرگومان اول شماره نظر و در آرگومان دوم به فرض آی دی مربوط به نظر شماره 22 را به تابع likeloadFile می دهیم و باقی فرآیند با توجه به ورودی ما در موتور ای جکس انجام می شود.
۲۳:۲۲ ۱۳۹۱/۱۰/۲۴
باتشکر از راهنماییتون.
من حلقه رو به صورت زیر دادم که تو نظر قبلی هم هست. خوب مشاهده نکردید:
do {
<?php } while ($row_rs_post = mysql_fetch_assoc($rs_post));} ?>
نکته ی مهم تر اینکه کدی که گفتین رو نمونه ی خودم پیاده سازی کردم، اصلا دیگه چیزی تو بانک آپدیت نکرد!!
حالا سوال اینه که تو قسمت کد آژاکس جای این کد زیر چجوری بدم؟:
xmlhttp.open("GET","get-ajax.php?id=101&dislike=1",true);
حالا اگه موتور آژاکسی فقط 1 بار تو صفحه بزارم. و با روشی که گفتین بیام و به دکمه های لایک و دیسلایک هر خبر id های همون خبرو بدم. تا اینجاش رو انجام دادم.
ولی به جای
xmlhttp.open("GET","get-ajax.php?id=101&dislike=1",true);
چی بدم که بیاد مقادیر رو از id و onclick بگیره؟؟
بله، اشتباه از ما بود، متوجه while پایانی نشدیم، اما برای مشکل فعلی کافی است به تابع خود (در کد ای جکس) آرگومان بدهید، به طور مثال:
function dislikeloadFile(comment,id){...}
و در هنگام فراخوانی با onclick آرگومان ها را به تابع ارسال کنید (مانند مثالی که در پاسخ قبل نوشتیم)، اکنون در تابع می توانید از آرگومان ها استفاده نمائید، به فرض:
xmlhttp.open("GET","get-ajax.php?id="+comment+"&dislike=1",true);
برای تست هم می توانید از alert در جاوا اسکریپت مقادیر آرگومان ها را بررسی کنید، به طور مثال در داخل تابع بنویسید:
alert(comment);
با اجرا شدن تابع، دستور alert مقادیر فعلی آرگومان comment را در یک پنجره هشدار نشان می دهد (که این کار برای خطایابی و درک نحوه عملکرد کد کاربرد زیادی دارد).
۲۰:۴۰ ۱۳۹۱/۱۰/۲۵
با تشکر از لطفتون و سایت مفیدتون. تقریبا همه ی مطالب سایتتون رو تونستم استفاده کنم، به جز این یکی رو!!
قسمت های همه کد من این:
<script type="text/javascript">
//<![CDATA[
function dislikeloadFile(comment,id)//اینجا چی باید باشه
{
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("divid2").innerHTML=xmlhttp.responseText;
}
}
url='index.php?user='+document.getElementById('user').value;
xmlhttp.open("GET","get-ajax.php?id="+comment+"&dislike=1",true);//اینجا چی باید باشه
xmlhttp.send();
}
//]]>
</script>
<?php do {?>
<input type="button" class="like" id='2' onclick="likeloadFile('2', '2')">می پسندم(<?php echo $row_rs_post['like']; ?>)</button><!--اینجا چی بذارم-->
<input type="button" class="dislike" id='2' onclick="dislikeloadFile('2', '2')"> نمی پسندم(<?php echo $row_rs_post['dislike']; ?>) </button>
<div id="unit_long1611">
</div>
</div><div class="psti"><?php echo $row_rs_post['date']; ?></div></div></div>
<?php } while ($row_rs_post = mysql_fetch_assoc($rs_post));} ?>
3 جاش رو مشکل دارم.
خواهش می کنیم، اما مشکل شما ناشی از آشنا نبودن با جاوا اسکریپت یا لااقل بحث توابع در جاوا اسکریپت است، به طور مختصر، در قسمت onclick (یعنی هنگام فراخوانی تابع ای جکس) شما می توانید مقادیری را به عنوان آرگومان (ورودی تابع) به تابع بدهید، اینکه آرگومان ها چه باشند بستگی به هدف و نیاز برنامه شما دارد، به فرض اگر به آی دی هر نظر نیاز است (یعنی در کد جاوا اسکریپت یا PHP از آی دی نظرها برای هدفی استفاده می شود) آی دی را به عنوان یک آرگومان قرار می دهیم، مثال:
<input type="button" class="like" id="like" onclick="likeloadFile('421');">
در اینجا 421 همان آی دی نظر است (که می تواند به صورت داینامیک و بسته به هر نظر، متفاوت درج شود)، تابع ما باید آرگومان مورد نظر را دریافت کند، پس برای تابع هم آن را تعریف می کنیم (هر چند ابتدا باید برای تابع تعریف می کردیم و بعد از آرگومان ها استفاده می شد):
function dislikeloadFile(comment){...};
برای comment در اینجا نباید چیز دیگری بنویسید چون خود آن آرگومان است و مقادیرش بسته به زمان فراخوانی تابع با onclick می تواند متغیر باشد (به فرض در اینجا مقادیر آن 421 است).
حال از این آرگومان می توان در ادامه تابع استفاده کرد، به فرض ما آن را برای ارسال مقادیر آی دی نظرها در قسمت مربوط به متد GET نوشته ایم، به این صورت با اجرای کل کد آدرس زیر (به صورت ای جکس) از سرور (فایل PHP) درخواست می شود:
get-ajax.php?id=421&dislike=1
همان طور که ملاحظه می کنید عدد 421 در واقع همان آرگومان اولیه ما بود که موقع فراخوانی تابع به آن نسبت داده بودیم، اما برای ایجاد حالت داینامیک و جاگذاری خودکار آرگومان و مقدار آن در هنگام ارسال درخواست، آن خط را به صورت زیر می نویسیم:
xmlhttp.open("GET","get-ajax.php?id="+comment+"&dislike=1",true);
امیدواریم توضیح کافی بوده باشد. :-)
۱۰:۵۳ ۱۳۹۱/۱۰/۲۶
با تشکر از وقتتون و علمتون.
درست شد. به بهترین شکل ممکن. واقعا سایتت حرف نداره.
منتظر مطالب بعدیت هستیم حاجی.
مهدی
۰۱:۲۳ ۱۳۹۲/۰۳/۱۸
با سلام
توی قسمت پست که فقط یه دکمه هست چطور میشه یه فیلد اینپوت باشه که نام سایت رو بخواد و بعد از کلیک روی دکمه نام سایت رو نشون بده
متد POST یک استاندارد HTTP است و الزاما مربوط به فرم های HTML نیست، به هر صورت برای ارسال اطلاعات فرم از طریق ای جکس مطلبی جداگانه در بخش آموزش های کاربردی وجود دارد.
میلاد
۱۰:۲۵ ۱۳۹۲/۰۳/۲۳
سلام
لطفا ساختاری فایل get-post.php رو هم بزار .
ضمن تشکر از یادآوری، نام فایل به اشتباه get-post.php درج شده، صحیح آن ajax-get.php است!، مطلب اصلاح شد.
سینا
۰۰:۴۰ ۱۳۹۲/۰۴/۲۵
سلام. من می خوام با استفاده از آجاکس چند تا مقدار استخراج شده از دیتابیس دریافت و به عنوان پارامتر تو دستورات جاوا استفاده کنم. مثلا دستور زیر مربوط می شه به کد api دسترسی به نقشه گوگل که من قصد دارم دو تا مقدار a و b رو با استفاده از آجاکس از یه فایل php دریافت کنم و در داخل این دستور استفاده کنم. لطفا راهنمایی کنید
var myLatlng = new google.maps.LatLng(a,b)
اگر با Ajax آشنا باشید، پس از ارسال درخواست، پاسخ سرور (فایل PHP) در xmlhttp.responseText وجود دارد، لذا می توان از این پاسخ در تابع برگشتی (callback function) به نحو دلخواه استفاده کرد، به فرض زمانی که xmlhttp.readyState برابر 4 شد، یک تابع یا هر کد دلخواه دیگر را درون شرط if اجرا کنید، برای مقادیر آرگومان هم می توانید پاسخ را به صورت مستقیم (به طور مثال پاسخ a باشد)، یا پس از تجزیه با متدهایی مانند split (به طور مثال برای حالتی که پاسخ به صورت a|b باشد) استفاده کنید.
سینا
۰۱:۰۳ ۱۳۹۲/۰۴/۲۶
متاسفانه من زیاد جاوا اسکریپت بلد نیستم. ممنون میشم کمک کنید. مثلا مقدار بازگشتی که از دیتابیس استخراج شده اینجوریه
34.780888
47.59861
حالا با چه دستوری می تونم مقدار سطر اول رو در یه متغیر و سطر دوم رو در یه متغیر دیگه قرار بدم؟ یا مثلا مقدار دریافتی زیر:
34.780888*47.59861
چطور مقدار قبل از * رو در یک متغیر و بعد از * رو در یه متغیر دیگه بریزم. من از این استفاده کردم اما جواب نداد
stringobject.slice ( start , end )
از split استفاده کنید، مثال:
<script type="text/javascript">
var str = '34.780888*47.59861';
var splited = str.split("*");
alert('پارامتر اول: ' + splited[0] + ' پارامتر دوم: ' + splited[1])
</script>
سینا
۰۹:۲۲ ۱۳۹۲/۰۴/۲۷
ممنون از شما. عالی بود
سینا
۱۳:۳۲ ۱۳۹۲/۰۴/۲۹
سلام مجدد. می خواستم راهنمایی کنید چجوری می تونم آرایه ای از چک باکس ها رو از این طریق ارسال کنم ؟ من یه فرم متشکل از 5 تا چک باکس دارم که مقادیر رو با جاوا دریافت کردم. حالا چجوری این آرایه رو با آژاکس ارسال کنم ؟ البته اونایی کنه انتخاب شدن
عبارت "پردازش" را در قسمت جستجوی سایت وارد کنید، در مطلبی جداگانه در این خصوص توضیح داده شده.
نکته: برای ارسال اطلاعات به صورت آرایه از طریق ای جکس، باید ابتدا مقادیر آرایه را به متغیرهایی جداگانه تجزیه و به صورت حالت عادی (یعنی پارمتر و مقدار) درآورید، ارسال مستقیم آرایه از این طریق ممکن نیست (تست نشده).
۱۸:۲۴ ۱۳۹۲/۰۶/۲۲
در مورد دریافت اطلاعات از یک هاست دیگر میشه توضیح بدید
مثلا آدرس
http://w3schools.com/ajax/demo_get.asp
رو با ایجکس بگیریم و نمایش بدیم
انگار به جهات امنیتی این قابلیت کار نمیکنه
بله، کدهای جاوا اسکریپت (و به طبع Ajax) از قانون Same Origin Policy تبعیت می کنند که به طور ساده یعنی فعل و انفعالات اینچنین باید در چارچوب دامنه سروری باشد که کدها در آن اجرا می شود، تنها راه کاربردی در اینجا این است که درخواست را به یک فایل PHP در سرور خود ارسال کنید و در آن فایل با استفاده از توابعی مانند file_get_contents مقادیر را از سایت دیگر دریافت کنید و به درخواست ای جکس به عنوان پاسخ، خروجی بدهید.
mohsen
۱۴:۳۴ ۱۳۹۲/۰۸/۰۸
ایا از طریق اژاکس میشه مقدار یه فیلد رو به سمت سرور فرستاد بدون اینکه از فرم استفاده کرده باشیم
بله، کافی است مقادیر فیلد را با جاوا اسکریپت دریافت و به عنوان یک پارامتر در قسمت URL درخواست Ajax تنظیم و به سرور ارسال کنید (نیاز به آشنایی با جاوا اسکریپت و ای جکس است).
mohsen
۱۵:۰۹ ۱۳۹۲/۰۸/۰۹
تشکر می خواستم درباره ی زبان XML بدونم یعنی اینکه این یه زبان کاملا مجزا هست و برای کار با اژاکس حتما باید این زبان رو یاد بگیریم؟ ایا راهی هست بدون یادگیری این زبان با اژاکس کار کرد
برای یادگیری Ajax نیازی به داشتن دانش XML نیست، XML یک استاندارد تعریف شده است (یک زبان برنامه نویسی نیست) که با مجموعه ای از قواعد خود به صورت تگ متنی، ارتباط خروجی و ورودی بین سیستم ها و نرم افزارهای مختلف را میسر می کند.
more لطفا پیش از ارسال دیدگاه نکات زیر را مد نظر داشته باشید:
- به سوالات کلی، زمانبر، مبهم و مشکلاتی که تلاشی برای رفع آنها نکرده باشید پاسخ مختصر داده شده یا به بخش برنامه نویسی اختصاصی ارجاع داده می شوند.
- کدها و اسکریپت های طولانی را ترجیحا در یک صفحه وب آنلاین یا به صورت حساب موقت و آزمایشی قرار دهید تا امکان بررسی دقیق مشکل و خطایابی میسر باشد.
- تمام دیدگاه های ارسالی خوانده شده و برای هر کاربر مدت زمان لازم جهت پاسخگویی در نظر گرفته می شود، لطفا از طرح سوالات متعدد در بازه زمانی کوتاه خودداری کنید.



 refresh
10 × 10
9 × 5
20 × 20
=
آخرین دیدگاه ها
more برای دسترسی سریع به یادداشت مربوطه می توانید از لینک مطلب در کادر زیر استفاده کنید.
سیدعباسی
با تشکر از شما استاد خیلی خوب بود من میخوام فقط آخرین لینک رو بصورت خروجی داشته باشم که شامل post باشه یعنی فقط این...
۱۴۰۳/۰۷/۲۸

سیدعباسی
برای کدی که فرستادم من از این الگو استفاده می کنم میخواهم از لینکهایی شروع کنه که شامل عدد باشن و آدرس سایت به...
۱۴۰۳/۰۷/۲۸

سیدعباسی
با سلام و خسته نباشید من میخوام از سایت مپ زیر لینک اول که شامل post است رو استخراج کنم یعنی خروجی من این نباشه...
۱۴۰۳/۰۷/۲۸

سیدعباسی
با سلام من میخوام از متن زیر لینکش رو دربیارم و در آخر مقدار 3088 رو بصورت خروجی نهایی داشته باشم با...
۱۴۰۳/۰۷/۰۷

مجتبی
سلام وقت بخیر میخوام یک روز به تاریخ دریافتی اضافه شه ممنون میشم راهنمایی کنید
۱۴۰۳/۰۶/۲۰

پرتو
سلام خوبید؟ خسته نباشیذ ببخشید مزاحم شدم می خواستم بگم من به شما ایمیل زدم ولی هنوز شما جواب ندادین می تونم بپرسم چرا سوال...
۱۴۰۳/۰۶/۱۵
  در انتظار بررسی: ۰
 پاسخگویی به سوالات ممکن است تا ۲۴ ساعت زمان ببرد.