Well sometime you need that. If you have two submit buttons, one you want to open in the same page and the other on a new one.
Just use this:
document.getElementById(form_id).target= “_blank”;
Hope it helps!
Hi all,
Some time when you use Ajax to do an action you want to give the user an
indication that the action took place and everything went well. For example you have a text field that onchange action calls for a Javascript function that takes the value, sends it to PHP file, the PHP file gets the value and update the db and sends back to the Javascript function ‘Save’ message.
Now you want to display this message, but you also want that it will blink and disappear lets say after 3 seconds. Easy. All you have to do is from the Javascript function that gets the PHP value call to blinky function
<script type="text/javascript">
function blinky(it) {
obj = document.getElementById(it);
if (obj.style.visibility == "visible")
{obj.style.visibility = "hidden";}
else
{obj.style.visibility = "visible";}
}
blink = setInterval("blinky's1')", 250);
</script>
<span id="s1">Save...</span>
and don’t forget to pass the div id as well…
Hope it helps!
Hi all,
I think I spent hours to find a solution to this problem:
On IE when you send a var to the php in non Latin chars (like Hebrew and Arabic), the php gets it like ???
today I found someone who found a solution! it is simple and works:
http://www.phpfreaks.com/forums/index.php?topic=211522.0
Hope it helps!
Hi all,
It took me long time to get it… I wanted to check if a checkbox was checked or not.
So I used:
var checkbox = document.getElementById("checkbox_id").value;
Wrong! Wrong! Wrong!
the right way is:
var checkbox = document.getElementById("checkbox_id").checked;
which return true or false. Minor details wasted me lots of time…
Admin
Hi all,
This is a very simple, powerful and useful Ajax code that lets you submit a form using Ajax and ‘post’ method.
lets start with the form.
The most important thing is to give an ID to the form and then call to a Javascript function on submit. We will have something like:
<form action=”add_client.php” method=”post” id=”add_client” name=”add_client” onsubmit=”post_form(’add_client’); return false;”>
<input type=”text” name=”client_name” id=”client_name”>
<input type=”submit” value=”Add”>
</form>
So when you submit this form the script calls the post_form function and send the form’s id (in this case add_client).
Now on the Javascript we will use the zxml library
<script type=”text/javascript” src=”zxml.js”></script>
and we will create the function post_form:
function post_form(form_id){
var oForm = document.getElementById(form_id);
var sBody = getRequestBody(oForm);
var oXmlHttp = zXmlHttp.createRequest();
oXmlHttp.open(”post”, oForm.action, true);
oXmlHttp.setRequestHeader(”Content-Type”, “application/x-www-form-urlencoded”);
oXmlHttp.onreadystatechange = function () {
if (oXmlHttp.readyState == 4) {
if (oXmlHttp.status == 200) {
view(oXmlHttp.responseText,page_name,display_type,div_name,job_id,span_id);
}
else {
view(”An error occurred: ” + oXmlHttp.statusText);
}
}
};
oXmlHttp.send(sBody);
}
function getRequestBody(oForm) {
var aParams = new Array();
for (var i=0 ; i < oForm.elements.length; i++) {
var sParam = encodeURIComponent(oForm.elements[i].name);
sParam += “=”;
if(oForm.elements[i].checked){
sParam += “1″;
}
else {
sParam += encodeURIComponent(oForm.elements[i].value);
}
aParams.push(sParam);
}
//alert (aParams);
return aParams.join(”&”);
}
}
post_form calls to getRequestBody that gets all the form’s elements and send it back. Then post_form will submit the form to the action location (add_client.php) in the php file you should create a script that connect to the db gets the new client name from the form and insert it. Then you can generates a confirmation message on the php file (something like: echo “Client has been added”;)
Now the post_form gets back the php message and we need to decide what to do with it. Lets create a div where the message will be displayed
<div id=”messege”></dib>
Now post_form calls to the function view and sends the php’s messege to it. So function view will looke like:
function view(sText){
var el = document.getElementById(’message’);
el.innerHTML = sText;
}
that’s it… you submitted a form and got the results on the same page. Easy 
Hi all,
For beginners this could be helpful - How to get the value of each element in your page using Javascript?
Lets say you have <div id=”newid”></div>
use this:
var element_value = document.getElementById("newid").value;
Hope it helps!
Here is a sample code to use ajax:
Lets say you have a field that you want to update the db every time someone insert info there without refreshing the page or going to another page.
So the html will look like:
[code]
<input type=”text” name=”field1″ id=”field1″ onchange=”update_field()”>
[/code]
This is very basic input type.
Now to the javascript:
first we need to call to the ajax libary:
[code]<script type=”text/javascript” src=”zxml.js”></script>[/code]
now we will create the update_field() function:
[code]function update_field(){
var field1 = document.getElementById(”field1″);
var Str = “update.php?field=” + field1;
var oXmlHttp = zXmlHttp.createRequest();
oXmlHttp.open(”get”, Str , true);
oXmlHttp.onreadystatechange = function () {
if (oXmlHttp.readyState == 4) {
if (oXmlHttp.status == 200) {
save_info(oXmlHttp.responseText);
} else {
save_info(”An error occurred: ” + oXmlHttp.statusText); //statusText is not always accurate
}
}
oXmlHttp.send(null);
}[/code]
on this function we send the value of the field to a php file. On update.php we will update the the db with some php code:
[code]
$sql = “update tbl_field set field=$field”;
[/code]
Now the php return a message we need to take it and dispaly it on a div. First we will create a div on the body section:
[code]<div id=”php_message”></div>[/code]
then we will create a function save_info that we are calling it from update_field() after the php sent 400 code status (meaning everthing is ok)
[code]
function save_info(sText) {
var php_message = document.getElementById(”php_message”);
php_message.innerHTML = sText;}
[/code]
and that’s it! easy!
I really don’t remember where I found it (so I can’t give credit) but this is a great ajax library that can help you a lot to develop ajax applications.
Hi everyone,
The aim of this blog is to help you develop a better ajax applications. If you need general help or you have problems with Javascript or css this is the place to ask. I am sure you will learn to love ajax as much as I do…
Enjoy the blog!