CODEWITHSUNDEEP
javascriptjqueryajaxdatabaserefresh
user2962713
user2962713

Reputation: 15

Update database without refresh when making change to form field

So, I have a row in a table called player. I want to be able to update the field: "Name".

At the front end I have already displayed a form text input field with the value already automatically set to the current value of Name from the table. I have given this an id="currentName".

Using Javascript, AJAX and JQuery (or anything similar) I want to be able to have the value for Name automatically updated in the database when a user makes a change to the contents of this field.

I have looked at other resources but as I'm new to many of these languages I'm struggling to do it in my context.

Any help would be greatly appreciated.

Upvotes: 0

Views: 4016

Answers (1)

Erick Boshoff
Erick Boshoff

Reputation: 1583

using jquery ajax you can bind on change event to that field and then use ajax to update that table with the value. Now there are two ways validating the input you can use .blur when the user loses focus to check if the value has changed or you can handle a back-end check.

$("#currentName").change(function(){
        $.ajax({
                    type: "POST",
                    url: "~/yoururl/functions.php",//your url here
                    data: $(this).val(),  //this is the current value that was changed
                    dataType: 'json',
                    success: function(response) {
                        console.log("success");
                    },
                    error: function(response) {
                        console.log(response);
                    }
                });
    });

//process flow for clarity

enter image description here

Upvotes: 1

Related Questions