change username settings dynamically php - php

Question

I want to change username name dynamically when user change the settings. Without refresh it should change the name. Any help would be appreciated.
settings code file:
if($User_Name != $row['USERNAME'])
{
$insert = "UPDATE USER_LOGIN SET PASSWORD = '".$New_Password."', USERNAME = '".$User_Name."' WHERE USERNAME = '".$_COOKIE['username']."'";
$result = oci_parse($con, $insert);
// Executes a statement.
$check = oci_execute($result);
if($check)
{
echo "Saved";
// Commit the changes to the table.
oci_commit($con);
}
else
{
// Rollback changes to table.
oci_rollback($con);
}
}
Admin Panel:
<div class="user">
<img src="../../img/Users/Users/Admin.jpg" align="left"/>
<a class="name">
<?php
session_start();
if(isset($_COOKIE['username']))
{
echo $_COOKIE['username'];
}
else
{
echo $_SESSION['username'];
}
?>
<span class="sm">Administrator</span>
</a>
</div>
My ajax function is like this:
<!-- Ajax function is used to post the data to databse and show result in the table without refresh -->
<script>
var frm = $('.wrefresh');
frm.submit(function (ev)
{
ev.preventDefault();
var postdata = $(this).serialize();
var path = $(this).attr("action");
var mehtodtype = $(this).attr("method").toUpperCase();
// Clear fields data. (password).
$('form :input[type=password]').attr('value','');
// Remove selected pictures field.
$('#Picture').attr('src', '../../img/User No-Frame.png');
$.ajax
({
type: mehtodtype,
url: path,
data: postdata,
success: function(data)
{
if(data === "Please Fill Entries.")
{
$('#fullname').css("border-color", "rgb(219, 46, 46)");
$('#old').css("border-color", "rgb(219, 46, 46)");
$('#new').css("border-color", "rgb(219, 46, 46)");
$('#confirm').css("border-color", "rgb(219, 46, 46)");
$('#showmediv').show();
}
}
});
});
</script>
Html:
<form class="wrefresh" action="../Code Files/User.php" method="post">
<div id="photo_settings2" style="margin-left:74px;">
<img id="Picture" src="../../img/User No-Frame.png"/>
</div>
<br><br><br><br>
<div id='Upload_Panel' style="margin-left: 32px;">
<input name='file' type='file' id='file_browse' onchange="readURL(this,'Picture')" style="cursor: pointer;"/>
</div>
<div id="delete" style="margin-top: -40px; margin-left: 198px; cursor: pointer">
<img src="../../img/Delete_Panel.png">
</div>
<div style="margin-left:144px; margin-top:-15px"></div>
<br><br>
<div class="row-form" style="margin-top:10px">
<div class="span4">Username:</div>
<div class="span8"><input id="fullname" style="border: 1px solid #918C8C" type="text" class="cNav" name="uname" value=""/></div>
</div>
<div class="row-form">
<div class="span4">Old Password:</div>
<div class="span8"><input id="old" style="border: 1px solid #918C8C" type="password" class="cNav" name="opass" value=""/></div>
</div>
<div class="row-form">
<div class="span4">New Password:</div>
<div class="span8"><input id="new" style="border: 1px solid #918C8C" type="password" class="cNav" name="npass" value=""/></div>
</div>
<div class="row-form">
<div class="span4">Confirm:</div>
<div class="span8"><input id="confirm" style="border: 1px solid #918C8C" type="password" class="cNav" name="cpass" value=""/></div>
</div>
<br>
<div class="row-fluid" style="margin-left:112px; margin-top:-05px">
<div class="span9">
<button type="submit" class="btn btn-success" style="height:28px">Save</button>
<span id="showmediv" class="label label-important" style="display: none; margin-left: 14px; margin-top:-35px">Please Enter Fields</span>
</div>
</div>
</form>

Answer 1

You need to change the username which you are showing inside
<a class="name">
in ajax success callback like this:
I am not sure it will work or not.
$.ajax
({
type: mehtodtype,
url: path,
data: postdata,
success: function(data)
{
if(data === "Please Fill Entries.")
{
$('#fullname').css("border-color", "rgb(219, 46, 46)");
$('#old').css("border-color", "rgb(219, 46, 46)");
$('#new').css("border-color", "rgb(219, 46, 46)");
$('#confirm').css("border-color", "rgb(219, 46, 46)");
$('#showmediv').show();
//get new name
var userName = $("#fullname").val();
// show new username
$(".name").html(userName);
}
}
});
Onemore thing:
when you are sending ajax call you need to set new username in SESSION .

Answer 2

I hope you are trying to post the form without refreshing as I didnt understood what you were trying to achieve
What you need to do is use ajax to submit your form . Try this plugin and add the following code
http://jquery.malsup.com/form/#ajaxSubmit
download the plugin
and in the form add this
<form onsubmit="javascript:login();return false;">
function action(){
$('#form').ajaxSubmit({
target:'#output_login',
url:'./php/page.php'
});
return false;
}