What is the jquery equivalent to: document.forms[0].elements[i].value;
I don't know how to travel through a form and its elements in JQUERY and would like to know how to do it.
views:
66answers:
6
A:
I'm not exactly sure what you're trying to accomplish, but you should be able to do something like this:
$('form:first').children(':first').val();
This will get the value of the first child node within the first tag in the DOM.
Matthew J Morrison
2010-07-19 22:38:30
This would return nothing...you're selecting a `<form>` tag :)
Nick Craver
2010-07-19 22:39:23
Thanks @Nick, you are correct - I fixed my snippet.
Matthew J Morrison
2010-07-19 22:47:04
@Matthew - This is still incorrect, not my downvote...but I don't think your thinking of the selectors correctly here, this would return the first element, the example is an `elements[i]`, which translates pretty closely to: `$('form:first :input').eq(i).val();`
Nick Craver
2010-07-19 22:52:20
Yup, @Nick, right again. I guess I was just thinking that he was trying to get the first child. Thanks!
Matthew J Morrison
2010-07-19 23:22:31
A:
$("#formid input").each(function(){
alert($(this).attr("value"))
})
Luis Junior
2010-07-19 22:39:11
A:
Well, translated literally, it'd be:
$('form:first *:nth-child(i)').val()
But jQuery makes it easy to grab elements by other manners such as ID or CSS selector. It'd be easier to maintain if you did something like:
$('form#id input.name').val()
Fortes
2010-07-19 22:39:14
A:
The solution will depend on your markup.
If you have an ID on your form, you could select it by that. While you could easily select from the elements by index, there's likely a nicer way.
var $theForm = $('#idOfForm'); // Select the form with the ID "idOfForm"
// To get the value of the fourth form element.
var theValue = $theForm.find('input,select,textarea').eq(3).val();
Again, there are so many ways in jQuery to get the element you want, that there's likely something much nicer than this.
RightSaidFred
2010-07-19 22:39:42
A:
This will give you all elements under the form. Including non form elements:
$("#[form id]").find()
Then you can use an each function to traverse all the children. Or you can use the input selector to only return the form elements:
$("#[form id] :input")
spinon
2010-07-19 22:39:55
@David You're right. They tend to be nested, though not always. I guess I should have used find instead or just list the type of controls that we want to return. I will at least change to use find instead.
spinon
2010-07-19 22:48:03
+5
A:
The usual translation is the :input selector:
$("form:first :input").each(function() {
alert($(this).val()); //alerts the value
});
The :first is because your example pulls the first <form>, if there's only one or you want all input elements, just take the :first off. The :input selector works for <input>, <select>, <textarea>...all the elements you typically care about here.
However, if we knew exactly what your goal is, there's probably a very simple way to achieve it. If you can post more info, like the HTML and what values you want to extract (or do something else with).
Nick Craver
2010-07-19 22:42:18
Thanks for the answer.I wrote a basic form validation script in javascript, and I'm trying to transition it over to JQUERY. It's a for loop that searches through all of the elements in the form checking to make sure that all the values have changed from the default (ie. first name last name) to something real. The code snippet I posted is attached to a variable that saves the current input's value and checks it against the list of default values. thisVal = document.forms[0].elements[i].value;
Ian
2010-07-20 05:18:12
I also do have 2 forms on my page. My current working version has <form action="..." onsubmit='validate("formName");' ..> to validate that specific form forthisVal = document.forms[formName].elements[i].value;
Ian
2010-07-20 05:20:19