0

如果任何字段错误，LiveValidation 会阻止触发表单操作，但不会停止 ajax 调用。

所以我想做类似的事情：

if (field1.passValidation) {
     ajax_call();
}

这是代码（它是西班牙语）：

$('.reporta').click(function() {//.reporta is the submit field of the form
    var motivo = $('#reportar select').val();
    var razon = $('#reportar textarea').val();
    reportar(v_id, motivo, razon); //Ajax call
});

//creation of LiveValidation object 
var reporte_f1 = new LiveValidation('reporte_f1', {validMessage: " ", wait: 300});
reporte_f1.add(Validate.Presence, {failureMessage: "Por favor, escriba un motivo"});

<form action="#">
<table>
    <tr><td><label for="reporte_f1">Motivo del reporte:<br /></label><textarea id="reporte_f1" rows="7" cols="50"></textarea></td></tr>
</table>
<div>
    <input type="submit" class="reporta" value="Reportar" /> 
</div>
</form>

这样做，如果该字段未通过 LiveValidation，则无论如何都会发送表单。

4

1 回答 1

0

ANSWER

jsFiddle Demo

HTML

<form action="#">
    <table>
        <tr>
            <td>
                <label for="reporte_f1">Motivo del reporte:
                    <br />
                </label>
                <textarea id="reporte_f1" rows="7" cols="50"></textarea>
            </td>
        </tr>
    </table>
    <div>
        <input type="submit" class="reporta" value="Reportar" />
    </div>
</form>

JS

function reportar(v_id, motivo, razon) {
    $('.reporta').html('<img src=\"img/cargando2.gif\" width=\"30px\" height=\"30px\"/>');
    $.ajax({
        url: "forms.php?form=10",
        data: {
            v_id: v_id,
            motivo: motivo,
            razon: razon
        },
        type: "POST",
        success: function (response) {
            $(".reportar[rel]").overlay().close();
            $('#dialogo').fadeIn(250);
            $('#dialogo').html("<ul><li class='ack'>El reporte ha sido enviado correctamente</li></ul>");
            setInterval(function () {
                $('#dialogo').fadeOut(400);
            }, 3000);
        },
        error: function (xhr, ajaxOptions, thrownError) {
            alert("Ha ocurrido un error al cargar los datos");
        }
    });
}

$(function () {
    $('.reporta').click(function () { //.reporta is the submit field of the form
        var motivo = $('#reportar select').val();
        var razon = $('#reportar textarea').val();
        reportar(v_id, motivo, razon); //Ajax call
    });

    //creation of LiveValidation object 
    var reporte_f1 = new LiveValidation('reporte_f1', {
        validMessage: "Gracias!",
        wait: 300
    });
    reporte_f1.add(Validate.Presence, {
        failureMessage: "Por favor, introduzca algo"
    });
    //The regex pattern here has to be matched
    reporte_f1.add(Validate.Format, 
              { pattern: /^\w+$/i, failureMessage: "Por favor, introduzca un mensaje válido" } );
});

Note

I found this out by looking at the following example.

Also taken from the following example

When a LiveValidation object is instantiated, if it finds it is a child of a form, it will automatically attach itself to the submit event of the form, so when it is submitted, validation on all the LiveValidation objects inside it will be performed automatically. If any of the validations fail it will stop the form submitting (this of course only works when javascript is on in the users bowser, so be sure to do some validation on the server too!). You can also specify the onlyOnSubmit option to be true when you create the LiveValidation object to make it only validate when the form is submitted. This is demonstrated in the following example. Note also that the email field has no validation that it is present, therefore if this is not filled in the form will still be valid, as it will be treated as an optional field. In this example the outcome is overidden if it is valid as this page has nowhere to submit to - instead of submitting, it will alert that it is valid, in real life it will just carry on submitting if valid.

于 2013-10-14T17:14:34.207 回答