Ich habe ein Tutorial gefunden, in dem die Formulardaten automatisch gesendet werden, aber alles, was ich tun möchte, ist, eine Senden-Schaltfläche hinzuzufügen, um die Daten an Ajax zu übergeben.

Mein Ziel ist es, ein Formular mit mehreren Eingaben zu haben. Wenn der Benutzer auf die Senden-Schaltfläche klickt, sendet er es über Ajax und aktualisiert die Seite, ohne die Seite neu zu laden. Ein weiteres wichtiges Element ist die Art und Weise, wie alle Eingaben in ein Array geschrieben werden, sodass beim Ausführen des Aktualisierungsskripts die Namensattribute aus den Eingabefeldern mit den Spalten in der Datenbank übereinstimmen.

Ich glaube ich bin nah dran. Ich habe gesucht und meine genaue Lösung nicht gefunden. Danke im Voraus.

<script type="text/javascript" src="/js/update.js"></script>

<form method="POST" action="#" id="myform">

    <!-- start id-form -->
    <table border="0" cellpadding="0" cellspacing="0"  id="id-form">
    <tr>
        <th valign="top">Business Name:</th>
        <td><input type="text" name="company_name" class="inp-form" /></td>
        <td></td>
    </tr>
    <tr>
        <th valign="top">Address 1:</th>
        <td><input type="text" name="address_1" class="inp-form" /></td>
        <td></td>
    </tr>
    <tr>
        <th valign="top">Address 2:</th>
        <td><input type="text" name="address_2" class="inp-form" /></td>
        <td></td>
    </tr>



<tr>
    <th>&nbsp;</th>
    <td valign="top">
            <input id="where" type="hidden" name="customer_id" value="1" />
            <button id="myBtn">Save</button>

<div id="alert">    
    </td>
    <td></td>
</tr>
</table>
<!-- end id-form  -->
</form>

update.js

var myBtn = document.getElementById('myBtn'); 
myBtn.addEventListener('click', function(event) {

updateform('form1'); }); 

function updateform(id){
        var data = $('#'+id).serialize();
       // alert(data);
         $.ajax({
            type: 'POST',
            url: "/ajax/update_company_info.php",
            data: data,
             success: function(data) {
                 $('#id').html(data);


                 $('#alert').text('Updated');
                 $('#alert').fadeOut().fadeIn();

              },
              error: function(data) { // if error occured
                    alert("Error occured, please try again");
                },
                        }); }

update_customer_info.php

<?php

include($_SERVER['DOCUMENT_ROOT'] . '/load.php');

// FORM: Variables were posted
if (count($_POST))
{
$data=unserialize($_POST['data']);
// Prepare form variables for database
foreach($data as $column => $value)
    ${$column} = clean($value);

// Perform MySQL UPDATE
$result = mysql_query("UPDATE customers SET ".$column."='".$value."'
    WHERE ".$w_col."='".$w_val."'")
    or die ('Error: Unable to update.');
}


?>