Радио бутон към mysql с валидиране на ajax

Първо: използвам скрипта за поща, направен от Джефри Уей в In the Woods.

Имам проста форма, така:

<form method="post" action="sendEmail.php" id="form_reserveren">
<div id="container">

    <div id="main" style="width: 100%; height: auto; float: left;">
        <div class="left">
            <h3>Uw gegevens</h3>
            <p style="margin-bottom: 30px; height: 40px; width: 100%;">
                <input type="radio" id="zml_geslacht" name="zml0" value="de Heer"/><span style="float: left; margin-top: -5px; height: 25px;">de Heer</span><br />
                <input type="radio" id="zml_geslacht" name="zml0" value="Mevrouw"/><span style="float: left; margin-top: -5px; height: 25px;">Mevrouw</span>
            </p>
            <p>
                <input type="text" id="zml_voornaam" name="zml1" value="Uw voornaam" onblur="if(this.value=='') this.value='Uw voornaam';" onfocus="if(this.value=='Uw voornaam') this.value='';"/>
                <input type="text" id="zml_achternaam" name="zml2" value="Uw achternaam *" onblur="if(this.value=='') this.value='Uw achternaam *';" onfocus="if(this.value=='Uw achternaam *') this.value='';"/>
            </p>
            <p>
                <input type="text" id="zml_email" name="zml3" value="Uw e-mailadres *" onblur="if(this.value=='') this.value='Uw e-mailadres *';" onfocus="if(this.value=='Uw e-mailadres *') this.value='';"/>
            </p>
        </div>

        <div class="right">
            <h3>Uw reservering</h3>
            <p style="height:68px;">
                <textarea name="zml13" id="zml_opmerkingen" rows="12">Opmerkingen</textarea>
            </p>    


            <p><input type="submit" name="submit" id="submit" value="Email Us!" /></p>
            <ul id="response" />
        </div>
    </div><!--end main -->

</div><!-- end container -->
</form>

Това минава през ajax, така:

var zml0 = $('input#zml_geslacht').html( $(':checked').val());
var zml1 = $('input#zml_voornaam').val();
var zml2 = $('input#zml_achternaam').val();
var zml3 = $('input#zml_email').val();
var zml13 = $('textarea#zml_opmerkingen').val();

$.ajax({
    type: 'post',
    url: 'sendEmail.php',
    data: 'zml0=' + zml0 + '&zml1=' + zml1 + '&zml2=' + zml2 + '&zml3=' + zml3 + '&zml13=' + zml13,

    success: function(results) {
        $('#main img.loaderIcon').fadeOut(1000);
        $('ul#response').html(results);
    }
}); // end ajax

И след това отива в моя sendEmail.php, за да изпрати формуляра до имейл адрес (и да го съхрани в база данни). Запитването е:

 $zml0 = $_REQUEST['zml0']; // Geslacht

    // database connection
$conn = new PDO("mysql:host=$dbhost;dbname=$dbname",$dbuser,$dbpass);


// query
$sql = "INSERT INTO test (zml0,zml1,zml2) VALUES (:zml0,:zml1,:zml2)";
$q = $conn->prepare($sql);
$q->execute(array(':zml0'=>$zml0,
                  ':zml1'=>$zml1,
                  ':zml2'=>$zml2));

Всичко работи.. Имам също име, имейл адрес и т.н., с изключение на бутоните за избор на пол (полът на холандски е Geslacht, наричам го zml0, за да имам малко повече защита от спамъри). Идеята разбира се е, че потребителят трябва да избере Female или Male.

Когато се съхранява в базата данни, всичко, което казва, е [object Object]. Също така, когато просто повтарям входа. Как мога да накарам това да работи?


person Don Munter    schedule 17.07.2012    source източник
comment
това пълният html ли е? не виждам маркера на формуляра   -  person Forte L.    schedule 17.07.2012
comment
Не.. Това не е пълната форма. Мога да публикувам пълния html формуляр, ако искате, но не искам публикацията да е твърде голяма :p   -  person Don Munter    schedule 17.07.2012
comment
Публикувате ли целия формуляр в ajax или само това едно поле?   -  person Cfreak    schedule 17.07.2012
comment
Както каза @TimWithers, наистина трябва да използвате .serialize()   -  person Cfreak    schedule 17.07.2012


Отговори (2)


Опитайте тази:

var zml0 = $('input[name=zml0]:checked').val();

Другото нещо, което можете да опитате, което може да направи живота ви малко по-лесен за по-големи форми е:

$.ajax({
    type: 'post',
    url: 'sendEmail.php',
    data: $('#form_reserveren').serialize(),

    success: function(results) {
        $('#main img.loaderIcon').fadeOut(1000);
        $('ul#response').html(results);
    }
}); // end ajax
person Tim Withers    schedule 17.07.2012
comment
Това няма да работи, защото е глобална променлива. Той трябва да направи това в повикването на ajax. - person Cfreak; 17.07.2012
comment
Зависи къде беше. Ако беше вътре във функция, тогава не е глобална. - person Tim Withers; 17.07.2012
comment
Благодаря Тим, var zml0 = $('input[name=zml0]:checked').val(); работеше. - person Don Munter; 17.07.2012
comment
@DonMunter Наистина бих обмислил използването на функцията за сериализиране, тъй като формулярът ви става по-голям. - person Tim Withers; 17.07.2012
comment
Добре, ще използвам това. Може да се нуждая от малко проучване на функцията за сериализиране, тъй като все още не знам какво означава :p Да, формулярът ще бъде формуляр за резервация с около 12 (не моя идея) полета за въвеждане и т.н. - person Don Munter; 17.07.2012

Този ред е проблемът:

var zml0 = $('input#zml_geslacht').html( $(':checked').val());

Изглежда, че е глобална променлива, така че ако сте поставили отметка в другото поле, това няма да има значение. Винаги изпращате първоначалната стойност. Добре, ако беше правилно. Вторият проблем е, че просто хващате html? от него, а не действителната стойност. Очевидно това връща обект.

Вашето ajax повикване трябва да грабне входа на формуляра по това време:

$.ajax({
    type: 'post',
    url: 'sendEmail.php',
    data: 'zml0=' + $('input[name=zml0]:checked').val(),

    success: function(results) {
        $('#main img.loaderIcon').fadeOut(1000);
        $('ul#response').html(results);
    }
});
person Cfreak    schedule 17.07.2012