Adding events to tabs in Spring MVC

I'm using Spring MVC to add features to a bare-bones program for my training. That being said, I'm very new to programming and the whole MVC setup and I'm having difficulty getting the online solutions to work for my specific problem. So to start, I've added tabs to my page:

    <div id="tabs" role="tabpanel">
            <!-- Nav tabs -->
        <ul class="nav nav-tabs" role="tablist">
            <li role="presentation" class="active"><a href="#tabs-1" aria-controls="Active" role="tab" data-toggle="tab">Active</a></li>
            <li role="presentation"><a href="#tabs-2" aria-controls="Inactive" role="tab" data-toggle="tab">Inactive</a></li>
            <li role="presentation"><a href="#tabs-3" aria-controls="Retired" role="tab" data-toggle="tab">Retired</a></li>
        </ul>
            <!-- Tab panes -->
        <div class="tab-content">
        <div role="tabpanel" class="tab-pane active" id="Active"></div>
        <div role="tabpanel" class="tab-pane" id="Inactive"></div>
        <div role="tabpanel" class="tab-pane" id="Retired"></div>
        </div>
    </div> 

I want to sort the table full of 'modules' in my page depending on what tab the user clicks. These tabs consist of 'Active', 'Inactive', and 'Retired'. Here is my table setup if this should help:

    <tbody>
            <c:forEach items="${modules}" var="module"> 
                <tr>
                    <td>${module.id}</td>
                    <td>${module.title}</td>
                    <td>${module.credit}</td>
                    <td>${module.minimumScore}</td>
                    <td><select class="input-medium" name="status" id="status" onchange="">
                        <option <c:if test='${module.status == "Active"}'>selected="selected"</c:if> value="Active">Active</option>
                        <option <c:if test='${module.status == "Inactive"}'>selected="selected"</c:if> value="Inactive">Inactive</option>
                        <option <c:if test='${module.status == "Retired"}'>selected="selected"</c:if> value="Retired">Retired</option>
                        </select></td>
                    <td><a href="/javawebtraining/module/${module.id}/edit" class="btn btn-mini"><i class="icon-pencil"></i></a></td>
                </tr>               
            </c:forEach>
        </tbody>

My intention was to write a javascript function that, in pseudo code, does something like this: if tab clicked equals 'active' or some identifier then redefine the model attribute, 'module', to be modules with only that status value. Since I'm already using 'module' as my attribute that populates my table, I figured I could just use it again but change the SQL query behind it. Here's my controller so far:

  @RequestMapping(method = RequestMethod.POST, value = "/admin")
public final String changeTab(final ModelMap model, @RequestParam(value = "status") String status) {

    model.addAttribute("modules", moduleDao.sortStatus(status));
    return "module/admin";
}

And here's my non-working javascript function:

    <script type="text/javascript" >
   $(function () {
   $('#tabs').tabs({
   activate: function (event, ui) {
   var $activeTab = $('#tabs').tabs('option', 'active');
   var status; 
   if ($activeTab == 1) {
   status = "active";
  }

  if ($activeTab == 2){
    status = "inactive";
  }

  if ($activeTab == 3){
    status = "retired";
  }
  }
  });
  });
  </script>

My main areas of concern are getting the correct HTML and Javascript. Any help is much appreciated.