JSFiddle - React, Tailwind, and code Playground

by nabeezy

HTML

<form id='ac_form'>
<INPUT style="HEIGHT: 22px; WIDTH: 308px; POSITION: absolute; LEFT: 423px; Z-INDEX: 104; TOP: 87px" name=CityStateZip>
<INPUT style="HEIGHT: 22px; WIDTH: 19px; POSITION: absolute; LEFT: 321px; Z-INDEX: 105; TOP: 152px" size=1 name=3a-alpha-required>
<INPUT style="HEIGHT: 22px; WIDTH: 27px; POSITION: absolute; LEFT: 310px; Z-INDEX: 106; TOP: 182px" maxLength=1 size=1 name=3b-required-number>
    
    
    </form>

JavaScript

//generate array of input objects from a form with the given id (#ac_form)
var inputs = $('#ac_form :input');

//arrays that hold input objects to be validated
requiredArray = [];
alphaArray = [];


// jquery for each through input array
inputs.each(function(){
    if(this.name.indexOf("required") >= 0){
        requiredArray.push(this);
    };
    if(this.name.indexOf("alpha") >= 0){
        alphaArray.push(this);
    };
})

$requiredArray = $(requiredArray);
$alphaArray = $(alphaArray);

$('#ac_form').append('these are required inputs:<br/>');
$requiredArray.each(function(){
    $('#ac_form').append(this.name + ', ')
})

$('#ac_form').append('<br/>these are alpha inputs<br/>');
$alphaArray.each(function(){
    $('#ac_form').append(this.name + ', ')
})