Ajax函数，用于显示特定div中提交的结果

Question

So I'm working on storing appointments of a calendar inside my db and I need to check the db for the name of the person before finishing the modal.

The code of the field, button and div where I need to show the result:

<div class="alinhar-esquerda"> 
   <input class="form-control" name="cpf_paciente" id="cpf_paciente" placeholder="" type="text" value="">
</div>
<div class="alinhar-direita">
   <button type="submit" class="btn btn-primary" id="searchButton">Pesquisar</button>
</div>
<div class="controls controls-row" id="resultado" style="margin-top:5px;">
</div>
<?php
include("database2.php");
   if(isset($_POST["cpf_paciente"])){
      $cpf_paciente = $_POST["cpf_paciente"];
      $pesquisa = $connection->query("SELECT `id`, `cpf_paciente`, `nome_paciente`, `sobrenome_paciente` FROM  `pacientes` WHERE cpf_paciente='$cpf_paciente'");
      while($row = $pesquisa->fetch(PDO::FETCH_ASSOC)) {
         echo $row['nome_paciente'] . " " . $row['sobrenome_paciente'];
      }
   }
?>  
</div>
</div>

I need an Ajax code to receive the data from #submitButton input and then go through the php code inside the div #resultado without reloading the page, because all this is inside a modal which I'll send the results after getting the name of the person.

Tried something like this but no success:

$('#searchButton').submit(function() { // catch the data from submit event
$.ajax({ // create an AJAX call...
  data: $(this).serialize(), // get the data
  type: $(this).attr('POST'), // POST
  url: $(this).attr(''), // no file to call
  success: function(response) { // on success..
      $('#resultado').html(response); // update the DIV
  }
});
});

Answer 1

It should be:

$('#searchButton').click(function() { // catch the data from submit event
    $.ajax({ // create an AJAX call...
      data: { cpf_paciente: $("#cpf_paciente").val() },
      type: "POST",
      url: '',
      success: function(response) { // on success..
          $('#resultado').html(response); // update the DIV
      }
    });
});

You can't use $(this).serialize() unless this is a <form>. It doesn't work with just a button (how would it know which inputs to serialize?).

The type: should just be 'POST, since the button doesn't have a POST attribute.

The URL should be '' to go to the same URL as the current page, $(this).attr('') is meaningless.

And the submit event only applies to a form. For a button you use .click().