My javascript function is not working, when i click to submit my form

Question

My javascript function is not working, when i click to submit my form. can someone help with that? i think is everything all right, but it's not working for some reason i don't know.

                        <form action="<?php echo base_url();?>my_data" onsubmit="onSubmit()" method ="POST">
                        <p class = "my_data_text">Nome</p>
                        <input type="text" class="form-control" style="width:54%;" name= "changed_user_name" value = "<?php echo $this->session->userdata('nome_usuario');?>"></input>
                        <p class = "my_data_text">Email</p>
                        <input type="text" class="form-control" style="width:54%;" name = "changed_user_email" value = "<?php echo $this->session->userdata('email_usuario');?>"></input>
                        <p class = "my_data_text">Digite sua nova senha</p>
                        <input type="password" class="form-control" style="width:54%;" name = "changed_password"></input>
                        <p class = "my_data_text">Confirme sua nova senha</p>
                        <input type="password" class="form-control" style="width:54%;" name = "change_confirm_password"></input>
                        <button id ="btn_mydata_submit_incident" type="submit" class="btn btn-primary" >salvar</button>
                        </form>
                    </div>
            </div>
            </div>
        </div>
    </section>
    <script type="text/javascript">
    function onSubmit(){
        alert("email inválido");
        var result =1;
        var checar = document.querySelector("#changed_user_email");
        var test = checar.value.indexOf("@");
        if (test == -1){
            alert("email inválido");
            result =0;
        }
        var checar = document.querySelector("#changed_password");
        var passw=  /^[A-Za-z]\w{7,14}$/;
        if(!checar.value.match(passw)){
            alert("password inválido");
            result =0;
        }
        if (result ==0){
            return (false);
        }
        else{
            return (true);
        }
    }
    </script>

U have JS error !! function onSubmit() needs { for definition !! — Abhik Chakraborty
– Abhik Chakraborty, Commented Mar 11, 2014 at 4:39
You also don't need "return" from "return onSubmit()" in your form tag. That is delete the word return here. Should be "onsubmit="onSubmit()" — alanmanderson
– alanmanderson, Commented Mar 11, 2014 at 4:41
Sorry, i deleted the '{' when i formatted the code, is there now ehhe, this is not the problem. — michelpm1
– michelpm1, Commented Mar 11, 2014 at 4:42
I deleted the "return" word in the form tag but it still don't work. — michelpm1
– michelpm1, Commented Mar 11, 2014 at 4:47
you have used onclick event .. form doesnt have any onclick event put onsubmit .... — Nishant Solanki
– Nishant Solanki, Commented Mar 11, 2014 at 5:05

Vikas Umrao · Accepted Answer · 2014-03-11 04:59:21Z

Try this:

  <form action="<?php echo base_url();?>my_data" onsubmit="return onSubmit()" method ="POST">
                            <p class = "my_data_text">Nome</p>
                            <input type="text" class="form-control" style="width:54%;" name= "changed_user_name" value = "<?php echo $this->session->userdata('nome_usuario');?>"></input>
                            <p class = "my_data_text">Email</p>
                            <input type="text" class="form-control" style="width:54%;" name = "changed_user_email" id="changed_user_email" value = "<?php echo $this->session->userdata('email_usuario');?>"></input>
                            <p class = "my_data_text">Digite sua nova senha</p>
                            <input type="password" class="form-control" style="width:54%;" name = "changed_password" id="changed_password"></input>
                            <p class = "my_data_text">Confirme sua nova senha</p>
                            <input type="password" class="form-control" style="width:54%;" name = "change_confirm_password"></input>
                            <button id ="btn_mydata_submit_incident" type="submit" class="btn btn-primary" >salvar</button>
                            </form>
                        </div>
                </div>
                </div>
            </div>
        </section>
        <script type="text/javascript">
function onSubmit(){

    var result =1;
    var checar = document.getElementById("changed_user_email");
    var test = checar.value.indexOf("@");
    if (test == -1){
        alert("email inválido");
        result =0;
    }

    var checar = document.getElementById("changed_password");
    var passw=  /^[A-Za-z]\w{7,14}$/;
    if(!checar.value.match(passw)){
        alert("password inválido");
        result =0;
    }

    if (result ==0){
        return false;
    }
    else{
        return true;
    }
}
</script>

José Abimael Martínez · Accepted Answer · 2014-03-11 05:03:11Z

0

I think its because you're not using the input type="submit" but using button type="submit".

You should replace the submit button for this:

<input type="submit" value="salvar" class="btn btn-primary" id="btn_mydata_submit_incident"/>

Or just change the onSubmit javascript event for the onclick one.

edited Mar 11, 2014 at 5:03

answered Mar 11, 2014 at 4:47

José Abimael Martínez

4518 silver badges13 bronze badges

2 Comments

alanmanderson Over a year ago

This is not true. You can submit a form with <button type=submit. That is valid.

José Abimael Martínez Over a year ago

It is valid but no recommended, it behaves incorrectly many times.

Kiran RS · Accepted Answer · 2014-03-11 05:04:30Z

0

another way you can try doing is

$('#button_id').click(function(){ 
 onSubmit(); //call the function,return something true false value from function return and depending on that submit the form

 $('#form_id').submit();

});

I hope,it helps you !!!

edited Mar 11, 2014 at 5:04

Kiran RS

96914 silver badges33 bronze badges

answered Mar 11, 2014 at 4:51

rvd

112 bronze badges

Comments

Nishant Solanki · Accepted Answer · 2014-03-11 05:10:33Z

0

Use this code.. Working for me perfectly...

<form action="" onsubmit="onSubmit()" method ="POST"> <p class = "my_data_text">Nome</p> <input type="text" class="form-control" style="width:54%;" name= "changed_user_name" value = ""></input> <p class = "my_data_text">Email</p> <input type="text" class="form-control" style="width:54%;" name = "changed_user_email" value = ""></input> <p class = "my_data_text">Digite sua nova senha</p> <input type="password" class="form-control" style="width:54%;" name = "changed_password"></input> <p class = "my_data_text">Confirme sua nova senha</p> <input type="password" class="form-control" style="width:54%;" name = "change_confirm_password"></input> <button id ="btn_mydata_submit_incident" type="submit" class="btn btn-primary" >salvar</button> </form> </div> </div> </div> </div> </section> <script type="text/javascript"> function onSubmit(){ alert("email inválido"); var result =1; var checar = document.querySelector("#changed_user_email"); var test = checar.value.indexOf("@"); if (test == -1){ alert("email inválido"); result = 0; return false; } var checar = document.querySelector("#changed_password"); var passw= /^[A-Za-z]\w{7,14}$/; if(!checar.value.match(passw)){ alert("password inválido"); result =0; return false; } if (result == 0){ return (false); } else{ return (true); } } </script>

answered Mar 11, 2014 at 5:10

Nishant Solanki

2,1283 gold badges19 silver badges32 bronze badges

3 Comments

michelpm1 Over a year ago

i tried your code but still without solution i will try to reset my cache let's see.

michelpm1 Over a year ago

i m using chrome i tried with firefox to, but still with the problem

michelpm1 Over a year ago

Wow, finally working!! I changed the function name, and now it's working, well i don't know why it happened but is working now man !! kk

Collectives™ on Stack Overflow

My javascript function is not working, when i click to submit my form

4 Answers 4

1 Comment

2 Comments

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

2 Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related