Why this form submit allways... Validation javascript doesnt work

Question

This form allways submit, never javascript stop with the errors. What is wrong?

thanks in advance ;)

I put the onsubmit return valida(this).... and the javascript code seems well

<form name="formulario" id="formulario" method="POST" action="<%=request.getContextPath()%>/altaanuncio" onSubmit="return valida(this)">


function valida(f) {

        if (f.marca.selectedIndex==0){
            $('#errores').html('Seleccione la marca.');
            f.marca.focus();
         return false;
    }

        else if(f.garantia.value == ""){
            $('#errores').html('Introduzca meses de garantía');
            f.garantia.focus();
                return false;
        }

        else if(f.pvpofertado.value == ""){
            $('#errores').html('Introduzca el precio del coche');
            f.pvpofertado.focus();
                return false;

        }

     return true;
}

Did you try to put valida(this) instead of return valida(f) ? — lc2817
– lc2817, Commented Oct 12, 2011 at 16:33
@lc2817 in plain JS it of course MUST be return valida(this) — mplungjan
– mplungjan, Commented Oct 12, 2011 at 17:01

Peter-Paul van Gemerden · Accepted Answer · 2011-10-12 17:07:59Z

1

I think you're trying to call jQuery functions on plain JS elements. Try this:

// When the DOM is ready:
$(document).ready(function() {

    // Attach submit event listener to form (== onSubmit)
    $('#formulario').submit(function(event) {

        // Get the jQuery object for the 'marca' field:
        var marca = event.target.children('#marca');

        if (marca.attr('selectedIndex') === 0) {
            $('#errores').text('Seleccione la marca.');
            marca.focus(); // <--this now works because it's a jQuery object.
            event.preventDefault(); // instead of return false;
        }
    });
});

<form id="formulario" />

answered Oct 12, 2011 at 17:07

Peter-Paul van Gemerden

7,02933 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Peter-Paul van Gemerden Over a year ago

Ah, @mplungjan beat me to it.

Rom Over a year ago

I know whats happen. I HAVE AJAX SUBMIT!!!! Then it submit always, are there any mode of call the function and stop the submit?

mplungjan Over a year ago

But I have a very slow connection today so it takes me forever to fix typos ;)

Peter-Paul van Gemerden Over a year ago

event.preventDefault() should stop the submit event from performing its usual action (i.e. submitting the form via the regular way). If you're using AJAX to submit anyway, this should probably be at the top of your submit() event handler. See @mplungjan's answer.

mplungjan Over a year ago

@PPvG what would be the most elegant way of not continuing the validation after each focus? return false?

|

mplungjan · Accepted Answer · 2011-10-12 17:31:10Z

1

You obviously use jQuery so use jQuery all the way

There are validation plugins to be found here: http://zoomzum.com/useful-jquery-form-validation/

And post here: http://api.jquery.com/jQuery.post/

<html>
<head>
<script type="text/javascript" src="jquery.latest.js"></script>
<script type="text/javascript">
$(document).ready(function() {
  $("#formulario").bind("submit",function(e) {
    var f = this; // or $(this) but then you need to test .val() and use find() or children
    if (f.marca.selectedIndex==0){
       $('#errores').html('Seleccione la marca.');
       f.marca.focus();
       e.preventDefault();
    }
.
.
.
.
   }
   $.post($(this).attr('action'),$(this).serialize(),
     success: function( response )  {
       console.log( response );
     }
   });
   e.preventDefault(); // cancel the actual submit       

  });
});
</script>
</head>
<body>
<form name="formulario" id="formulario" method="POST" action="<%=request.getContextPath()%>/altaanuncio">

edited Oct 12, 2011 at 17:31

answered Oct 12, 2011 at 17:05

mplungjan

180k29 gold badges183 silver badges246 bronze badges

2 Comments

Rom Over a year ago

I know whats happen. I HAVE AJAX SUBMIT!!!! Then it submit always, are there any mode of call the function and stop the submit?

mplungjan Over a year ago

Sure. Please see update. I will add an example but my internet is SLOOOW right now

Collectives™ on Stack Overflow

Why this form submit allways... Validation javascript doesnt work

2 Answers 2

6 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related