提交表单onsubmit首先使用ajax创建一个控件

时间:2015-07-28 09:35:40

标签: javascript ajax forms

我正在创建一个项目,它将从数据库中的表单中保存一些数据。我必须检查这些数据是否正确编译(密钥是必要的并且至少有一个值)以及密钥是否已存在于db中。第一部分已经完成,它可以很好地控制参数,但是当我必须提交它时,它并没有完成。这是代码:

function insertControl() {

var insertError= $("#insertError");
var key = $.trim($("input[id='key']").val());
var value1 = $.trim($("textarea[id='valueITA']").val());
var value2 = $.trim($("textarea[id='valueGBR']").val());
var value3 = $.trim($("textarea[id='valueAUS']").val());
var value4 = $.trim($("textarea[id='valueUSA']").val());
var value5 = $.trim($("textarea[id='valueFRA']").val());
var id = $.trim($("input[id='control']").val()); //it is to see if i'm editing a label or just creating, in html there is an imput type hidden, if i press edit from the search function it passes the id in this input, else it is ""
var controlled= $.trim($("input[id='controlled']").val());
event.preventDefault();
if (key === "") {

    if (value1 === "" && value2 === "" && value3 === "" && value4 === ""
            && value5 === "") {
        insertError
                .html("KEY required<br>at least a value required");

    } else {
        insertError.html("KEY required");
    }
} else {
    insertError.html("");

    if (value1 === "" && value2 === "" && value3 === "" && value4 === ""
            && value5 === "") {
        insertError.html("at least a value required");

    } else {
        if (id == "") {
            if (controlled == "") {
                return control();
            } else if (controlled== 'ok') {
                if (!confirm('are you sure?'))
                    return e.preventDefault();
                document.getElementById('form').submit();
            }

        } else {
            if (id != "") {
                if (!confirm('are you sure??'))
                    return e.preventDefault();
                document.getElementById('form').submit();
            }

        }

    }
}

};

如果表单编译正确并且没有id(所以我在数据库上创建新记录而不是编辑)它返回一个ajax调用的函数,它从表单中获取密钥并检入servlet如果数据库中有该键的记录,则返回一些json。

这是代码:

function control() {
$
        .ajax({
            url : 'edit',
            data : {
                key : $('#key').val()
            },
            success : function(data, status, xhr) {
                var insertError = $("#insertError ");
                var labels = data.length;
                if (labels == 0) {
                    $('#controlled').val('ok');
                    return insertControl();

                } else if (dati > 0) {
                    insertError
                            .html("this key is already used");
                    return event.preventDefault();
                }

            },
            error : function(req, status, err) {
                console.log('Something went wrong', status, err);
            }
        })

}

检查工作正常,但如果我正在创建新标签,则不会提交。只是编辑提交。我在html文件中使用onsubmit调用此函数。

1 个答案:

答案 0 :(得分:0)

回答

  

我试着把它放在回调中(我拿了整个控件(),我把它放在我在其他功能中调用它的地方)它不起作用..也许我已经完成了它错误的方式?

它应该是这样的:

if (id != "") {
  confirm('are you sure??', document.getElementById('form').submit)
  return e.preventDefault();
}

function confirm(question, callback){
  /*show modal*/
  /*action on user confirm*/
  function userConfirm(){
    callback();
  }
}

使用jQuery,你可以做到

if (id != "") {
  confirm('are you sure??', $('#form').submit)
  return e.preventDefault();
}

function confirm(question, callback){
  /*show modal*/
  /*action on user confirm*/
  function userConfirm(){
    callback();
  }
}