Javascript 带有表单验证的Jquery ajax函数

我一直在努力解决一个简单但对我来说确实很难的问题

我有一个表单，我需要将表单中的数据添加到数据库中，但是需要表单验证。对于验证，我使用欧芹插件，对于一些输入字段，我使用select2插件

我尝试以代码中注释的方式添加表单：

  //try to see is zemljiste or vrsta_rada = null to do not add data to database
    var zemljiste = $("#parcele").select2("data");
    var vrsta_rada = $("#vrsta_rada").select2("data");

    //Now when I click on #dodaj I need to chech is zemljiste or vrsta_rada == null to do   not start function for adding data but DONT work
    $("#dodaj").click(function () {
        if (zemljiste == null || vrsta_rada == null) {
            alert('PLEASE fill the fields');
        } else {

//HERE if zemljiste and vrsta_rada != null start validation and this also dont work
            $('#myForm').parsley().subscribe('parsley:form:validate', function (formInstance) {
                formInstance.submitEvent.preventDefault(); //stops normal form submit
                if (formInstance.isValid() == true) { // check if form valid or not


                    zemljiste = $("#parcele").select2("data").naziv;
                    id_parcele = $("#parcele").select2("data").id;

                    vrsta_rada = $("#vrsta_rada").select2("data").text;
                    //code for ajax event here
    //Here is ajax and when I fill all fields I add data to database but here success and error into ajax dont work???
                    $.ajax({
                        url: "insertAkt.php",
                        type: "POST",
                        async: true,
                        data: {
                            naziv: $("#naziv").val(),
                            parcele: zemljiste,
                            vrsta_rada: vrsta_rada,
                            opis: $("#opis").val(),
                            pocetak: $("#pocetak").val(),
                            zavrsetak: $("#zavrsetak").val(),
                            status: $("#status").val(),
                            id_parcele: id_parcele,
                        }, //your form data to post goes here as a json object
                        dataType: "json",

                        success: function (data) {
//SO if success I add data but this code below dont work also in error dont work
                            $('#myModal').modal('hide');
                            drawVisualization();
                            console.log('YESSSSSSS');
                            console.log(data);
                        },
                        error: function (data) {
                            console.log(data);
                        }


                    });
                }
            });
        }
    });

有了这个，我有几个问题。。。 1.提交代码时，页面会刷新，我不想这样做。 2.当我填写所有字段时，我会将数据添加到数据库中，但也会添加以前使用错误信息进行的所有尝试。为什么？ 3.为什么在console.log中看不到将成功和错误返回到.ajax中的内容

请看图片：

---

对不起，我的代码将数据添加到数据库的次数与我尝试添加上一次的次数相同。。。所以，如果我尝试3次添加数据3次单击ID dodaj，然后代码3次添加到数据库中相同的数据。为什么？因为您要求页面多次提交数据。尝试禁用提交按钮onclick.Ok，但如果数据无效，脚本必须返回用户并显示警报消息。。。代码没有进入ajax…我也有错误，因为当zemljiste和vrst_rada==null时，我没有收到警报消息。。。为什么？嗨，安德鲁，你的问题要尽量简洁。人们倾向于更快地回答具体问题。调试您的代码并尝试找出问题所在，然后编辑您的问题并发布您的发现。我知道，当你不知道发生了什么时，这可能会很困难，但在这个练习中，你可能会发现问题的一部分。