CODEWITHSUNDEEP
javascriptjquery
Posz
Posz

Reputation: 83

Finding which forms are filled out on submit

I need to use unobtrusive javascript/jquery to check if input fields have been filled out. If they are I need to display what input field that was. Not the value.

Here is the input form

<div class="inputCol">
    <div class="formItem first-name">
        <label>First Name:</label>
        </div>
    <div class="inputCol">
        <input maxlength="40" size="35" id="firstName" name="firstName" class="imput_value" type="text" />              
    </div>

    <div class="formItem last-name">
        <label>Last Name:</label>
    </div>
    <div class="inputCol">
        <input maxlength="40" size="35" id="lastName" name="lastName" class="imput_value" type="text" />                
    </div>

    <div class="formItem email">
        <label>Email:</label>
    </div>
    <div class="inputCol">
        <input maxlength="40" size="35" id="email" name="email" class="imput_value" type="text" />              
    </div>

    <div class="inputCol">
        <a href="javascript:submitContactUsForm();" class="submit_button">submit</a>
    </div>

So on click of the submit button I need it to alert "First Name, Email" if just the first name and email had input in them. These inputs do not need to be validated. As long as the field is not empty it should display that that input has been submitted.

This is the code I currently have, don't really know where to go from here:

$('a.submit_button').click(function(){
var validate= false;
$('input.imput_value').each(function(){
    if($(this).val() != '' || $(this).attr('checked'))
        validate = true;
});
if(validate){
    var dataFilled = $(this).closest('.formItem').find('input').text().trim();
    alert(dataFilled);
    return false;
}
});

Upvotes: 1

Views: 41

Answers (1)

Rob Schmuecker
Rob Schmuecker

Reputation: 8954

$('a.submit_button').click(function(){
    var filledInputs = '';
    $('input.imput_value').each(function(){
        if($(this).val() !== '' || $(this).attr('checked')){
            filledInputs += $(this).attr('name') + ', ';
        }
    });
    if(filledInputs !== ''){
        alert(filledInputs);
    }
});

Should do what you want.

Upvotes: 1

Related Questions