Question

$(document).ready(function() {
  $("#register button[name=btnPosta]").click(function() { 
    console.log('clicked'); 

    thisBtn = $(this); 
    parent = $(this).parent(); 

    name = parent.data('name');

    $(this).attr('disabled', true); 

    $.post('register.php', {
      name: (name)
    }, function(data) {
      console.log('Ajax success'); 

    $('#message').html(data); 
      thisBtn.attr('disabled', false); // reset
    });

    console.log('Ajax success'); 
  });
}); 
});

This is my JavaScript function that sends the value of name (inputed from a input box) however undefined is displayed instead of what was inputeed into the input box.

<div class = "Interactlogin" id = "register"> 
  <table>
    <tr>
      <td> Username: <td>
      <td> <input type = "text"  class = "field" name = "name"> </td>
    </tr>
    <tr>
      <td> Password: <td>
      <td> <input type = "password" class = "field" name = "password"> </td>
    </tr>
      <td > Email: <td>
      <td> <input type = "email" class = "field" name = "email"> </td>
    </tr>
    <tr>
      <td>  <td>
      <td><button  class='regular' id = "btnPost" name = 'btnPosta'> Log In  </button <td>    
    </tr>
    <tr>
  </table>
</div>
<div id = "message">
</div>

This is the HTML markup where input is located.

Answer 1

Instead of

name = parent.data('name'); 

Use:

name = $('#register').find('input[name="name"]').val();