Disable all tags and elements inside top level tag using JQuery

[ankur0101]

Hi,

I would like to know how to disable all components inside ID attribute of tag. Such as I have HTML

<p id="pointer">
            		<div class="control-group">
						<label class="control-label" for="inputEmail"><b>Students Name :</b></label>
							<div class="controls">
		            			
		            		</div>
		            	</div>
		            	<div class="control-group" id="element_row">
						<label class="control-label" for="inputEmail"><b>Particulars :</b></label>
							<div class="controls">
		            		<select name="particulars" id="particulars">
		            		<option value="0">SELECT</option>

						    </select>
						      
						    Amount : <input name="amount[]" type="text" maxlength="7" onkeyup="sum()"> <button class="btn btn-mini btn-primary" type="button" onclick="addnew_row()" id="add"><i class="icon-plus-sign icon-white"></i></button>   <button class="btn btn-mini" type="button"><i class="icon-minus-sign"></i></button>
		            		</div>
		            	<p> </p>
		            	<hr style="color: black" />
		            	<div class="control-group">
						<label class="control-label" for="inputEmail"><b>Total Amount :</b></label>
							<div class="controls">
		            			<input name="total_amount" type="text" style="font-size:25pt;height:30px" />
		            		</div>
		            	</div>
		            	</div>
		            	<p id="element_row_pointer"></p>
		            	<div class="control-group">
						<label class="control-label" for="inputEmail"><b>Paid by :</b></label>
							<div class="controls">
		            			<label class="radio">
								  <input type="radio" name="payment_mode" id="cash" value="option1" checked>
								  Cash
								</label>
								<label class="radio">
								  <input type="radio" name="payment_mode" id="chq" value="option2">
								  Cheque
								</label>
								<label class="radio">
								  <input type="radio" name="payment_mode" id="dd" value="option2">
								  Demand Draft
								</label>
		            		</div>
		            	</div>
		            	<div class="control-group">
						<label class="control-label" for="inputEmail"><b>Cheque / D.D. No. :</b></label>
							<div class="controls">
		            			<input name="chq_dd_no" type="text" id="extras_textbox" />
		            		</div>
		            	</div>
		            	<div class="control-group">
						<label class="control-label" for="inputEmail"><b></b></label>
							<div class="controls">
		            			<input type="submit" name="submit" class="btn btn-large btn-success" />
		            		</div>
		            	</div>
            	</p>

How to disable everything from <p id="pointer"> ...... </p> using jquery ??

 

I tired 

$("#pointer").attr("disabled", true);

but it does not work

 

Need help,

Thanks

[ankur0101]

Hi guys,

I solved this problem by myself.

I used 

$('#pointer').find('input, label, p, select').attr('disabled','disabled');
$('#pointer').hide();

Problem solved.

Source :- 

http://api.jquery.com/hide/

 

http://stackoverflow.com/questions/1073884/how-to-i-hide-and-show-html-elements-using-jquery

[codefossa]

Why bother to find and disable anything inside of a tag if you're hiding it?  If they're going to edit it to do whatever, they could easily remove the disabled attribute, if it even affects the form submission.

 

And, you may want to check out removing an element, depending on what you're doing.