combo-box(Drop down) Change event populate or fetch value from table using ajax in liferay

Hi Friends ,

Today i want to share small ajax portlet example with you . As every post i explain step by step..

I have one combo box & when user change value so according that onchange event i fetch value from db using ajax.

As In above image when user select birthday category then in fetch keyword from db table & append multi select .

Now time for code :

First In Jsp File write below code:

<portlet:resourceURL var="fetchValues" id="fetchcombo"></portlet:resourceURL>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>

<script>
$(document).ready(function() {
       $("#category").change(function() {
var keyId=$("#category").val();
document.getElementById("Features").innerHTML="";

                       var url = "<%=fetchValues%>";
           $.post(url, {keyId : keyId}, function(data)  {