mvc3 datatabels and ajax-beginform

miko5054

im trying to send and ajax request and returning the result into a new table i debugged the req and i can confirm that evry thing is good except the VIEW the end result is an empty table instead of one row

one more weird thing is if i page source i can see all the table result(more than the one that suppose to)

this is the view:

[code] @model Fnx.Esb.ServiceMonitor.ViewModel.MainModels
@{
ViewBag.Title = "MainSearch";
}
@Html.EditorForModel()
@{
AjaxOptions ajaxOpts = new AjaxOptions
{

UpdateTargetId = "MainTable",
InsertionMode = InsertionMode.Replace,
Url = Url.Action("queryData", "MainSearch"),




};
}

@using (Ajax.BeginForm(ajaxOpts))
{






@Html.EditorFor(x => x.MainSearchModel)














Advanced Search



@Html.EditorFor(x => x.AdvanceSearchContainerModel)











Search



clear




























serviceDuration


status


ESBLatency


serviceName


serviceId


startTime


endTime


instanceID




@foreach (var item in Model.MainTableModel)
{



@Html.DisplayFor(modelItem => item.serviceDuration)


@Html.DisplayFor(modelItem => item.status)


@Html.DisplayFor(modelItem => item.ESBLatency)


@Html.DisplayFor(modelItem => item.serviceName)


@Html.DisplayFor(modelItem => item.serviceId)


@Html.DisplayFor(modelItem => item.startTime)


@Html.DisplayFor(modelItem => item.endTime)


@Html.DisplayFor(modelItem => item.instanceID)


}



}[/code]

the datatables: javascript options

[code]
$('#MainTable').dataTable({
"sDom": "<'row'<'span6'l><'span6'f>r>t<'row'<'span6'i><'span6'p>>",
"bDestroy": true
});
[/code]