I have a Link/URL. I am looking forward to 1) On Click, it will send an email and Update the Db , without refreshing the page 2) Change the Text of the Link and Change Url as a normal Text. Example : Url : Send Email. After Clicking : Send Email and Update Db Text after email and DB done : Informed. How to do this ?
You can't be more vague in your question? Here's the concept of AJAX for you. The onclick invokes a javascript function, lets say: send_email() The function sends a http request to a PHP or whatever scriptting language you use. (GET or POST parameters included) // POST ajaxRequest.open("POST", url, true); ajaxRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); ajaxRequest.send(q); // GET ajaxRequest.open("GET", url, true); ajaxRequest.send(q); url is the url of the php page which has code to handle the request Finally the php page outputs something. <?php echo "message sent"; exit; ?> This output is caught by the javascript function. response =ajaxRequest.responseText; Then you update your page with output document.getElementById("outputDivID").innerHTML = response;
If you are using jquery it's even easier. Have you used it or a different ajax library before? What you are trying to do is really easy and a really good opportunity to learn.
You Can Use it like onclick invokes a function sendMail() of Javascript and the function is as below HERE Note that sendMail.php is the file which will send the mail as well update the database and you have to define what will be done there as per your requirement. you have to echo the response in sendMail.php you want on the page from where you are clicking the element <script> function sendMail() { var emailID=$("#emailID").val(); // emailID should be defined as the id of the email field or // change it at both places accordingly $.ajax({ url:"sendMail.php", type: "post", data:{emailID:emailID}, success:function(output){ $("#outPutDiv").html(output); } }); } </script>
Have you used it or a different ajax library before? : No. You Can Use it like onclick invokes : How to Invoke it ?