error with input validation

Asked

Viewed 156 times

0

the following code was implemented from a question I found here in the system

$('form input[type="text"]').on('input', function() {
    var inputempty = false;
    $('form > input').each(function() {
        if($(this).val() == '') {
            inputempty = true; } });

    if(inputempty) {
        $('form input[type="submit"]').attr('style', 'background: red');
    } else {
        $('form input[type="submit"]').removeAttr('style'); } });

the problem is that I can’t get it to read all inputs inside the form, it can only detect the first input, I’m using jquery 1.8.3 and jquery ui 1.11.4

follows html structure

    <form action="<?php echo htmlspecialchars($siteuri); ?>" method="post">
        <input type="text" name="contacts_form_name" placeholder="Nome do contato" autofocus />
        <input type="text" name="contacts_form_a[1]" placeholder="Nome do campo" tabindex="1" />
        <input type="text" name="contacts_form_b[1]" placeholder="Valor do campo" tabindex="2" />
        <div id="contacts_form">
Aqui dentro são inseridos inputs com jquery
</div>
        <div id="contacts_form_add" class="cursor_pointer">+</div>
        <input class="cursor_pointer" type="submit" name="contact_send" value="Salvar" />
    </form>

and follow the jquery

var scntDiv = $('#contacts_form');
var rscn = $('#contacts_form x').size() + 1;
$('#contacts_form_add').live('click', function() {
    $('<x><input type="text" id="focus' + rscn +'" name="contacts_form_a[' + rscn +']" placeholder="Nome do campo" /><input type="text" name="contacts_form_b[' + rscn +']" placeholder="Valor do campo" /><span id="contacts_form_rem" class="cursor_pointer">X</span></x>').appendTo(scntDiv);
    $('#focus'+ rscn).focus();
    rscn++;
    inputattr();
    return false; });

$('#contacts_form_rem').live('click', function() {
    if(rscn > 1) {
    $(this).parents('x').remove();
    rscn--; }
return false; });
  • What is the structure of your HTML?

  • structure are dynamic inputs, I have a jquery function that inserts inputs into a div, but even with inputs outside this block it only reads the first

  • What gives you alert($('form > input').length); if you put it in the first line before var inputempty = false;?

  • only the number 4 appears in all inputs, but only the first input that makes Submit red

  • appears only number 4 in all inputs, and do not know what happened, but apparently it is working now, I removed the code, I put again to test what you asked, I think it is working.

  • actually, it’s working on the first 3 inputs, I don’t know what happened, really weird, but the dynamic inputs aren’t getting the function, is it because they’re inside a div inside a tag? #contacts_form > x > input[type="text"]

Show 1 more comment

1 answer

0


I think I figured, I don’t know if it’s right, but it seems to work

$('form input[type="text"]').on('input', function() {
    var inputempty = false;
    $('form > input').each(function() {
        if($(this).val() == '') {
            inputempty = true; } });
    $('form > div > x > input').each(function() {
        if($(this).val() == '') {
            inputempty = true; } });
    if(inputempty) {
        $('form input[type="submit"]').attr('disabled', 'disabled');
    } else {
        $('form input[type="submit"]').removeAttr('disabled'); } });

and add this in att

$('form input[type="submit"]').attr('disabled', 'disabled');
  • 1

    Have you tested with $('form input') only, instead of using >?

  • It’s not that it works, that lame, but, I still don’t understand why when I asked the question, it didn’t work at all, neither with > nor without, but now it’s working, this is very weird

Browser other questions tagged

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