4 связанных списка
 

Добрый день!

Прошу помощи исправить ошибки в скрипте, может вообще перечеркнете и дадите cвый вариант...

Задача сделать 4 выпадающих связанных списка без перезагрузки страницы.
Использовал скрипт из Интернете и пытался перестроить под себя. Три списка работает правильно, с четвертым не получается... Т.е. не отображается и соо-но не передается значение в <select> Услуга

<script>
$(document).ready(function () {

$('#sub_subsection').css('display', 'none');
$('#s_category').css('display', 'none');
$('#s_service').css('display', 'none');

$("#get_section").change(function() {
		clearlist();
		$('#s_category').css('display', 'none');		
		var sectionvalue = $("#get_section option:selected").val();
		if (sectionvalue === '') {clearlist(); $('#sub_subsection').css('display', 'none');  }

		$('#s_service').css('display', 'none');		
		var categoryvalue = $("#get_category option:selected").val();
		if (categoryvalue === '') {clearlist(); $('#service').css('display', 'none');  }

getarea();
	})


function getarea() {
	var section_value = $("#get_section option:selected").val();
	var p_id = $("#page_id").val();
	var area = $("#get_subsection");
	var getarea_value = area.val();
	if (section_value === "") {
		area.attr("disabled",true);
	} else {
		area.attr("disabled",false);
		area.load('get_subsection.php',{section : section_value, page_id : p_id});
		$('#sub_subsection').css('display', 'block');
	}
	
	$("#get_subsection").change(function() {
		getcategory();	
	})
}

function getcategory() {
	var subsection_value = $("#get_subsection option:selected").val();
	if(subsection_value == undefined)
	{
		var subsection_value = $("#subsection_id").val();
	}
	var p_id = $("#page_id").val();
	var area = $("#get_category");
	if (subsection_value === "") {
		area.attr("disabled",true);
		$('#s_category').css('display', 'none');
		$("#get_category").empty();
	} else {
		area.attr("disabled",false);
		area.load('get_category.php',{subsection : subsection_value, page_id : p_id});
		$('#s_category').css('display', 'block');
	}
	
	$("#get_category").change(function() {
		getservice();	
	})

}


function getservice() {
	var category_value = $("#get_category option:selected").val();
	if(category_value == undefined)
	{
		var category_value = $("#category_id").val();
	}
	var p_id = $("#page_id").val();
	var area = $("#get_service");
	if (category_value === "") {
		area.attr("disabled",true);
		$('#s_service').css('display', 'none');
		$("#get_service").empty();
	} else {
		area.attr("disabled",false);
		area.load('get_service.php',{service : category_value, page_id : p_id});
		$('#s_service').css('display', 'block');
	}

}

function clearlist() {
	$("#get_subsection").empty();
	$("#get_category").empty();
	$("#get_service").empty();

}	

});	
</script>

и форма

<tr>
<th class="title_th">Раздел</th>
<td>
<select id="get_section" name="get_section" style='width: 99%;' required>
<?php
$rez=mysqli_query($mysqli , "SELECT  * FROM `catalog_section`  ");
$c=0;
echo   "<option value=''></option>";
while($sr=mysqli_fetch_array($rez)){$c++;
echo   "<option value='".$sr['id']."'>".$sr['section']."</option>";
}
?>
</select>
</td>
<td style="width:20px; border-left-style: none;"></td>
</tr>
<tr>
<th class="title_th">Подраздел</th>
<td>
<div id="sub_subsection">
<select id="get_subsection" name="get_subsection" style='width: 99%;'></select>
</div>
</td>
<td style="width:20px; border-left-style: none;"></td>
</tr>

<tr>
<th class="title_th">Категория</th>
<td>
<div id="s_category">
<select id="get_category" name="get_category" style='width: 99%;'></select>
</div>
</td>
</tr>
<td style="width:20px; border-left-style: none;"></td>
</tr>

<tr>
<th class="title_th">Услуга</th>
<td>
<div id="s_service">
<select id="get_service" name="get_service" style='width: 99%;'></select>
</div>
</td>
</tr>
<td style="width:20px; border-left-style: none;"></td>
</tr>