Datatables is duplicating my columns
Datatables is duplicating my columns
Mundaring
Posts: 34Questions: 12Answers: 1
Hi Allan,
I hope you are doing well. I hope you can help me. I am having a weird behaviour on a particular Datatable. I am using datatables in my whole project but one in particular is returning double information, and the second one is empty and some values on my view are looking on that second information.
In the images attached you can see double row for the information requested in positions 1 and 3. position 1 is full with information 3 is completely empty.
Previously position 1 contains all the values except for the ID, for that reason I have to add the Id value in my controller in line 9, but this was already solve adding this line, when in other tables it was not necessary.
Additionally I am having another weird behaviour in my view, but I think this double row is the cause.
Controller
public ActionResult DTEvaluation()
{
var request = HttpContext.Request.Form;
using (var dtDB = new DataTables.Database("sqlserver", conn))
{
var response = new Editor(dtDB, "Evaluation", "Id") //Application.
.Model<VMEvaluation>()
.Field(new Field("Evaluation.Id"))
.Field(new Field("Evaluation.OrganizationId"))
.Field(new Field("Evaluation.CreationDate")
.GetFormatter(Format.DateSqlToFormat("dd/MM/yyyy"))
.SetFormatter(Format.DateFormatToSql("dd/MM/yyyy"))
)
.Field(new Field("Evaluation.EvaluationDate")
.GetFormatter(Format.DateSqlToFormat("dd/MM/yyyy"))
.SetFormatter(Format.DateFormatToSql("dd/MM/yyyy"))
)
.Field(new Field("Evaluation.CycleId"))
.Field(new Field("Evaluation.AdHoc"))
.Field(new Field("Evaluation.IsClosed"))
.Field(new Field("Evaluation.DepartmentName"))
.Field(new Field("Evaluation.PositionName"))
.Field(new Field("Evaluation.ManagerName"))
.Field(new Field("Evaluation.Active"))
.Field(new Field("Cycle.YearCycle"))
.Field(new Field("Cycle.MonthCycleId"))
.LeftJoin("Cycle", "Cycle.Id", "=", "Evaluation.CycleId")
.Process(request)
.Data();
return Json(response, JsonRequestBehavior.AllowGet);
}
}
View Model
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using DataTables;
namespace MUN.PDR.Models.ViewModels
{
public class VMEvaluation : Editor
{
public class EValuation : EditorModel
{
public int Id { get; set; }
public int OrganizationId { get; set; }
public string CreationDate { get; set; }
public string EvaluationDate { get; set; }
public byte CycleId { get; set; }
public bool AdHoc { get; set; }
public Nullable<bool> IsClosed { get; set; }
public string DepartmentName { get; set; }
public string PositionName { get; set; }
public string ManagerName { get; set; }
public bool Active { get; set; }
}
public class Cycle : EditorModel
{
//public byte Id { get; set; }
public short YearCycle { get; set; }
public short MonthCycleId { get; set; }
}
}
}
View
@model IEnumerable<MUN.PDR.Models.Evaluation>
@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<div class="panel panel-primary">
<div class="panel-heading">
<h4 class="panel-title"><strong>Evaluations</strong></h4>
</div>
<div class="panel-body">
<table id="tblEvaluation" class="display compact table table-hover table-striped" cellspacing="0" width="100%">
<thead>
<tr>
<th>
@Html.DisplayNameFor(model => model.Id)
</th>
<th>
@Html.DisplayNameFor(model => model.OrganizationId)
</th>
<th>
@Html.DisplayNameFor(model => model.CreationDate)
</th>
<th>
@Html.DisplayNameFor(model => model.EvaluationDate)
</th>
<th>
@Html.DisplayNameFor(model => model.CycleId)
</th>
<th>
@Html.DisplayNameFor(model => model.AdHoc)
</th>
<th>
@Html.DisplayNameFor(model => model.IsClosed)
</th>
<th>
@Html.DisplayNameFor(model => model.DepartmentName)
</th>
<th>
@Html.DisplayNameFor(model => model.PositionName)
</th>
<th>
@Html.DisplayNameFor(model => model.ManagerName)
</th>
<th>
@Html.DisplayNameFor(model => model.Active)
</th>
</tr>
</thead>
</table>
</div>
</div>
<script>
var editor;
$('document').ready(function () {
editor = new $.fn.dataTable.Editor({
ajax: '/Evaluations/DTEvaluation',
table: '#tblEvaluation',
idSrc: 'Evaluation.Id',
fields: [{
label: "Organization:",
name: "Evaluation.OrganizationId"
}, {
label: "Position:",
name: "Evaluation.PositionName"
}, {
label: "Active:",
name: "Evaluation.Active",
type: "checkbox",
separator: "|",
options: [
{ label: '', value: 1 }
]
}
],
formOptions: {
inline: {
onBlur: 'submit'
}
}
});
// Activate an inline edit on click of a table cell just allowed columns
$('#tblEvaluation').on('click', 'tbody td.editable', function (e) {
editor.inline(this);
});
var evaluations = $('#tblEvaluation').DataTable({
"searching": true,
"bPaginate": true,
"bInfo": true,
"bAutoWidth": true,
oLanguage: {
sProcessing: '<div class="grid-loading"><img src="../images/ajax-loader.gif" width="32" align="middle" /> Loading</div>'
},
"processing": true,
dom: 'Bfrtip',
"iDisplayLength": vDisplayLength,
"pagingType": vpagingType,
ajax: {
url: '/Evaluations/DTEvaluation',
type: 'POST'
},
columns: [
{ data: "Evaluation.Id", className: 'noteditable' },
{ data: "Evaluation.OrganizationId", className: 'noteditable' },
{ data: "Evaluation.CreationDate", className: 'noteditable' },
{ data: "Evaluation.EvaluationDate", className: 'noteditable' },
{
data: "Cycle",
className: 'noteditable',
render: function (data, type, row) {
if (data.YearCycle == null) {
return '';
}
return data.YearCycle + ' - ' + data.MonthCycleId;
}
},
{ data: "Evaluation.AdHoc", className: 'noteditable' },
{ data: "Evaluation.IsClosed", className: 'noteditable' },
{ data: "Evaluation.DepartmentName", className: 'noteditable' },
{ data: "Evaluation.PositionName", className: 'noteditable' },
{ data: "Evaluation.ManagerName", className: 'noteditable' },
{
data: "Evaluation.Active",
render: function (data, type, row) {
if (type === 'display') {
if (data == 1)
return '<input type="checkbox" class="editor-active" checked >';
else
return '<input type="checkbox" >';
}
return data;
},
className: 'editable'
}
],
order: [1, 'asc'],
keys: {
columns: ':not(:first-child)',
keys: [9]
},
select: {
style: 'os',
selector: 'td:first-child'
},
buttons: [
]
});
});
</script>
Thank you so much in advance if you can give me a hand to understand why this behaviour of returning double information structure.
Regards,
Wilson
This question has an accepted answers - jump to answer
This discussion has been closed.
Answers
Hi Allan,
I forgot to atached the images to the previous comment.
I just execute a Trace in the database to see what was the controller sending to the DB and I found all the fields are twice, the quantity of rows are OK , but I don't understand why the fields are twice.
Thanks,
Wilson
Hi Adam,
Sorry, I am trying to find as much Information as I can to provide it to you. I change everything just to display two fields and even though both got duplicated. I don't get why.
Controller
View Model
View
Thanks,
Wilson
In your model you have:
In your controller you use:
Since C# is case sensitive, that's going to cause the issue you are seeing. Fix the typo in the model and it should hopefully work.
Allan
Hi Allan,
That solved my problem. Thank you so much I can't believe such an error, the additional problem was based on that as well.
Thanks,
Wilson