Search jQuery

jQuery Forum

Getting the ID of a form

in Using jQuery • 10 years ago

I have the same block of inputs used in multiple forms and a jQuery functionality that looks up data, then populates fields based on the value in an ID field $('#idField').blur().

My question has to do with "what next". Depending on the form being used, I would like to focus() to different input fields once the data has been stuffed in to the dependent <input>s.

How do I reference the ID of the active form? My first inclination (and the thing I found most commonly in my search on this topic) was this.form.id ... but that doesn't seem to work in my lookup / populate function.

This has got to be a readily accessible value - I just don't know the property name or syntax to grab it.

Thanks all for any help / guidance you can offer!

Jeff

Replies(6)

dsvick

Re: Getting the ID of a form

10 years ago

Hi Jeff

You can use the parents method (http://api.jquery.com/parents/) to search the ancestors of an element. In your case, to find a form you would use something like this inside of your handler:

$(this).parents("form").attr("id");

So if you wanted to find the form ID for when any text input element changed you would have something like this:

$("input[type='text']").change(function(){
alert($(this).parents("form").attr("id"));
});

Cheers

Dave

agilityje..

Re: Getting the ID of a form

10 years ago

Sorry Dave - I must be missing something here.

var formID = $(this).parents("form").attr("id").val();
console.log(formID);

Yields this in Firebug:

[13:25:53.436] $(this).parents("form").attr("id") is undefined @ http://path/to/my/project/cjr.js:215

If I try without the .varID it also comes back undefined.

Thoughts?

dsvick

Re: Getting the ID of a form

10 years ago

You don't need the ".val()" on the end. The attr method returns the value of the given attribute. From the error message though it looks like there are no matches being found for the selector. Can you post the entire handler, or if it is large, just the first few lines so we can see how it is defined.

Does your form have an id attribute?

agilityje..

Re: Getting the ID of a form

10 years ago

In the HTML:

<form id="changeForm" class="cjrForm" action="http://74.124.211.41/~nadacag/wordpress/cjr-includes/forms/changeForm.php" method="POST" name="changeForm">
<p>
<label for="memberID" class="cjrLabel">Associate ID: </label>
<input name="memberID" id="memberID" type="text" maxlength="7" />

<input name="id" id="id" type="hidden" />
</p>

The handler:

// Populate Owner info based on Member ID
$('#memberID').blur(function() {
var memberID = $('#memberID').val();
$.ajax({
url: '/wordpress/cjr-includes/memberLookup.php',
type: 'POST',
data: 'memberID=' + memberID ,
success: function(res) {
var owner = eval('(' + res + ')');
$('#id').val(owner.id);
$('#firstName').val(owner.firstName);
$('#lastName').val(owner.lastName);
$('#address').val(owner.address);
$('#zipCode').val(owner.zipCode);
$('#phone').val(owner.phone);
$('#email').val(owner.email);
if (owner.id > 0)
{
// Here is where things fall apart - everything up to this point works flawlessly
var formID = $(this).parents("form").attr("id");
console.log(formID);
if ( formID = "changeForm" )
{
$('#firstName').focus();
}
else
{
$('#name').focus();
}
}
}
});
});

dsvick

Re: Getting the ID of a form

10 years ago

Ahhh, I see. You are trying to get the value of the form ID from within the success handler of your ajax call. At that point in the code "this" no longer represents the element that triggered the blur event. You can fix this by moving that line

var formID = $(this).parents("form").attr("id");

so it above the ajax call, right beneath the var memberID = line should do it.

Hope that fixes it for you.

Dave

agilityje..

Re: Getting the ID of a form

10 years ago

SCORE! That worked perfectly. For many years I have been a 'server side' guy so this whole concept of having to consider timing when determining the placement of variable requests in a script.

I'll get it, I'm sure - just need to start thinking a bit more dynamically.

Thanks for the help Dave!!!!

Jeff

Top Reply

Response title

Attachments

jQuery Forum

Getting the ID of a form

Replies(6)

Re: Getting the ID of a form

Re: Getting the ID of a form

Re: Getting the ID of a form

Re: Getting the ID of a form

Re: Getting the ID of a form

Re: Getting the ID of a form

Statistics

Tags

Actions

Related Posts