CODEWITHSUNDEEP
phpmysqlajax
Mandirigma
Mandirigma

Reputation: 29

MySQL database update through AJAX and PHP

I have been going to stackoverflow for hints and tips in my programming journey but I have yet to register. . .till now.

My question is, is it possible to update/edit mysql data which I've inserted into an html/css table without having to go to another page?

for example: when looking at the table in my browser, I wanted to edit my email information. I could just simply press the edit button then the email field becomes a text field right on the same page then I could just update it and hit save?

thanks!

EDIT(added my code):

$(button#edit).on('click', function() {
// get email inline to this edit button
    var email = $(this).parent().siblings('td.email').html();

// change button from edit to save
$(this).attr('id', 'save-email').html('Save');

// change email display to input field
$(this).parent().siblings('td.email').html('<input type="text" id="user-email" value="'+email+'" />');
});

and this is the table I used which is formatted with php which also grabs data from my database:

echo '                    <tr>';
echo '                    <td>' . $row['name'].        '</td>';
echo '                    <td>' . $row['age'].         '</td>';
echo '                    <td>' . $row['sex'].         '</td>';
echo '                    <td>' . $row['email'].       '</td>';
echo '                    <td>' . $row['contact_no'].  '</td>';
echo '                    <td>' . $row['school_name']. '</td>';
echo '                    <td>

                        <button id = "edit">EDIT</button>';

nothing happens,your help is greatly appreciated!

Upvotes: 0

Views: 1742

Answers (4)

user2064468
user2064468

Reputation:

Yes, It is possible using AJAX.

AJAX is very powerful jQuery tool which is used to make asynchronous javascript calls which means you can submit data to another page without page loading.

As well as you can fetch data and fill dynamically in your page using AJAX without reload/load page.

You can find many tutorial and examples of AJAX.

Upvotes: 0

Drixson Ose&#241;a
Drixson Ose&#241;a

Reputation: 3641

Sharing you an idea on how it works

JS script:

$('button#update').click(function(){

  $.ajax({
    url : 'yourpagehere',
    data : {
      id : '1' // send sample data to url
    },
    type: json,
    sucess: function(response){

     //Your script

   });
  });

});

PHP:

function yourpagehere(){

 $id = $_POST['id']

 $result = updateUserInfo($id); //Your script updating info in your database

 json_encode($result); //Your response
}

Then you use firebug and check the console log on what you're ajax returned.

Upvotes: 0

Ronak Patel
Ronak Patel

Reputation: 390

Yes. It's possible. Make a hidden div tag in your html code. By means of ajax when you press button that div tag will be filled up by textbox / text.

Go through some tutorials related to ajax.

Upvotes: 0

Lars Ebert-Harlaar
Lars Ebert-Harlaar

Reputation: 3537

Yes, it is possible. Here are a few hints:

  1. Use jQuery to listen to a click-event on the button and insert the text-field.
  2. On Submit, use jQuery to send an ajax-request to a different php-file (like save.php).
  3. Inside this file, you can do any mysql-queries you would normally do.
  4. Again through jQuery, display the result of the queries to the user.

Upvotes: 1

Related Questions