Wie aktualisieren/füllen Sie mehrere Eingabefelder mit Ajax Callback?

Question

Der Code, den ich unten habe funktioniert. Ich muss nur die Eingabefelder ausfüllen, um die Werte zu aktualisieren, sobald der Ajax-Aufruf abgeschlossen ist. Allerdings kenne ich die Ajax-Erfolgsfunktion nicht, um die PHP-Variable ($ first, $ last, etc.) aufzurufen, um diese Eingabefelder zu füllen. Danke im Voraus!

HTML:

<div class="field-wrap"> 
    <input id="first" class="form-control" name="first" value="<?php echo $first ?>"/> 
    <input id="last" class="form-control" name="last" value="<?php echo $last ?>"/> 
    <input id="title" class="form-control" name="title" value="<?php echo $title ?>"/> 
    <input id="user_input" class="form-control" name="user_input" type="text"/> 
</div> 

Script:

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $('#user_input').on('change',function(){ 
     var input_user = $(this).val(); 
     if(input_user){ 
     $.ajax({ 
      type:'POST', 
      url:'ajax.php', 
      data:{user_input:user_input}, 
      success: function(){ 
      ???WHAT DO I NEED TO PUT HERE TO POPULATE THE INPUT FIELDS WITH DATA 
      } 
     } 
     } 
    }); 
    }); 
</script> 

PHP:

$user_input = $_POST['user_input']; 
$query_sql = $DB_CON_A->prepare("SELECT * FROM table_account WHERE account=:user_input"); 
$query_sql->bindValue(':user_input', $user_input, PDO::PARAM_STR); 
$query_sql->execute(); 
$user = $query_sql->fetch(PDO::FETCH_ASSOC); 
$first = $user['first_name']; 
$last = $user['last_name']; 
$title = $user['title']; 

Answer 1

In Ihrer PHP, werden Sie wahrscheinlich wollen nur echo ein json Objekt/Array:

die(json_encode($user)); 

In Ihrem Ajax-Erfolg, analysieren nur die codierte json string:

success: function(response){ 
    var data = JSON.parse(response); 
    $('#first').val(data.first_name); 
    $('#last').val(data.last_name); 
    $('#title').val(data.title); 
} 

Ich würde wahrscheinlich Ihre Eingabefeldnamen ändern die zurückgegebenen Spalten aus der Datenbank übereinstimmen (wie Sie have for title), so können Sie $.each() verwenden und automatisch eine beliebige Menge übereinstimmender Eingabe-Namen ausgeben, ohne ein id Attribut in Ihren Formularfeldern verwenden zu müssen. Sie könnten $('input[name='+key+']').val(value); in einer Schleife verwenden IF die Spaltennamen entsprechen den Formularnamen.

Stellen Sie außerdem sicher, dass Sie html-sichere Zeichenfolgen zurücksenden. Wenn der Benutzer <script>doSomething(nasty)</script> oder ähnliches gespeichert hat, könnten Sie bösartigen Code in Ihren HTML-Code einfügen. Ich würde vielleicht htmlspecialchars($value,ENT_QUOTES) für Ihre Werte bei der Rückkehr verwenden. Hängt davon ab, was sich in Ihrer Datenbank für first_name, last_name und title befindet.

Answer 2

Erstens Ihre ajax.php zurückkehren sollte wahr oder falsch wenn return true, wird es ajax.success passieren, sonst, es zu ajax.error

In Ihrem ajax.success passieren, sollten Sie etwas, das Antwort (Submission erfolgreich) zu tun vielleicht Alert, vielleicht auf andere Seite umleiten. Hier ist ein Beispiel:

success: function(){ 
    alert('Submission Successful!! '); 
}