jQuery find input type (but also for select)

Question

I need to find the input type for radio buttons, text, and selects. Its easy to find the input type of anything with <input type="x"> since $(this).attr("type") would return x

My issue is that I need to support <select> elements, which dont have the type attribute. The end goal is to do return either radio, text, or select.

I thought of doing something like this, but I was curious if there's a better way:

if ($(this).tagName == "input") {
    var result = $(this).attr("type");   //returns radio or text (the attr type)
} else {
    var result = $(this).tagName;        //returns select (the element type)
}

Thanks all!

Niels · Accepted Answer · 2014-01-16 18:06:59Z

73

You can do this (fiddle here), make some sort of easy to use plugin:

$.fn.getType = function(){ return this[0].tagName == "INPUT" ? this[0].type.toLowerCase() : this[0].tagName.toLowerCase(); }

And use it like this

$(".element").getType(); // Will return radio, text, checkbox, select, textarea, etc (also DIV, SPAN, all element types)
$(".elList").getType(); // Gets the first element's type

Which will get the type of the first element which is selected.

Other info

If you just want to have some selectors you can use this:

$("input:text, input:radio, select");

Or select all form controls (more info):

$(":input") // can return all form types

edited Jan 16, 2014 at 18:06

answered Feb 2, 2012 at 17:15

Niels

50.1k4 gold badges68 silver badges86 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Hasib Kamal Chowdhury · Accepted Answer · 2018-10-08 07:41:17Z

11

All types of input box and select box getting together by jQuery find :

$('#myForm').find('select,input').each(function(i,box){
     alert($(box).attr('name'));
}

answered Oct 8, 2018 at 7:41

Hasib Kamal Chowdhury

2,68032 silver badges31 bronze badges

Collectives™ on Stack Overflow

jQuery find input type (but also for select)

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related