Grab Javascript/jQuery from a button

Asked

Viewed 474 times

1

I have this button:

<div class="grid_17">
    <button value="novaPesquisa" class="btn-pular-passo pull-right" id="btnEndereco">Continuar</button>
</div>

There is a <form> well large, where this button is inserted, all divided by DIV’s. Well, it turns out that some DIV’s, they enter with Display="none" and they will only be visible at the click of that button. I did a validation of blank fields and then, when there are blank fields, it already shows a "hint" in the component itself saying that field needs to be filled. Well, I have the following problems. The validation function, it takes all the form and all the DIV’s, including the button and the ones that are hide, are inside that form. So I ask? Does it work, or do I have to create two presses: one for the fields that already appear and the button and another form for those that are hidden or not? And how do I do this on the button, ie whether or not they have been validated? Below the function jQuery to validate.

var validateOptions = {
    ignore: "",
    errorElement: false,
    highlight: function (field) {
        $(field).addClass('has-error').removeClass('has-success');
    },
    unhighlight: function (field) {
        $(field).addClass('has-success').removeClass('has-error');
    },
    errorPlacement: function () {
    }
};

$('#formConfirmaDados').data('validate', $('#formConfirmaDados').validate(validateOptions));
jquery

1 answer

1

To validate only the visible ones you can use the ignore of validateOptions

var validateOptions = {
   ignore: ":not(:visible)", //Aqui está o que precisa fazer para validar somente os campos visíveis
   errorElement: false,
   highlight: function (field) {
      $(field).addClass('has-error').removeClass('has-success');
   },
   unhighlight: function (field) {
      $(field).addClass('has-success').removeClass('has-error');
   },
   errorPlacement: function () {
   }
};

$('#formConfirmaDados').data('validate', $('#formConfirmaDados').validate(validateOptions));

  • Normal... You will see, the more you use and learn, the harder it will get to understand the jquery... joke

  • How do I show the others now after all the fields have been filled in? When pressing the button, if it is blank, it "screams" that the field needs to be filled. And when it’s filled, how do I show the Divs that are with display="None"?

  • Regarding display display="None" is simple, just do something like $('.div:not(:visible)').show() now I didn’t quite understand what it would be like to shout... to draw attention to the unfulfilled field?

  • Shouting, was my slang, IE, if the field is empty it soon displays a message that needs to be filled (shout), excuse me, is the habit of inventing jargon, trading and etc... Is this what I do in a new Function or in the same? At the moment, if it is the same

  • removes the line errorPlacement: function() { } q it should display already from the field side

  • I did so, but it didn’t work. $('#btnEndereco'). click(Function() { $('#addressee'). css('display:""'); });

  • When a field is visible in jquery you use the $('element').hide() to hide and to show the element vc uses the $('element').show()... then in your example to display the address field, you should do something like this: $('#btnEndereco').click(function () { $('#endereco').show(); });

  • let’s go continue this discuss&#227;o in chat

  • How do I put a question in the chat?

Show 4 more comments

Browser other questions tagged jquery

You are not signed in. Login or sign up in order to post.