اسکریپت FORM تماس با PHP و AJAX
در دنیای وب، فرمهای تماس ابزارهای حیاتی برای ارتباط با کاربران محسوب میشوند. با استفاده از PHP و AJAX، میتوانیم تجربه کاربری بهتری ایجاد کنیم. این دو تکنولوژی به ما امکان میدهند تا بدون بارگذاری مجدد صفحه، اطلاعات فرم را ارسال کنیم.
۱. ساختار HTML فرم تماس
ابتدا، یک فرم ساده HTML طراحی میکنیم:
```html
<form id="contactForm">
<label for="name">نام:</label>
<input type="text" id="name" name="name" required>
<label for="email">ایمیل:</label>
<input type="email" id="email" name="email" required>
<label for="message">پیام:</label>
<textarea id="message" name="message" required></textarea>
<button type="submit">ارسال</button>
</form>
<div id="response"></div>
```
۲. کد AJAX برای ارسال فرم
حالا، از AJAX استفاده میکنیم تا اطلاعات فرم را به سرور ارسال کنیم.
```javascript
document.getElementById("contactForm").addEventListener("submit", function(event) {
event.preventDefault(); // جلوگیری از بارگذاری مجدد صفحه
var formData = new FormData(this);
fetch("process.php", {
method: "POST",
body: formData
})
.then(response => response.text())
.then(data => {
document.getElementById("response").innerHTML = data; // نمایش پاسخ سرور
})
.catch(error => console.error("Error:", error));
});
```
۳. پردازش اطلاعات با PHP
در نهایت، باید یک فایل PHP به نام `process.php` ایجاد کنیم تا اطلاعات دریافتی را پردازش کند.
```php
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
$name = htmlspecialchars($_POST['name']);
$email = htmlspecialchars($_POST['email']);
$message = htmlspecialchars($_POST['message']);
// اینجا میتوانید کد ارسال ایمیل یا ذخیره اطلاعات را اضافه کنید
echo "پیام شما با موفقیت ارسال شد، $name!";
} else {
echo "درخواست نامعتبر است.";
}
?>
```
نتیجهگیری
استفاده از PHP و AJAX برای ایجاد فرم تماس، نه تنها فرآیند ارسال را سریعتر میکند بلکه تجربه کاربری را نیز بهبود میبخشد. با این روش، کاربران میتوانند بدون بارگذاری مجدد صفحه، پیامهای خود را ارسال کنند. این تکنیک به سادگی میتواند در پروژههای مختلف وب استفاده شود.