How to put parameter from input with ajax post request?

Question

this is my page:

<script type="text/javascript">
$(document).ready(function() {
    $("#mainbutton").click(function() {
        $.post("controller", {
            action: "mainbutton",
            name: "name"
        },
        function(data, status) {
            alert("Data: " + data + "\nStatus: " + status);
        });
    });
});
</script>


<input id = "name" type="text" placeholder="Name" name="" /><span></span>
<input id="mainbutton" class="mainbutton" type="button" value="Rush my trial"/>

how to put value of the name input in the request when i press the button?

Answer 1

use var name=$('#name').val(); to get value of name filed

<script type="text/javascript">
        $(document).ready(function(){
            $("#mainbutton").click(function(){
                var name=$('#name').val();
                $.post("controller",
                        {
                          action: "mainbutton",
                          name: name// pass parameter like this

                        },
                        function(data,status){
                            alert("Data: " + data + "\nStatus: " + status);
                        });
            });
        });
        </script>

Answer 2

            var name = $('#name').val();
            $.post("controller",
                    {
                      action: "mainbutton",
                      type: "POST",
                      data: { 'name': name },
                    },
                    function(data,status){
                        alert("Data: " + data + "\nStatus: " + status);
                    });
           });