Jump to content

Need Help About Using Ajax To Submit The Form Without Page Changing


lovekit
 Share

Recommended Posts

I've asked my questions in HTML forumand someone answer me that I may need to use AJAXand all I've been knew about AJAX is , It's a technic to use javascript right?, or I misunderstood ?so I try to read and understand the tutorials in this websitebut I'm too foolish to understand it :) and I consider to post my topic again in this JAVA forum categorythis is my questions:1. Which one of javascript I have to know to do what I want2. If it's too hard to learn that script for newbie (it's me, I'm just a beginer of website coding) Would you please me by tell me the command or guide me3. If I need to lean about AJAX . What is the knowledge I must knowing beforeThanks you all=This is my Questions which I copy from my topic= ; link=http://w3schools.invisionzone.com/index.php?showtopic=28583

How can I make my web page sending a form submit without link to that page- = I'm not good in using English language So I'll try to explain you my problem = -I want to make a page with a form (or Poll) to ask visiter somethingBut, How to make [submit] or [send] button to do just sending detail (or anything they're typeing in the field of the form)just send form submit to my receiver&storage pageI try to use target="(I tested all type)"in that formbut it still redirect my page to my receiver pageI want it to be just staying on that page , not change the pageOr maybe just show alert "your comment was received Thank you for comment" << like this (it's just sample)I knew, that AJAX can help me this problembut I've been a foolish one. I don't understand it enough to use AJAXand I think, that must have anyway to do this by using just HTML JAVASCRIPT or PHP (I'm trying to understand PHP now but i'm just beginer)so if you understand my question (that I think, I use a little wrong word or phase, B'cos I'm not good in English language)Please help meThanks for the answerThanks you to read my questionsThanks you all
Link to comment
Share on other sites

AJAX will do what you want, but it is not for JavaScript beginners. There is nothing specific you need to know about JavaScript; you just need a general understanding, and that means practice.If you don't understand PHP yet, what document on your server are you sending your form to? Something you wrote, something someone else wrote, or something that doesn't exist yet?Writing a response to a form request can be as simple or difficult as you want it to be. You can return a single character or a 300 lines of HTML. Your choice.

Link to comment
Share on other sites

I would highly recommend using jQuery for anything AJAX related. It turns 15 lines of code into one (because creating the necessary object for making AJAX calls is browser specific, you have to try a variety of different ways before you can be sure you have created one, and then using it is complicated too.)All you need to do to use jQuery is DL the lastest version from jQuery.com and link to the library as you would any external .js file:<script type="text/javascript" src="jquery-1.3.2.js"></script>Once you have it working, an AJAX call might look like this:

$.post('file.php', {'name':'value','name2':'value2'}, function(data) {if(data == 'y') {//user logged in successfully} else if(data == 'n') {//user didn't log in correctly}});

For this to work, you need to capture a form's submit and stop it from acting as normal. I have had some problems with doing this the normal way, which is to assign a handler to capture the submit event and return false. Using jQuery syntax, starting from the beginning, the login function might look like this, assuming your form has an id of 'login':

$(document).ready(function() {$('#login').submit(function() {username = $('#username').val();password = $('#password').val();$.post('file.php', {'username':username,'password':password}, function(data) {if(data == 'y') {//user logged in successfully} else if(data == 'n') {//user didn't log in correctly}});return false;});});

For my AJAX functions I usually use a button or construct one out of a styled link because sometimes returning false doesn't prevent the form submit event (anyone know why?).Now, you do need to know a server side language as well, obviously, but you need that for logging in anyway, so I assume you know what you're doing there. The consideration to make with using AJAX for important operations is that not everyone has JavaScript enabled. JavaScript should bring enhancements, it should not replace solid server side code. So, if JavaScript is turned off, your login button won't return false and your form should point to a script that will do the logging in the old fashioned way with page refreshes. I am sort of evangelical about jQuery because it makes life a lot easier, but there are of course ways of doing this with vanilla JavaScript, it just takes more code.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...