Hiding arguments in http call - php

Question

I use this to pass an argument (fullname).
<script type="text/javascript">
function listbox_update(){
var fullname = document.getElementById("listboxid").value;
document.location.href="{$_SERVER["PHP_SELF"]}?fullname="+fullname;}
</script>
Is there a way to pass the argument such that it can NOT be seen in the http URL?
I know about POST.
$listboxselected = $_POST['listbox'];
I would use POST instead, so that the argument is not present in the URL, but I can't, because I'm using the javascript as an On Click event.
<select id="listboxid" name=listbox onChange="listbox_update()"></br>
The On Click event works perfectly. But I don't like seeing all my variables in the URL.

Answer 1

If you want to do that only by JS then you can go with Ajax.
function listbox_update(){
var fullname = document.getElementById("listboxid").value;
$.ajax({
data: { fullname: fullname },
url: <?php echo $_SERVER["PHP_SELF"]; ?>,
type: "POST",
success: function(msg){
//some function here
}
});
}

Answer 2

Wrap the <select> in a <form> and then in onchange submit the form.
<form id="form" method="post" action="<?=$_SERVER["PHP_SELF"]?>">
<select id="listboxid" name="fullname" onChange="listbox_update()">
<option>here the options</option>
</select>
</form>
and the listbox_update
function listbox_update () {
document.getElementById('form').submit();
}
Another option would be to use Ajax, but since your original script reloads the page, then the first approach follows this way.

Answer 3

You have only 2 solutions for this:
1) Either you must implement AJAX like below:
function listbox_update()
{
var fullname = $("#listboxid").val();
$.ajax({
data: "fullname="+fullname,
url: <?php echo $_SERVER["PHP_SELF"]; ?>,
type: "POST",
success: function(msg){
console.log("Message :"+msg);
}
});
}
2) Or go with form submission.
function listbox_update()
{
$('#your_form_id').attr('action', <?php echo $_SERVER["PHP_SELF"]; ?>);
$('#your_form_id').submit();
}