Reload content page after delete a object via AJAX - php

I have a button and I want this to call a event via AJAX. This event is for delete a DB record so I want the content updated without the delete value/row. I think maybe I should put my code in the success of the .ajax call but my doubt goes to how to refresh the content? Do I need a second AJAX call to get the new content without the deleted value/row?
Thanks in advance

If you are using ajax then why are you refreshing page ? We use ajax to avoid page refresh. Still if u need it u can try add window.location.reload(); function in your ajax.success() function. here is a example in case its useful to you http://www.amitpatil.me/ajax-table-adding-removing-rows-dynamically-using-javascript-animation/

You can have it in the same call. In the DELETE script that the ajax call is pointing to just add on the query and send the data back using json_encode().
Then you simply update that specific area of the page.
Alternatively if you want to be lazy, after a success return from the ajax, simply do:
window.location.reload();
which will refresh the page.

If you use AJAX for delete records than you don't need reload all page content (it's a goal of AJAX). In this case you must change you content with JavaScript DOM element removing.
If you delete some record with AJAX with some id you performe something like:
$("#deleteBtn").click(function() {
// detect ID of the record (var id = ...)
// call AJAX with post(...) or ajax(...)
$("#id" + id).remove();
});
Or better if you perform remove() function on AJAX result for more security and remove it only if your server side script really have delete the record from DB.
In my example assumed that you use id attribute of the your rows (or other HTML elements) for storing id of the record for access in future via $("#id" + id). You need some entry point for find your DOM element by record id.

As I see it, there are who ways of doing this.
1: wrap your rows in a container with the unique ID from the database row, and then use that ID to remove/hide the row that you just deleted from your page.
2: as you mentioned, you can fetch the data again and print it, but this won't be very efficient performance-wise.
/regards

Related

How to update database with server-side information without reloading the page

I'm developing a like/dislike system using php and MySQL, but I have a problem. When I add a like, let's say, I do it by adding a row to the likes table, that contains the post id and the user id. The user id is stored in a $_SESSION, and I can't just pass it to the html and make a AJAX request to run some php code and add the like, because this way it's too easy to simply change the user id.
So basicaly I don't want to reload the page to first get the $_SESSION value but I don't now how to get it's value after the page has loaded. I don't know if this is doable with php only, if not, what language should I use
if you're using send ajax request for saving the like or dislike value. after saving the like/dislike value. you have to return a new like value count. in PHP simply echo the value that will automatically come to your ajax success if not simply return the new like/dislike info, encode with JSON and return the value.
get these values in the success function and target the like and dislike button or div and change the new value with an ajax response.
if you want to code answer please share your code here so it's better understood by everyone

read datatable again after clicking the submit Button

I want my dataTable to be read again or reload the data from db after clicking update/submit button.
i tried this
$('#ManageForms').dataTable().dataSource.read();
it seemed to work with kendoUI but i guess datatables must have different procedure.
If you want to reload the entire table then fnReloadAjax() is the way to go. It will go to the server, and just grab everything again.
Example:
var table = $('#example').dataTable();
// Example call to load a new file
table.fnReloadAjax( 'media/examples_support/json_source2.txt' );
// Example call to reload from original file
table.fnReloadAjax();
If you want to load only the data that should be displayed, then you need to use the bServerSide parameter, and have the server reply to your request, taking into account, filtering etc.

retrive from DB without click any button using onfocus

