如何使用php将表单内容发送到数据库

时间:2015-11-30 23:37:33

标签: javascript php jquery html ajax

我的问题:我不知道如何将表格的信息发送到数据库

我有什么:

我有一个html文件,其中包含3个按钮和一个div,它会根据点击的按钮而改变:

<div class="container">
            <h1> Producto</h1>

            <div class ="buttons">
                <button type="button" onclick="loadAddProduct()">Nuevo producto</button>
                <button type="button">Borrar producto</button>
                <button type="button">Actualizar producto</button>

            </div>

            <div class="main_container" id="main_container">

            </div>

        </div>
带有id = main_container的

div使用ajax函数加载,具体取决于按钮。 单击时的第一个按钮将加载此表单:

<div class="container">

    <form name="addProductForm" id="addProductForm" action="" onsubmit="" method="post">

        <label for="product_name">Nombre :</label> <input id="product_name" placeholder="Nombre">

        <br> <br>
        <label for="product_desc_short">Descripción corta:</label><br>
        <textarea id="product_desc_short" cols=40 rows=5 placeholder="Descripción corta del prooducto"></textarea>

        <br> <br>
        <label for="product_desc_long">Descripción larga:</label><br>
        <textarea id="product_desc_long" cols=50 rows=7 placeholder="Descripción larga del prooducto"/></textarea>
        <br><br>

        <label for="product_price">Precio :</label> <input id="product_price" placeholder="Precio"/>

        <br> <br>
        <label for="product_stock">Stock :</label> <input id="product_stock" placeholder="Stock">

        <br><br>
        <label for="product_type">Categoria :</label>
        <select id="product_type" name="prod_type">
            <option value="" selected="selected"> Selecciona</option>
            <option value="1"> Gorras</option>
            <option value="2"> Camisetas</option>
            <option value="3"> Tazas</option>
            <option value="4"> Posters</option>
            <option value="5"> Sudaderas</option>
        </select>
        <br>
    </form>
    <br>
    <br>
    <button type="submit" form="addProductForm" value="Submit">Enviar</button>

</div>

最后我有一个带有一组与数据库交互的php函数的文件:

php文件:

.....

function addProduct($desc_short, $desc_long, $stock, $price, $name, $image_url, $type)
{

    $conn = connect();

    $sql = "INSERT INTO `products`(`desc_short`, `desc_long`, `stock`, `price`, `name`, `image_url`, `type`)
            VALUES ('" . $desc_short . "','" . $desc_long . "','" . $stock . "','" . $price . "','" . $name . "','" . $image_url . "','" . $type . "')";

    if ($conn->query($sql) === true) {
        $res = array(true, $conn->insert_id);
        $conn->close();
        return $res;
    }

    $conn->close();
    return array(false, -1);
}
.....

我的目的是当用户点击提交按钮,然后启动功能"addProduct(.....)"将信息上传到数据库,但我不想转到其他页面,只需刷新{{1有一些消息,如<div id="main_container">

但我真的不知道如何混合所有这些东西。

1 个答案:

答案 0 :(得分:5)

您必须向您的php文件发送 post 请求。

将按钮更改为:

<button type="button " id="addProductFormBtn" value="Submit">Enviar</button>

添加到您的JS:

$('body').on('click', '#addProductFormBtn', function(){
    //Get data from the form
    var product_desc_short = $('#product_desc_short').val();
    ...//other fields

    //Send the data to your_php_file_path using post request
    $.post( "your_php_file_path", {product_desc_short: product_desc_short,...})
        .done(function( msg_returned_from_php ) {
            $('#main_container').text(msg_returned_from_php)
        });
 }); 

在您的PHP文件调用函数中,从请求中收到了params:

addProduct($_POST['product_desc_short'],...);

要返回消息,请在文件(或函数)的末尾添加echo

echo " product uploaded--> ID :XXX";

希望这有帮助。