7. August 2023

Mit der jQuery-Funktion „serialize()“ alle Formularfelder auf einmal auslesen

Die jQuery-Funktion „serialize()“ erleichtert die Übergabe von Formular-Eingaben, insbesondere bei sehr umfangreichen Formularen, an PHP enorm! Statt jedes Formularfeld einzeln in eine JS-Variable zu übergeben, werden mit „form.serialize()“ einfach alle Inhalte des Formulars in einer Variable gespeichert, die dann an das PHP-Script übergeben werden kann.

var form = $('#form');

form.submit(function(event) {

    event.preventDefault();

    var form_data = new FormData();
    form_data.append('form_data_string', form.serialize());

    $.ajax({
            url: 'handledata.php',
            type: 'POST',
            contentType: false,
            processData: false,
            data: form_data,
            beforeSend: function(xhr) {
                $('.btn_sendform').text('wird gesendet...');
            },
            success: function(data) {
                /* console.log(data); */
            }
        })
        .done(function() {
            $('.btn_sendform').prop('disabled', true).text('erfolgreich gesendet');
            $('input').attr('readonly', true);
            $('.btn_sendform').hide();
            $('#success').fadeIn(250);
            $('#form').css('opacity', 0.3);
        })
        .always(function() {
        /* console.log("Erfolgreich gesendet"); */     
    });

    });
   Code-Sprache: JavaScript (javascript)

In PHP kann die Eingabezeichenkette dann wieder ganz einfach in einzelne Variablen geteilt werden.

parse_str( $_POST["form_data_string"], $form_data);
$adress = htmlspecialchars($form_data["adress"], ENT_QUOTES);Code-Sprache: PHP (php)