使用jquery提交数据

时间:2016-02-16 21:17:33

标签: jquery jsp java-ee

我有几个输入,我想提交就像我对表单一样,并设置一个动作。

是否可以通过jquery?

这是我的js:

$(".flex-login-submit").click(submitForm);
function submitForm() {
    if (!$('[name="id"]').val().length || !$('[name="password"]').val().length) {
        console.log("Too small");
        $('.errors').empty();
        $('.errors').append('<div class="animated fadeOut">Veillez à remplir tous les champs.</div>');

    } else {
        $('.flex-login-container').attrib('action', 'submitForm');
        $('.flex-login-container').submit();
    }
}

我的jsp:

<div class="flex-login-container">
    <div class="flex-login-title">Veuillez  vous authentifier</div>
    <input class="flex-login-infos" name="id" placeholder="Identifiant">
    <input class="flex-login-infos" type="password" name="password" placeholder="Mot de passe">
    <div class="flex-login-submit">Se connecter</div>
    <div class="flex-login-help">Mot de passe oublié?</div>
    <div class="errors"><br/></div>
</div>

我收到错误消息“attr”不是函数。

2 个答案:

答案 0 :(得分:1)

正确的函数名称是attr。您在代码中使用了attrib。

您正在为div添加一个动作属性。如果您想使用提交,则必须使用表单元素。

或者,您可以使用ajax功能在点击时提交表单。

      $(".flex-login-submit").click(submitForm);
function submitForm() {
    if (!$('[name="id"]').val().length || !$('[name="password"]').val().length) {
        console.log("Too small");
        $('.errors').empty();
        $('.errors').append('<div class="animated fadeOut">Veillez à remplir tous les champs.</div>');

    } else {

              //ajax function here
              $.ajax({

                   url:"put your url here",
                   data: put your data here,
                   success:function(data){

                     //do something with data here

                   }


              });


    }
}

答案 1 :(得分:1)

我可能完全错了,但我认为你需要一张表格才能提交表格。试试这个......

<强> HTML

<form id="flex-login-form" action="ACTION_URL_HERE" method="post">
<div class="flex-login-container">
    <div class="flex-login-title">Veuillez  vous authentifier</div>
    <input class="flex-login-infos" name="id" placeholder="Identifiant">
    <input class="flex-login-infos" type="password" name="password" placeholder="Mot de passe">
    <div class="flex-login-submit">Se connecter</div>
    <div class="flex-login-help">Mot de passe oublié?</div>
    <div class="errors"><br/></div>
</div>
</form>

<强> JS / jQuery的

$(".flex-login-submit").on('click', function() {
    if (!$('[name="id"]').val().length || !$('[name="password"]').val().length) {
        console.log("Too small");
        $('.errors').empty();
        $('.errors').append('<div class="animated fadeOut">Veillez à remplir tous les champs.</div>');
    } else {
        $('#flex-login-form').submit();
    }
});