Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to get input type using jquery?

People also ask

How can get value entered textbox using jQuery?

To get the textbox value, you can use the jQuery val() function. For example, $('input:textbox'). val() – Get textbox value.

What is input in jQuery?

The :input selector in jQuery is used to select input elements. This selector also used with button element. Syntax: $(":input") Note: jQuery :input selector not only selects input elements but also Buttons, Dropdowns and Textarea elements. Example: This example use :input selector to count all input elements.

How use contains in jQuery?

jQuery :contains() SelectorThe :contains() selector selects elements containing the specified string. The string can be contained directly in the element as text, or in a child element. This is mostly used together with another selector to select the elements containing the text in a group (like in the example above).

How can get textarea value in jQuery using ID?

We can get the value of textarea in jQuery with the help of val() method . The val() method is used to get the values from the elements such as textarea, input and select. This method simply returns or sets the value attribute of the selected elements and is mostly used with the form elements.


EDIT Feb 1, 2013. Due to the popularity of this answer and the changes to jQuery in version 1.9 (and 2.0) regarding properties and attributes, I added some notes and a fiddle to see how it works when accessing properties/attributes on input, buttons and some selects. The fiddle here: http://jsfiddle.net/pVBU8/1/


get all the inputs:

var allInputs = $(":input");

get all the inputs type:

allInputs.attr('type');

get the values:

allInputs.val();

NOTE: .val() is NOT the same as :checked for those types where that is relevent. use:

.attr("checked");

EDIT Feb 1, 2013 - re: jQuery 1.9 use prop() not attr() as attr will not return proper values for properties that have changed.

.prop('checked');

or simply

$(this).checked;

to get the value of the check - whatever it is currently. or simply use the ':checked' if you want only those that ARE checked.

EDIT: Here is another way to get type:

var allCheckboxes=$('[type=checkbox]');

EDIT2: Note that the form of:

$('input:radio');

is perferred over

$(':radio');

which both equate to:

$('input[type=radio]');

but the "input" is desired so it only gets the inputs and does not use the universal '*" when the form of $(':radio') is used which equates to $('*:radio');

EDIT Aug 19, 2015: preference for the $('input[type=radio]'); should be used as that then allows modern browsers to optimize the search for a radio input.


EDIT Feb 1, 2013 per comment re: select elements @dariomac

$('select').prop("type");

will return either "select-one" or "select-multiple" depending upon the "multiple" attribute and

$('select')[0].type 

returns the same for the first select if it exists. and

($('select')[0]?$('select')[0].type:"howdy") 

will return the type if it exists or "howdy" if it does not.

 $('select').prop('type');

returns the property of the first one in the DOM if it exists or "undefined" if none exist.

$('select').type

returns the type of the first one if it exists or an error if none exist.


You could do the following:

var inputType = $('#inputid').attr('type');

If what you're saying is that you want to get all inputs inside a form that have a value without worrying about the input type, try this:

Example: http://jsfiddle.net/nfLfa/

var $inputs = $('form').find(':checked,:selected,:text,textarea').filter(function() {
    return $.trim( this.value ) != '';
});

Now you should have a set of input elements that have some value.

You can put the values in an array:

var array = $inputs.map(function(){
    return this.value;
}).get();

Or you could serialize them:

var serialized = $inputs.serialize();

GetValue = function(id) {
  var tag = this.tagName;
  var type = this.attr("type");

  if (tag == "input" && (type == "checkbox" || type == "radio"))
    return this.is(":checked");

  return this.val();
};

$("#yourobj").attr('type');

The best place to start looking is http://api.jquery.com/category/selectors/

This will give you a good set of examples.

Ultamatly the selecting of elements in the DOM is achived using CSS selectors so if you think about getting an element by id you will want to use $('#elementId'), if you want all the input tags use $('input') and finaly the part i think you'll want if you want all input tags with a type of checkbox use $('input, [type=checkbox])

Note: You'll find most of the values you want are on attributes so the css selector for attributes is: [attributeName=value]

Just because you asked for the dropdown as aposed to a listbox try the following:


$('select, [size]).each(function(){
  var selectedItem = $('select, [select]', this).first();
});

The code was from memory so please accound for small errors


It would seem that the attr functionality is getting further deprecated

$(this).attr('TYPE')
undefined
$(this).prop('type')
"text"