How to access a input textfield of a form inside div tag? jquery

Envato Authors Theme Authors
1

hi everyone,

I am a newbie in jquery.

I have a form inside div tags. I am not able to access the textfield of form in jquery.

structure :

‘div id = “first”’

‘div id = “second”’

‘/div’

‘/div’

when the form wasn’t inside div tags. I used to access the textfield by

$(’#gnum’).val();

but, now I can’t. Can anyone tell me what will be the correct syntax for it?

please help me.

thanks in advance.

2

Hi. I use this function to locate input fields and empty them. You can customize it up to your needs.

Function:

function initForm(oForm, element_name, init_txt) {
		frmElement = oForm.elements[element_name];
		frmElement.value = init_txt;
}

Call to function parsing form ID (first one document, in this example), input name and new text value:

initForm(document.forms[0], 'email', '');

Hope this helps! :wink:

3

Hi, rahulbist

When you address an element in jquery by its id, its DOM position doesn’t really matter, because an id is a unique attribute. If you get errors with that there are reasons like:

  • the id of your element is not unique ///to fix that make it unique
  • there is no value attribute ( if you have $(’#…’).val() ) ///to fix that give your input a value
  • the code is operated before the DOM is formed. /// to fix that either place your script block in the end of the document, or wrap your code with $(document).ready(function () { … }) .

In fact I came across problems with older IE versions to behave well with $(’#…’) - addressing elements by id. So addressing it by classes or other attribute or filter can solve it. But in this case we need to remember that class is not a unique attribute. So for you case it can be like this: $(’#new’).children(‘input[type=“text”]’).val() , but even better, (if your form is the only one on the page) is $(‘form’).children(‘input[type=“text”]’).

in your example you use div with ids. I’d better give them unique classes instead. In that case I could be safe from IE6 issues.

jquery is a very flexible library, so experiment with it and good luck.