Have Geek Brain

How to get 1 hidden field among several in a div

I have 3 hidden fields in 1 div. when i have a link to this div how to get 1 of the hidden margins in this div.

+1


a source to share


7 replies


This will also work (jQuery):



$('#my_div').find('input[type=hidden]:first')
+6


a source


Assuming you have a DIV like:

<div id="mydiv">
    <input type="hidden">
    <input type="hidden">
    <input type="hidden">
</div>

You can use jQuery to do something like this to select all of them:

$('input:hidden','#mydiv');

With this selector, you now have all 3 hidden fields in your jQuery collection. You can choose which one you want to use using several methods:

$('input:hidden:first','#mydiv'); // get first one using first
$('input:hidden:last','#mydiv'); // get last one using last
$('input:hidden','#mydiv').eq(0); // get first one using eq
$('input:hidden','#mydiv').eq(1); // get second one using eq
$('input:hidden','#mydiv').eq(2); // get third one using eq
$('input:hidden:eq(0)','#mydiv'); // get first one using eq in selector


Possible options:

I'm personally a fan of option 3 as I don't like having too much crap in my selector.

One of the above is that with the help of the selector :hidden

we can match other input elements that are hidden (i.e. not visible). If you expect this to happen, or even if you don't, you can do this:

$('input[type=hidden]', '#mydiv').eq(0);
+5


a source


Without any code, I find it difficult to help, but I would say that the hidden ID field is what uses:

var hdn = document.getElementById("id");

Or, if you are using JQuery:

var hdn = $("#id");
+4


a source 


var firstHidden = $("input[type='hidden']:first", ref);

: first pseudo-class and attribute selector

or

var firstHidden = $("input:hidden:first", ref);

: hidden pseudo-class (be careful because: hidden also finds elements with style = "display: none")

or

var firstHidden = $("input[type='hidden']", ref).eq(0);

... eq ()

where the variable 'ref' is a reference to the DIV element

+1


a source


if it is true:

<div id="somediv">
    <input type="hidden"/>
    <input type="hidden"/>
    <input type="hidden"/>
</div>

and you are using jquery, you can just write this:

$("#somediv > input[type='hidden']:eq(1)")

and it should return a reference to the 1st hidden field. if you want the second, use "eq (2)" and so on.

+1


a source


I would assign the class to the hidden one you want to find - a little easier when the programmer looks back at it 4 years later. I am using "id" as an example of a hidden one. When you find it with jQuery, you can use .val () to get its value.

HTML:

<div id="mydiv">
  <input type='hidden' name='mydiv_id' class='idField' value='test1' />
  <input type='hidden' name='mydiv_hidden2' class='option2' value='test2' />
  <input type='hidden' name='mydiv_hidden3' class='option3' value='test3' />
</div>

JQuery

//execute on document ready:
$(function() {
  var div = $('#mydiv'); //some jquery/dom element "div"

  // use the jQuery selector with "div" as our context.
  var $hidden = $('input.idField', div);

  alert($hidden.val()); // should alert 'test1'
});
+1


a source


For reference, if you are not using jQuery like the original poster and think the structure is above:

<div id="mydiv">
  <input type="hidden">
  <input type="hidden">
  <input type="hidden">
</div>

var div = document.getElementById('mydiv');
var inputs = div.getElementsByTagName('input');
for(var i = 0; i < inputs.length; i++){
  // Match your input with inputs[i].name, etc.
}
+1


a source






More articles:


All Articles