AJAX sends information to PHP but fails to insert only one data

Question

Look at my code:

HTML:

<script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="js/criaEvento.js"></script>
<form method="post">
<table width="420" align="center">
    <tr>
        <td>Nome</td>
        <td colspan="3"><input class="form-control" type="text" name="nomeEvento" placeholder="exemplo: Festa no ap" size="30"></td>
    </tr>
    <tr>
        <td height="10"></td>
    </tr>
    <tr>
        <td>Detalhes
        <td colspan="3"><textarea class="form-control" name="maisInfos" placeholder="informais adicionais" rows="3" cols="33"></textarea></td>
    </tr>
    <tr>
        <td height="10"></td>
    </tr>
    <tr>
        <td>Onde</td>
        <td colspan="3"><input class="form-control" type="text" name="onde" placeholder="local" size="30"></td>
    </tr>
    <tr>
        <td height="10"></td>
    </tr>
    <tr>
        <td>Quando</td>
        <td><input id="dia" type="date" name="dia"></td>
        <td>Horário</td>
        <td><input id="hora" type="time" name="hora"></td>
    </tr>
    <tr>
        <td height="10"></td>
    </tr>
    <tr>
        <td></td>
        <td colspan="3"><input type="submit" class="btn btn-lg btn-primary btn-block" id="salvar" name="salvar" value="SALVAR"></td>
    </tr>
</table>
</form>

Javascript:

(document).ready( function(){

    $("#salvar").click( function(){

        var dataString = $("form").serialize();

        $.ajax({
            url: 'php/evento.php',
            type: 'POST',
            dataType: 'json',
            data: 'data='+dataString,

            success: function(data){

            }

        });

    });
})

PHP:

<?php
include_once 'con.php';

$nomeEvento = $_POST['nomeEvento'];
$maisInfos = $_POST['maisInfos'];
$onde = $_POST['onde'];
$dia = $_POST['dia'];
$hora = $_POST['hora'];

$qryInsert = mysql_query("INSERT INTO evento VALUES(NULL, '$nomeEvento', '$maisInfos', '$onde', '$dia', '$hora')");

It passes the data to PHP but in INSERT to BD, only one of the data is NOT saved, the rest goes...

Answer 1

The problem is that you are sending the parameters incorrectly in the ajax call.

data: 'data='+dataString,

In this line you end up generating a new data called data where the value ends up being data=nomeEvento=[valor preenchido], that is, its first item in dataString ends up becoming the value of data and is lost.

The function .serialize() already generates everything you need to send the data via POST. You just need to do so:

$.ajax({
    url: 'php/evento.php',
    type: 'POST',
    dataType: 'json',
    data: dataString, // passa diretamente a string contendo os dados do post

    success: function(data){

    }
});