如何从按钮功能中获取值以用于AJAX和sql查找？

So I have this button which is basically there to allow the user to change a given category name. So when you press this edit button, pop-up alert will come up on screen with an input field and you write whatever you want inside the input field, press okay and it should update the value with what ever you typed in that input field. This is my code so far :

<tbody>
<?php foreach (get_all_categories() as $r) { ?>

<td>
     <?php
           echo '<button type="button" class="btn btn-warning  edit-category"><i class="fa fa-pencil-square-o"></i> Edit</a></button> 
                 <input type="hidden" value="'. $r['category_id'] .'"  name="edit[]">';
     ?>
</td>

<?php } ?>
</tbody>


<script>

var id;
$('button.edit-category').click(function(e) {
id = $(this).parent()[0].childNodes[3].value;
  swal({   title: "An input!",   
    text: "Write something interesting:",   
    type: "input",   
    showCancelButton: true,   
    closeOnConfirm: false,   
    animation: "slide-from-top",   
    inputPlaceholder: "Write something" 
  }, 
    function(inputValue){   
      if (inputValue === false) return false;      
      if (inputValue === "") {     
        swal.showInputError("You need to write something!");     
        return false   }      
        swal("Nice!", "You wrote: " + inputValue, "success"); 
        //alert(inputValue);

        $.post( "edit_category_name.php", { editcategory: id,inputValue}, function( data ) {

        });

      }
      );

setTimeout(function () { location.reload(1); }, 5000);
});

</script>

edit_category_name.php :

<?php include '../core/session.php'; ?>

<?php admin_protect (); 

if (isset($_POST['editcategory'])) {
   change_category_name($_POST['editcategory']);
   echo 200;
}
else {
   echo 404;
}


?>

Function change_category_name:

function change_category_name ($category_id) {
$category_id = (int)$category_id;

mysql_query("UPDATE `mock_exam_category` SET `category_name` = '$category_id' WHERE `category_id` = '$category_id'");

}

inputValue is the variable where the input user types in will be stored

I am not fully sure how to do the function, Please can someone help me fix this. I hope I have described the question in detail however if you need any further clarification please ask, Thanks

This is just basic, you can grow it for any needs. I use something like this when I send any data to my server.

I grab the data-id and token, and then verify that data on the server side before I insert. Just echo data back, this function can show you what the server returns, errors or not, or whatever you decide to echo back to test.

The token is to prevent Cross-Site Request Forgery. Read more about this here Cross-Site Request Forgery (CSRF) Prevention Cheat Sheet

send data

e.stopPropagation();
var postID = $(this).data('id');
var token = document.getElementById("token").value;
$.post("modals/report_modal.php",{
    data: postID,
    token: token
},

receive data:

function(data, status){
    //alert("Data: " + data + "
Status: " + status);
    $("#LoadMe").html(data);
});

full code.

$(document).on('click', '.post-report', function(e) { //on click, if ajax loaded in or not
    e.stopPropagation(); 
    var postID = $(this).data('id');
    var token = document.getElementById("token").value;
    $.post("modals/report_modal.php",{
        data: postID,
        token: token
    },
    function(data, status){
        //alert("Data: " + data + "
Status: " + status);
        $("#LoadMe").html(data);
    });
});