Question

Another question by a newbie. I have a php variable that queries the database for a value. It is stored in the variable $publish and its value will change (in the database) when a user clicks on a hyperlink.

if ($publish == '') { 
Link to publish.html
} else { 
Link to edit.html
} 

What is happening in the background is i am querying a database table for some data that i stored in the $publish variable. If the $publish is empty, it will add a link for publish.html in a popup. The popup will process a form and will add the data to the database and which means that the $publish is no more empty. What i would like to achieve is that as soon as the form is processed in the popup and a data has been added to the database, the link should change to edit.html. This can happen when the page will re-query the database but it should happen without page refresh.

How can it be donw using javascript, jquery or ajax?? Please assist.

Answer 1

Javascript by itself cannot be used to deal with database. That is done using php (Or the server side language of your choice). Ajax is used to send a request to your php script using javascript which will in turn communicate with the db. And it doesn’t require a page refresh.

So what you are trying to do can be easily achieved using ajax. Since you mentioned jquery, you can check out the $.ajax or $.post methods in jquery which make the process even more simple.

You need to process the form using ajax. The ajax request is sent to a php script which will make the necessary changes in the database and send the new link (link to edit.html) in the response. Upon getting the response, just replace the current anchor element with the new one ..

for eg..

$.post(url, formdataobject , function (resp) {
   $("a.youra").text('edit').attr('href', resp);
});

url – where the php script is located

formdataobject – a javascript object that will have the form data as key value pairs

the third parameter is an anonymous function also known as callback function since it will be invoked only when the response is received from the server. This is because ajax requests are asynchronous.

Inside the callback function, jquery is used to change the text inside the anchor element to edit and the href attribute is changed to value that came in the response.

$.post means we are using the post method. so the parameters can be accessed as elements of $_POST array in php.
After updating the db, you can simply echo out the new link and it will be received in the response.

Also, there are other formats in which you can get the response for eg. xml, json.