How to use Joomla Form API for displaying individual xml form fields

Problem: You have a custom component, in which you are using form API to show your XML form fields. But what if you want to skip (if you have multiple fieldsets in the form), and if you want to skip any of the existing form? Then this article will help you.

Solution: You will use Joomla Form API.

<?php foreach($this->form->getFieldset("basic") as $field) : ?>
<div class="control-group">
<div class="controls">
<?php 
// RENDER all fields whom name is not CLASS
if($field->getAttribute("name")!="class") 
	echo $this->form->renderField($field->getAttribute("name"));
else {	
?>
	<div class="control-group">
	<div class="control-label"><label id="jform_class-lbl" for="jform_class">Subject</label></div>
	<div class="controls">
	<?php
	$app = Factory::getApplication();
	$input = $app->input;
	$txtlevel= $input->get('txtlevel', '9', 'string');

	$app = Factory::getApplication();
	$cid= $app->input->get('id');
	$db = Factory::getDbo();

	$query = "SELECT DISTINCT id AS value, title AS text FROM tutor_categories WHERE parent_id=$txtlevel AND level=4 AND published=1";

	$rows = $db->setQuery($query)->loadObjectlist();
	$default = 0;
	
	## Initialize array to store dropdown options ##
	$options = array();
	
	foreach($rows as $row){
		$options[] = HTMLHelper::_('select.option', $row->value, $row->text);
	}
	?>
	
		<input type="hidden" id="jform_class" name="jform[class]" />
		<select class="jform_class" id="jform_class_select" name="jform_class_select" multiple="multiple" style="width:100%">
		<?php 
		foreach($options as $opt) {
			  
			'<option value="'.$opt->value.'" '.$opt->disable.'>'.$opt->text.'</option>';
		}
		?>
		</select>

		</div>
	</div>

<?php 
}
?>
</div>
</div>

<?php endforeach; ?>

<!-- AJAX CALL -->
<script type="text/javascript">
jQuery(document).ready(function(){

	// Fetch Class(now subject) from SELECTED level
	jQuery("#jform_level").change(function(){
		jQuery.ajax({
		type: "POST",
		url: "index.php?option=com_advertise&controller=signup&task=getclassascate&txtlevel="+jQuery(this).val(),
		data:'txtlevel='+jQuery(this).val(),
		beforeSend: function(){
		},
		success: function(data){
			jQuery("#jform_class_select").html(data);
		}
		});
	});
});
</script>

In this code snippet, which will render all form fields except the field that has name "class", in else conditions we will have this field render at own choice. And in the last, it is Ajax's call to get the class populated depending on a selected level field value.