Mvc partial view reload or refresh - asp.net-mvc-2

Question

i have a view called Index with 4 partial view like _tab1,_tab2,_tab3 and _tab4 , each partial view has form fields including submit and cancel button, when i click on _tab4 cancel button i want to reload the same _tab4 partial view with form data cleared.
<ul class="tab">
<li class="active" id="tab1">tab1</li>
<li class="" id="tab2">tab2</li>
<li class="" id="tab3">tab3</li>
<li class="" id="tab4">tab4</li>
</ul>
<div class="tabbody" style="display: block; ">
<% Html.RenderPartial("_tab1"); %>
</div>
<div class="tabbody"style="display: block; ">
<% Html.RenderPartial("_tab2"); %>
</div>
<div class="tabbody"style="display: block; ">
<% Html.RenderPartial("_tab3"); %>
</div>
<div class="tabbody" style="display: block; ">
<% Html.RenderPartial("_tab4"); %>
</div>
Each partial view has submit and cancel button

Answer 1

Mark each of your divs with unique id:
<div id="tab1-content" class="tabbody" style="display: block; ">
<% Html.RenderPartial("_tab1"); %>
</div>
Execute some jQuery code on cancel button click function:
$("cancelTab1buttonselector").click(function() {
$.get("#Html.Action("Tab1")", function(data) {
$("#tab1-content").html(data);
});
});
Where "cancelTab1buttonselector" is selector for cancel button in tab1. Do same for each tab.
You need to create controller's actions returning each tab content as PartialViewResult:
public ActionResult Tab1()
{
var model = ...get model...
return PartialView("_tab1", model);
}

Answer 2

Try just load ur partials to the wrapper with data check attribute
html:
<ul class="tab">
<li class="active tab" id="tab1" data-tabid="tab1">tab1</li>
<li class="tab" id="tab2" data-tabid="tab2">tab2</li>
<li class="tab" id="tab3" data-tabid="tab3">tab3</li>
<li class="tab" id="tab4" data-tabid="tab4">tab4</li>
</ul>
<div class="tabbody" style="display: block; ">
<% Html.RenderPartial("_tab1"); %>
</div>
jquery :
$(document).on('click','.tab',function(){
var tabId = $(this).data('tabid');
if(tabId=='tab1'){
$('.tabbody').empty().load('/Controller/_tab1');
}
if(tabId=='tab2'){
$('.tabbody').empty().load('/Controller/_tab2');
}
if(tabId=='tab3'){
$('.tabbody').empty().load('/Controller/_tab3');
}
if(tabId=='tab4'){
$('.tabbody').empty().load('/Controller/_tab4');
}
});