@model List<Desafio.Pessoa>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
font-family: "Times New Roman";
background-color: #384150;
background-color: #3596C9;
border: 1px solid transparent;
text-transform: capitalize;
border: 1px solid #282F3A;
padding: 15px 0px 0px 20px;
border-left: 5px solid #3596C9;
background-color: #212A3A;
border-left: 5px solid #B33C7D;
border-top: 1px solid #DDDFE0;
border-bottom: 1px solid #DDDFE0;
background-color: #d9534f;
background-color: #3596C9;
margin: 0px 20px 0px 20px;
border-bottom: 1px solid #F1F1F1;
color: #FFFFFF !important;
background-color: #9BB2C9 !important;
color: #272E31 !important;
background-color: #E7E9EB !important;
background-color: #5bc0de;
text-transform: capitalize;
background-color: #E07182;
text-transform: capitalize;
<div class="col-xs-3 col-md-3 col-sm-4">
<li class="item" id="andamento">EM ANDAMENTO<span class="badge primary" id="cont">0</span></li>
<li class="item" id="atrasada">ATRASADAS<span class="badge danger">0</span></li>
<div class="col-xs-9 col-md-9 col-sm-8">
<div class="row" id="title">
<button type="submit" id="cadastrar">Cadastrar lorem</button>
<div class="col-xs-12 col-md-12 col-sm-12" id="table">
@foreach (var pessoa in Model)
<td>@pessoa.Situacao</td>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/mvc/4.0/jquery.validate.unobtrusive.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#andamento').on('click', function () {
url: '@Url.RouteUrl(new{ action="EmAndamento", controller="Home"})',
success: function (retorno) {
$('.container').html('').append(retorno);
$('#atrasada').on('click', function () {
url: '@Url.RouteUrl(new{ action="Atrasado", controller="Home"})',
success: function (retorno) {
$('.container').html('').append(retorno);
$("#cadastrar").on('click', function () {
url: '@Url.RouteUrl(new{ action="Cadastrar", controller="Home"})',
success: function (retorno) {
$('.container').html('').append(retorno);
$('.item').click(function () {
$(this).addClass('active').siblings().removeClass('active');
$('.item').hover(function () {
$(this).addClass('hover').siblings().removeClass('hover');
function efeitosTable() {
$('tr').click(function () {
$(this).addClass('linhaS').siblings().removeClass('linhaS');
$('tr').hover(function () {
$(this).addClass('linhaH').siblings().removeClass('linhaH');
function ContarPessoas() {
url: '@Url.RouteUrl(new{ action="ContarPessoas", controller="Home"})',
success: function (retorno) {
$('.primary').html(retorno.andamento);
$('.danger').html(retorno.atraso);