javascript - refresh page in background or sql query using ajax on button click -


my ui (image)

hi, in ui ( image link above ) have update form information database, when edit , click cancel button erase edited information , display original information database again. (javascript code below)

<script type="text/javascript">         function reset()         {             document.getelementbyid("1").innerhtml='<?php echo $data["firstname"] ?>';             document.getelementbyid("2").innerhtml='<?php echo $data["middlename"] ?>';             document.getelementbyid("3").innerhtml='<?php echo $data["lastname"] ?>';             document.getelementbyid("4").innerhtml='<?php echo $data["address"] ?>';             document.getelementbyid("5").innerhtml='<?php echo $data["phonenumber"] ?>';             document.getelementbyid("6").innerhtml='<?php echo $data["birthdate"] ?>';             document.getelementbyid("7").innerhtml='<?php echo $data["gender"] ?>';         }     </script> 

or if click save button save changes using ajax, updated information in database without reloading page.

$(document).ready(function(){ //check if btnupdate clicked $("#save").click(function() {     var fname = $("#11").val();     var mname = $("#22").val();     var lname = $("#33").val();     var add = $("#44").val();     var phonenumber = $("#55").val();     var bdate = $("#66").val();     var gen = $("#77").val();       $.ajax(             {                 url:"adminbasicinfoupdate.php",                 type:"post",                 data:{"f":fname,"m":mname,"l":lname,"a":add, "p":phonenumber,"b":bdate,"g":gen },                 success:function(e)                 {console.log(e)                      if(e == 1)                     {                         alert("no changes have been detected!");                     }                     else                     {                         $("#fullname").html(fname+ " " + lname);                         alert("personal information has been updated success!");                         $("#note").slideup(500);                     }                 }             }         ); }); 

});

the problem after saving changes when click cancel button again display information before update not new updated information. cant figure out how fix it. think have refresh page in background or update sql query after clicking save butotn don't know how. need help. in advance.

<php session_start();  include("connection.php"); $username=$_session['username']; $sql = "select * table username='$username'"; $res=mysqli_query($con,$sql); $data=mysqli_fetch_assoc($res); ?> 

you can use approach have now, 1 minor change. instead of having reset() function set page elements emitted values, have set them variables. this:

var currentfirstname = '<?php echo $data["firstname"] ?>'; var currentmiddlename = '<?php echo $data["middlename"] ?>'; // etc.  function reset() {     document.getelementbyid("1").innerhtml = currentfirstname;     document.getelementbyid("2").innerhtml = currentmiddlename;     // etc. } 

(side note: can clean bit combining variables single structured object. can improve scope bit , not put things on window scope. there improvements made, that's outside what's being asked here.)

then following ajax operation, when data has been updated server-side, can update variables. this:

success: function(e) {     // rest of code have, , then...      currentfirstname = fname;     currentmiddlename = mname;     // etc. } 

(you can encapsulate function, refactor , clean see fit.)

once top-level state-carrying variables (current*) updated, time call reset() set page elements whatever current state of variables. when page loads sets variables state of record @ time. page used, updates variables store current state purpose of resetting form.

other approaches exist of course. reload page (maybe not ideal), or perhaps re-fetch record server in reset() function instead of using values emitted page, , on. there many ways it.


Comments

Popular posts from this blog

PHP and MySQL WP -

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

go - golang pprof for c library code -