CODEWITHSUNDEEP
javascriptjqueryvalidationinputfocus
developer
developer

Reputation: 658

focus oneach function jQuery

I'm trying to put on each function as I'm facing performance issue using jQuery framework. I've total 8 text fields, in which 4 are of Type1 and rest 4 of Type2 and each Type1 Type2 have a couple, such that they are alternative of each other. Now my goal is to validate using jQuery such as if Type1 is selected of a couple, Type2's value will be blank and vice versa.

My text fields have name:

Type1-1
Type1-2

Type2-1
Type2-2

Type3-1
Type3-2

Type4-1
Type4-2

My CODE:

for (var i = 1; i <= 4; i++) {

                    $("#Type1-" + i).on('click focusin', function () {
                        console.log("A",this.id);
                        $("#Type2-" + i).val('');
                         $( this).unbind( "focusin" );
                    });

                    $("#Type2-" + i).on('click focusin', function () {
                        console.log("B",this.id);
                        $("#Type1-" + i).val('');
                         $( this).unbind( "focusin" );
                    });

                    $("#Type1-" + i).keypress(function (e) {
                        if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
                            return false;
                        }
                    });
                    $("#Type2-" + i).keypress(function (e) {
                        if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
                            return false;
                        }
                    });
                };

Upvotes: 0

Views: 154

Answers (1)

Andy
Andy

Reputation: 30135

If i understand correctly, when a textbox is clicked, you just want to clear all textboxes of same type, right?

If so, something like this should suffice:

$(function(){
  $('input').on('focus',function(){
    $("." + this.className).val('');
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input class="t1"/><br/>
<input class="t1"/><br/>
<br/>
<input class="t2"/><br/>
<input class="t2"/><br/>
<input class="t2"/><br/>
<br/>
<input class="t3"/><br/>
<input class="t3"/><br/>
<input class="t3"/><br/>
<input class="t3"/><br/>

Upvotes: 1

Related Questions