hi I have some problem with my code!
I have a textbox when the user write in this text box I want to retrieve from DB directly without clicking any button.
then some of my form will completed after writing in this textbox.
my JS code :
function centerIDfocus()
{
var id = document.getElementById("centerID").value;
var data = <?php $center_ID = echo mysql_num_rows(mysql_query("SELECT * FROM 'examcenter' WHERE 'id' = '".id."'")); ?> ;
}
window.onload = addEventsToHTML;
in my form:
<input name="centerID" id="centerID" onfocus="centerIDfocus();">
and that’s not working!
any ideas red face
You mixed 2 languages - javascript is run on client side and php on server side.
What You need to do is:
var data = function_to_get_data(); // in javascript
in that function call ajax request to the address of your php script - and only in that php script call your database to return desired data
You're PHP code will only run once, when the pages is loaded, after that it won't run again because there's nothing happening on the server side. If you want to run it each time you get the focus then you should be using AJAX.
Take a look at AJAX gets, I'm pretty sure that's what you want:
http://api.jquery.com/jQuery.get/
It is rather hard to know what you are intending to do, but...
My guess is that you are confused about when things happen and when "onfocus" is fired.
PHP is run on the server when the page is being constructed. In contrast, javascript is run in the browser, either after the constructed page has arrived (onload) or in response to a user click or other event such as onfocus.
Thus there is no way for the javascript (in the browser) to drop into PHP (on the server). For the same reason (and security) it is impossible for javascript to talk directly to the database.
There are two approaches you might take to do what (I think) you are attempting to do.
You could create a javascript array in PHP, indexed by ID, and containing all possible IDs and their data. Use PHP to read the database, and then echo the javascript to define the array. This would become part of the page sent. Then, in response to the event that means you want to fill the field, you extract the data from the array, and put it where you want it. This would be slow for the page to load, but very quick response to the click that triggered the change.
An alternative is to use ajax. The easiest way is to use jquery to send a GET request to the the server requesting the data related to the ID. The server must respond to that URL by extractign the ID, reading the database and generating the reply. I recommend using JSON. Then, when the jquery request returns, the javascript code can move the data from the JSON into your field. This would make the initial page lighter, but would have a fetch delay to the triggering click.
However I think you may also have an issue with the on-focus event. This fires when the user moves the cursor into the field, before they have entered any data. At that point it will contain the data that was set in the HTML. If you can set the ID at that point, you can also set it to the data from the database.
I think you want two fields - one for the ID and another for the looked up data. Then you run the javascript on the onblur event on the ID field.
Hope that helps.
use something like:
$('.centerID').keyup(function(){
var val = this.val();
var url = '/do.php'; // url to a php script
var val = 'action=checkValue&value='+val; // send it the value
$.getJSON(url, val, function(data){
// Something to do when you get the data back
});
});
then just create a php script that checks the database and returns a JSON answer and then do as you please with it.
BTW - I'm assuming you are ok using jQuery. You can apply this to your JavaScript too.
I used keyup() as one example but you can appy this to keydown(), click(), focus(), focusout() etc...
I have a do.php script that contains a switch statement with the possible value of action= and returns JSON. Everything from logging in, registering, activity monitor, to updating a database field without leaving the page.

Dynamic document.title using a $_SESSSION variable

I have a page that uses ajax to show users their current assignments. Instead of having to refresh the page to see if there are any updates, I'm using ajax to update the data every 4 seconds. It's been requested that I change the document title to show something like "Number of Tasks: 4" and have that update as well when the user either completes a new task, or gets assigned another one. I tried using a simple "setInterval" javascript function, but since PHP is server side, the variable piece doesn't update...
I've also tried setting "document.title" from within the ajax code, but that just plain didn't work.
Is there a simple way to update the document title to show the number of tasks assigned to the user viewing the page?
Return the value from the $_SESSION in the data sent with the AJAX response to the client Javascript code. Once you have it on the client side set whatever you need to it with javascript.
You'd have to call with ajax a php dedicated to return you only the number of tasks (and other information you may want).
To change the title you can just call document.title = "the data returned in ajax";.
And put all this code (ajax call and title set) inside a function with setinterval as you mentioned.

display records randomly one after another

I want to display 5 records from a database with in a td one after another (about 60sec). How will i do this, with out the need of page refreshing? I don't know any idea about ajax
So you want the contents of one cell be replaced continually? In that case, you have to use AJAX to retrieve your data and a timer to trigger this retrieval and contents change.
You don't have to use AJAX. You can put the content you want to refresh in an iframe, and the framed webpage will have a meta refresh header. This type of thing has been done for years before AJAX existed.
by using you can achieve
Algorithm :
Create the td with some id.
Send the ajax request( for require time of interval )
Get the random rows from by ajax , and put the values
into that specific row id using innner.HTML
That's all it will work.
If you want to know how to use ajax refer this below url
http://www.w3schools.com/php/default.asp
In this case, have to use AJAX

Categories