0

AJAX経由で送信したいフォームがあるので、シリアル化jQuery関数を使用します。

これはコードです(すべての要素に「名前」があるわけではありませんが、アラートには何かが表示されるはずです):

http://jsfiddle.net/T6Rz3/2/


JS

$('#add-producto').click(function (e) {

    alert($('#datos-add').serialize())

    $.ajax({
        type: "POST",
        url: "insertar.php",
        data: $('#datos-add').serialize(),
        success: function (data) {
            alert(data);
        }
    });


    e.preventDefault();

});

HTML

<form id="#datos-add">
    <div class="form-horizontal">
        <div class="modal modal-block">
            <div class="modal-header">
                    <h3>Añadir productos</h3>

            </div>
            <div class="modal-body">
                <div class="control-group">
                    <label class="control-label">Marca</label>
                    <div class="controls">
                        <input type="text" name="marca" id="marca" class="input-xlarge">
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label">Producto</label>
                    <div class="controls">
                        <input type="text" name="descr" id="descr" class="input-xlarge">
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label">Tallajes</label>
                    <div class="controls controls-row">
                        <input id="tallajes" value="España">
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label">Referencias</label>
                    <div class="controls controls-row">
                        <input id="referencias" class="input-xlarge">
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label">Número de tallas</label>
                    <div class="controls controls-row">
                        <input type="number" min="1" max="99" value="5" id="numero-tallas" class="span1">
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label">Primera talla</label>
                    <div class="controls controls-row">
                        <input type="text" id="primera-talla" value="XS" class="span1">
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <div class="btn-group">
                    <button id="borrar" class="btn" type="button">Borrar todo</button>
                    <button id="generar" class="btn btn-primary" type="button">Generar tabla</button>
                </div>
            </div>
        </div>
        <div class="form-horizontal">
            <div id="formulario-medidas" class="modal modal-block">
                <div class="modal-header">
                        <h4>Tabla de medidas</h4>

                </div>
                <div class="modal-body">
                    <table id="tabla-medidas" class="table table-bordered"></table>
                </div>
                <div class="modal-footer">
                    <button id="medidas-completadas" class="btn btn-success" type="button">Medidas completadas</button>
                </div>
            </div>
            <div id="formulario-tallajes" class="modal modal-block">
                <div class="modal-header">
                        <h4>Tabla de tallajes</h4>

                </div>
                <div class="modal-body">
                    <table id="tabla-tallajes" class="table table-bordered"></table>
                </div>
                <div class="modal-footer">
                    <button id="add-producto" class="btn btn-block btn-large btn-danger" type="button">Añadir producto</button>
                </div>
            </div>
        </div>
    </div>
</form>

私が間違っていることがわかりますか?

ヒント、アドバイス、またはヘルプをいただければ幸いです。さらに情報が必要な場合はお知らせください。投稿を編集します。

4

2 に答える 2

1

まず、タイプミスがあります。<form id="datos-add">の代わりにする必要があり<form id="#datos-add">ます。

しかし、間違った方法でシリアル化しているとも思います。

POST ajax 呼び出しを行うときは.serializeArray()、 の代わりに, を使用する必要があり.serialize()ます。

.serialize()、クエリ文字列のようにすべてのキー/値を結合します。に.serializeArray()は、すべてのキー/値がリクエストに含まれます。

要するに、試してください:

$('#add-producto').click(function (e) {
    $.ajax({
        type: "POST",
        url: "insertar.php",
        data: $('#datos-add').serializeArray(),
        success: function (data) {
            alert(data);
        }
    });
    e.preventDefault();
});
于 2013-07-24T23:43:57.900 に答える
1

フォーム ID は「datos-añadir」ですが、JavaScript は「datos-add」を参照しています。

これが機能するjsfiddleフォークです。私がしたことは、参照を修正することだけでした:

$('#add-producto').click(function (e) {

    var $form = $('#datos-añadir');
    alert($form.serialize());
    return false;
于 2013-07-24T23:31:31.473 に答える