AJAX not sending data to PHP - php

Question

In this script, data gets sent, but it does not send the updated value of the variable. Hard-coded data gets sent as expected. How can I solve this or go around it?
username = ''; // supposedly these variables are global
tree_name = ''; // I also tried plugging in- $('#username').data("username") -directly.. same results.
$(function() {
username = $('#username').data("username"); // updating value
tree_name = $('#tree_name').data("tree_name"); // idem....
});
var options = {
type: "POST",
url: "/decision/p_tree2/",
data: {
username: username, // this should send the data
tree_name: tree_nam // ...
},
success: function(response) {
console.log(response);
}
};
$("form").ajaxForm(options);
PHP:
public function p_tree2 (){
$data = Array();
$data['username'] = $_POST['username'];
$data['tree_name'] = $_POST['tree_name'];
echo print_r($data); // result: both $data['username'] and $data['tree_name'] equal ""
}

Answer 1

Reformat your code like following. Also correct the typo you have in tree_name in data. You used tree_nam.
$(function() {
var username, tree_name,options;
username = $('#username').data("username");
tree_name = $('#tree_name').data("tree_name");
console.log(username); //make sure
console.log(tree_name); // console outputs what you need to pass
options = {
type: "POST",
url: "/decision/p_tree2/",
data: {
username: username, // this should send the data
tree_name: tree_name // ***correct this typo***
},
success: function(response) {
console.log(response);
}
};
$("form").ajaxForm(options);
});