Welcome Guest, Not a member yet? Register   Sign In
[solved] jquery form validation - how to run it when there is no button type submit?
#1

[eluser]SPeed_FANat1c[/eluser]
Hi,

I have a button:


Code:
<input class = "save" type="button" value="Išsaugoti" />

As you can see the type is not submit, it is just button. This is because I want to not allow submission if javascript is disabled.

To submit I run this code:
Code:
$('input.save').click(function() {

        $('form').attr( 'target', '' );
        $(".edit").validate({


            rules: {
                 input_pavadinimas: {
                  required: true,
                  maxlength: 20
                },

                text: {
                    required: true
                }

            },
            messages: {
                input_pavadinimas:{
                    required: "Neįvedėte pavadinimo",
                    maxlength: "Maksimalus ilgis - 20 simbolių"
                },    

                text: {
                    required: "Neįvedėte teksto"
                }
            }

        }


        );

        document.myform.submit();        //myfor - formos name atributas
    });
But the validation doesn't work.

When the button type is submit and I run this code

Code:
$(".edit").validate({

         submitHandler:function(form) {

         form.submit();
        //document.myform.submit();        //myfor - formos name atributas



        },
        rules: {
             input_pavadinimas: {
              required: true,
              maxlength: 20
            },

            text: {
                required: true
            }

        },
        messages: {
            input_pavadinimas:{
                required: "Neįvedėte pavadinimo",
                maxlength: "Maksimalus ilgis - 20 simbolių"
            },    

            text: {
                required: "Neįvedėte teksto"
            }
        }

    });
validation works perfectly.

I don't find in google and in documentation how to run it when button is not submit type. Can you help me?
#2

[eluser]smilie[/eluser]
On first look, your jQuery should run.

However:

document.myform.submit();

is your form really called "myform"? Have you tried using same code as in edit button:

form.submit();

instead?

Cheers,
Smilie
#3

[eluser]SPeed_FANat1c[/eluser]
[quote author="smilie" date="1295905119"]On first look, your jQuery should run.

However:

document.myform.submit();

is your form really called "myform"? Have you tried using same code as in edit button:

form.submit();

instead?

Cheers,
Smilie[/quote]

Yea, the name attribute is myform.

I tried

form.submit();

instead

document.myform.submit();

but it return an error

Uncaught ReferenceError: form is not defined.

With
Code:
document.myform.submit();

the form is submitted, but is not validated.

Edit: found the answer Smile

Here it is: http://docs.jquery.com/Plugins/Validatio...dator/form

And here is how my code looks:
Code:
$('input.save').click(function() {
        console.log('submit');
        $('form').attr( 'target', '' );
        $(".edit").validate({
            
            submitHandler:function(form) {
            
             //form.submit();
            //debug: true,
            document.myform.submit();    
            
            
            
            },
            rules: {
                 input_pavadinimas: {
                  required: true,
                  maxlength: 20
                },
                
                text: {
                    required: true
                }
                
            },
            messages: {
                input_pavadinimas:{
                    required: "Neįvedėte pavadinimo",
                    maxlength: "Maksimalus ilgis - 20 simbolių"
                },    
                
                text: {
                    required: "Neįvedėte teksto"
                }
            }
            
        }
                
        
        ).form();
        
        //document.myform.submit();        //myfor - formos name atributas
    });

So it actually was in documentation, just was difficult to find.

Edit2: thanks for trying to help Smile

Edit3: damn, actually now everything does work Big Grin valination works now, but submission doesn't. Somehow I missed this, thought that submission also works.

And it does not submit because submitHandler is not executed if the form is valid.
Code:
submitHandler:function(form) {
            
             //form.submit();
            //debug: true,
            console.log('sumbmited');
            document.myform.submit();    
            
            
            
            }

console.log is not writing.


Edit4: but found one new thing in documentation which I can do, so modified a code little:
Code:
$('input.save').click(function() {
        console.log('submit');
        $('form').attr( 'target', '' );
        valid = $(".edit").validate({        //modified
            
           /* submitHandler:function(form) {
            
             //form.submit();
            //debug: true,
            console.log('sumbmited');
            document.myform.submit();    
            
            
            
            },*/
            rules: {
                 input_pavadinimas: {
                  required: true,
                  maxlength: 20
                },
                
                text: {
                    required: true
                }
                
            },
            messages: {
                input_pavadinimas:{
                    required: "Neįvedėte pavadinimo",
                    maxlength: "Maksimalus ilgis - 20 simbolių"
                },    
                
                text: {
                    required: "Neįvedėte teksto"
                }
            }
            
        }
                
        
        ).form();
        if(valid)    //added
            document.myform.submit();
        //document.myform.submit();        //myfor - formos name atributas
    });

Now I think it works Big Grin




Theme © iAndrew 2016 - Forum software by © MyBB