krishan krishan - 3 months ago 7
jQuery Question

Selection of HTML input element nested in a <p> based on its class in Jquery

I am using Django and I have to select one questions among a choice of two based on the the choice selected. So initially these is just the choice question and based on the answer I have to display required question. The Django from is

us_add_street= forms.CharField(
label='Street Number and Name',
widget=forms.TextInput(attrs={'size':25, 'class': 'local',}),
required=False)

home_add_street= forms.CharField(
label='Street Number and Name',
widget=forms.TextInput(attrs={'size':25,'class': 'foreign',}),
required=False)


It results in the following HTML code

<p><label for="id_us_add_street">Street Number and Name:</label> <input class="local" id="id_us_add_street" name="us_add_street" size="25" type="text" /></p>

<p><label for="id_home_add_street">Street Number and Name:</label> <input class="foreign" id="id_home_add_street" name="home_add_street" size="25" type="text" /></p>


Both elements are hidden pending answering of main question and I am using Jquery to show the element with correct question. I planned to use the class but the class selector works on the p element and not 'input' which is nested inside p. Therefore the following does not work.

var selection = $("p:has(input").filter(".local");


In such case how can I select HTML element based on class of input.

I would want (a) either to add class to p element itself in Django form or (b) ability to choose element from class of input. Cannot use id as in actual application there are multiple question which need to be selected as a class.

Answer

(b) ability to choose element from class of input.

I mean if you know the class you want you can easily select the wrapping

tag with something like this?

var p = $('input.local').parent();