@model IEnumerable<Marathon.SPP.Entities.BusinessEntities.

Comment>
<div class="form-group">
<div class="col-sm-12 col-md-12">
@*<label class="col-sm-2 col-md-2 control-label">Comments</label>*@
@*<div class="col-sm-10 col-md-10 namePadding">
<button type="submit" class="btn btn-gray btn-sm" id="addComment">
<span class="glyphicon glyphicon-plus-sign"></span> Add Comment
</button>
<a href="#" style="font-size: 11px;">
19 Comments <span class="glyphicon glyphicon-chevron-down"></spa
n>
</a>
<div class="pull-right" style="font-size: 11px;" data-toggle="toolti
p" title="Sort comments in ascending and descending order by Created Date.">
<label>Sort By: </label>
<button class="btn btn-primary btn-sm">
<span class="glyphicon glyphicon-circle-arrow-down"></span>
</button>
</div>
</div>*@
<div class="margin-top10 col-md-12 gridPadding">
<label class="col-sm-2 col-md-2 control-label">Comments</label>
<div class="col-sm-10 col-md-10 namePadding">
<div class="table-responsive" id="listView">
@*<table class="table table-bordered table-striped">
<tr>
<td> <textarea class="form-control remove-input" rows="2
"></textarea></td>
<td class="text-center vCenter commentsButton">
<button type="submit" class="btn btn-gray btn-sm"><span
class="glyphicon glyphicon-trash"></span></button>
</td>
<td class="text-center vCenter commentsButton">
<button type="submit" class="btn btn-gray btn-sm"><span
class="glyphicon glyphicon-ok"></span></button>
</td>
</tr>
</table>*@
@*<tr>
<td> <textarea class="form-control remove-input" rows="2" pl
aceholder="This is already added comments" disabled></textarea></td>
<td class="text-center vCenter commentsButton">
<button type="submit" class="btn btn-gray btn-sm"><span clas
s="glyphicon glyphicon-trash"></span></button>
</td>
<td class="text-center vCenter commentsButton">
<button type="submit" class="btn btn-gray btn-sm"><span clas
s="glyphicon glyphicon-edit"></span></button>
</td>
</tr>
<tr>
<td colspan="3"> <textarea class="form-control remove-input"
rows="2" placeholder="This is already added comments" disabled></textarea></td>
</tr>*@
@*TODO: Working code*@
@*@(Html.Kendo().ListView<Marathon.SPP.Entities.BusinessEnti
ties.Comment>()
.Name("ListView")
.TagName("div")

.ClientTemplateId("template")
.DataSource(dataSource => dataSource
.Model(model =>
{
model.Id("CommentId");
model.Field("Description", typeof(string));
})
.Read(read => read
.Action("GetComments", "Suggesti
on")
)
)
)*@
@*</table>*@
@(Html.Kendo().Grid<Marathon.SPP.Entities.BusinessEntities.C
omment>()
.Name("Grid1")
.Events(e => e.DataBound("onDatabound"))
.Columns(columns =>
{
columns.Bound(p => p.CommentId).Visible(false);
columns.Bound(p => p.IsDeleteVisible).Column.Hidden = true;
columns.Bound(p => p.IsEditVisible).Column.Hidden = true;
columns.Bound(p => p.Description)
.ClientTemplate
(
"#for(var i = 0; i < Model.length; i++) {" +
"# <li>" +
"<a href=/Idea/NextState?state=#=NextAvailableStates[i]
.ID#" + "> #=NextAvailableStates[i].StepName # </a>" +
"</li> #" +
"} #"
);
//.ClientTemplate(@"<textarea class='form-control remove-input' disa
bled>" + "#=Description#" + "</textarea>");
columns.Command(command => {
command.Edit().Text(" ").CancelText(" ").UpdateText(" ");
command.Destroy().Text(" "); }).Width(172);
})
.ToolBar(toolbar =>
{
toolbar.Template(@<text>
<div class="toolbar">
@item.CreateButton()
<a href="#" style="font-size: 11px;" id="rowCount">
19 Comments <span class="glyphicon glyphicon-chevron-down"></
span>
</a>
<div class="pull-right" style="font-size: 11px;" data-toggle="too
ltip" title="Sort comments in ascending and descending order by Created Date.">
<label>Sort By: </label>
<button class="btn btn-primary btn-sm">
<span class="glyphicon glyphicon-circle-arrow-down"></spa
n>
</button>
</div>
</div>
</text>);
})

.Editable(editable => editable.Mode(GridEditMode.InLine))

.Scrollable()
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(5)
.Model(model => model.Id(p => p.CommentId))
.Create(update => update.Action("EditingInline_Create", "Grid"))
.Read(read => read.Action("GetComments", "Suggestion"))
.Update(update => update.Action("EditingInline_Update", "Grid"))
.Destroy(update => update.Action("EditingInline_Destroy", "Grid"))
)
)
</div>
</div>
</div>
</div>
</div>
<script>
$(".k-grid .k-grid-header").hide();
function onDatabound() {
var dimension_col = 1;
var grid = $("#Grid1").data("kendoGrid");
var count = grid.dataSource.total();
// alert($("#rowCount").text());
$("#rowCount").html(count + " Comments" + "<span class='glyphicon glyphi
con-chevron-down'></span>");
$('#Grid1' + '>.k-grid-content>table').each(function (index, item) {
//

// first_instance holds the first instance of identical td

var first_instance = null;
var second_instance = null;
$(item).find('tr').each(function () {
// find the td of the correct column (determined by the colTitle

)
var dimension_td = $(this).find('td:nth-child(' + dimension_col
+ ')');
var suggestion_td = $(this).find('td:nth-child(' + 3 + ')');
// alert(dimension_td.text());
if (dimension_td.text() === "false" && suggestion_td.text().tri
m() !== "") {
// alert(suggestion_td.text());
first_instance = $(this).find('td:nth-child(' + 4 + ')');
second_instance = $(this).find('td:nth-child(' + 5 + ')');
suggestion_td.attr('colspan', 2);
first_instance.remove();
second_instance.remove();
}
})
})
}
</script>
@*<script>

$('#Grid1 .k-grid-header').hide();
</script>
<script type="text/x-kendo-tmpl" id="template">
<tr>
<td colspan="3"> <textarea class="form-control remove-input" disabled>${Desc
ription}</textarea></td>
<td class="text-center vCenter commentsButton">
<button type="submit" class="btn btn-gray btn-sm"><span class="glyphicon
glyphicon-trash"></span></button>
</td>
<td class="text-center vCenter commentsButton">
<button type="submit" class="btn btn-gray btn-sm"><span class="glyphicon
glyphicon-edit"></span></button>
</td>
</tr>
</script>*@