PDA

View Full Version : سوال: چگونه از فایل Ajax برای ثبت نام استفاده کنم؟



erfanPA
جمعه 09 مرداد 1394, 21:41 عصر
سلام دوستان من بسیار مبتدی هستم و هیچی از کد های ajax و جاوا اسکریپت سر در نمیارم. از یک سایتی یک قالب html5 گرفتم که توش میتونی ایمیل ثبت کنی. اینم لینک دمو سایت: http://html5up.net/eventually
و توی استفاده از سایت گفت برای استفاده از singup form از این دو روش استفاده کن:Signup Form:

The signup form won't actually do anything (other than report back with a "thank you" message)
until you tie it to either a third party service (eg. MailChimp) or your own hosted solution.
In either case, there are two ways to go:

1. The conventional (non-AJAX) way, which pretty much comes down to pointing the form's "action"
attribute to your service/script URL. If you go this route, remove the entire "Signup Form" code
block from assets/js/main.js (since it's not needed for this approach).

-or-

2. The AJAX way. How you set this up is largely dependent on the service/solution you're using
so you'll need to consult their/its documentation. However, I have included some basic code
(under "Signup Form" in assets/js/main.js) that will at least let you interact with the
form itself.

این کدی که گفته ازش استفاده کن:

// Signup Form.
(function() {

// Vars.
var $form = document.querySelectorAll('#signup-form')[0],
$submit = document.querySelectorAll('#signup-form input[type="submit"]')[0],
$message;

// Bail if addEventListener isn't supported.
if (!('addEventListener' in $form))
return;

// Message.
$message = document.createElement('span');
$message.classList.add('message');
$form.appendChild($message);

$message._show = function(type, text) {

$message.innerHTML = text;
$message.classList.add(type);
$message.classList.add('visible');

window.setTimeout(function() {
$message._hide();
}, 3000);

};

$message._hide = function() {
$message.classList.remove('visible');
};

// Events.
// Note: If you're *not* using AJAX, get rid of this event listener.
$form.addEventListener('submit', function(event) {

event.stopPropagation();
event.preventDefault();

// Hide message.
$message._hide();

// Disable submit.
$submit.disabled = true;

// Process form.
// Note: Doesn't actually do anything yet (other than report back with a "thank you"),
// but there's enough here to piece together a working AJAX submission call that does.
window.setTimeout(function() {

// Reset form.
$form.reset();

// Enable submit.
$submit.disabled = false;

// Show message.
$message._show('success', 'Thank you!');
//$message._show('failure', 'Something went wrong. Please try again.');

}, 750);


فایل کل سایت رو هم میذارم:
http://html5up.net/eventually/download

[younes]
یک شنبه 11 مرداد 1394, 11:05 صبح
اولا جاوا و جاوا اسکریپت با هم فرق میکنند و باید این سوال تو بخش جاوا اسکریپت بپرسید. دوما شما مطلقا نمیتونید تکنیک ایجکس را یاد بگیرید مگر این که جاوا اسکریپت بدونید.

erfanPA
یک شنبه 11 مرداد 1394, 13:33 عصر
اونجا هم گذاشتم اما اگر شما بتونید روش استفاده از این کد رو به من بگید خیلی خوب میشه

erfanPA
سه شنبه 13 مرداد 1394, 13:45 عصر
لطفا راهنمایی کنید

محمد فدوی
سه شنبه 13 مرداد 1394, 17:42 عصر
دوست عزیز اولا اینکه کد شما ناقصه و چون دوتا از توابع این کد هنوز بسته نشده‌ن و حداقل به دوتا آکولاد «{» نیاز داره برای کامل شدن. کد زیاد خوش‌ریخت نوشته نشده که بشه چیز زیادی ازش فهمید. ولی حدس می‌زنم درنهایت شما به کدنویسی جاوااسکریپت به صورت دستی نیازی ندارید با این کد و فقط کافیه المنت‌های مورد انتظار این کد رو توی سند HTMLتون داشته باشید. در هر صورت بهتره به مستندات نویسنده‌ی این کد مراجعه کنید.
ثانیا اینکه همونطور که به شما گفته شد اینجا بخش جاواست و هیچ ارتباطی به جاوااسکریپت نداره. برای طرح سؤالات جاوااسکریپت باید به بخش مربوطه (http://barnamenevis.org/forumdisplay.php?160-JavaScript-%D9%88-Framework-%D9%87%D8%A7%DB%8C-%D9%85%D8%A8%D8%AA%D9%86%DB%8C-%D8%A8%D8%B1-%D8%A2%D9%86) سر بزنید.