javascript - update div with Ajax MVC4 -

i can't seem understand how update div of items after category selected. i've got far , confused. how values view controller make query?

 //get <li> clicked , display items in category  $(document).ready(function() { $('#test li').click(function() {     var selector = "input[name='" + $(this).id + "value']";     var catid = $(selector).val();       $.ajax({         url: "...",         type: "get",         data: {//return item info},         success: function(data) {             //update div contents here?          }     }); }); }); 

partial updated upon category clicked

@foreach (var item in model)  {      <ul>          <li>@item.item_name</li>         <li><input type="hidden" class="item_id" value="@item.id" /></li>      </ul>   } 

controller

public actionresult partialtwo( int id)//how pass category id?     {          var query = d in db.items                     d.catid==id                     orderby d.dateadded                     select d;         var results = query;           return partialview("_fullinfopartial", results);         //returns items in clicked category        } 

instead of 2 li

<li>@item.item_name</li> <li><input type="hidden" class="item_id" value="@item.id" /></li> 

you can use 1 in order decrease dom size if not required

<li data-id="@item.id">@item.item_name</li> 

and can partial view result $.get easily

$("#test li").on("click",function(){      var requestpage = "/partialtwo?id=" + $(this).data("id");     $.get(requestpage, function(result){         $("#content").html(result); // want put result     }); });