ورود

View Full Version : نشان ندادن اطلاعات در table با استفاده از Handlebars



vbiman
پنج شنبه 24 تیر 1395, 09:26 صبح
سلام،من پروژمو با5 mvc دارم می نویسم و در یکی از view ها از یک Table می خوام استفاده کنم ولی این Table باید به صورت Ajax باشه و شماره ردیف همیشه مرتب بشه حتی اگه یک رکورد حذف بشه بازم مرتب سازی اعداد صورت بگیره (1,2,3…) و همچنین در انتهای این Table صفحه بندی هم داشته باشه و همه این عملیات به صورت Ajax باشه.
من برای این عملیات از Handlebars.js استفاده کردم و طبق الگوهای سایت سازندش برناممو نوشتم حالا مشکلی اینجاست که اطلاعات بانک اطلاعاتی من در Table نشان داده نمی شود.حالا چرا نمی دونم.....من کدهامو میزارم یه بررسی بفرمائید لطفاً.


Partial view=> _GDview

<script id="entry-template" type="text/x-handlebars-template">
{{#each list}}

<tr>
<th>{{index}}</th>
<th>{{Author}}</th>
<th>{{Email}}</th>
<th>{{Subject}}</th>
<th>{{TextBody}}</th>
<th>{{MessageDate}}</th>
<td>
<a href="/admin/Contact/Edit/{{this.id}}">Edit</a> &nbsp; &nbsp;
<a href="/admin/Contact/Delete/{{this.id}}">Delete</a>
</td>
</tr>
{{/each}}

<table align="center" border="1" style="border:2px solid black" id="grid">
<thead>
<tr>
<th>index</th>
<th>author</th>
<th>email</th>
<th>subject</th>
<th>textmessage</th>
<th>date</th>
<th>edit / delete</th>
</tr>
</thead>
<tbody>


</tbody>


Index.chtml


<script src="~/js/handlebars.min.js"></script>
<script src="~/js/GDview.js"></script>

@Html.Partial("_GDview")


ContactController

public JsonResult Get(int pageIndex, int pageSize)
{
JsonResult result = new JsonResult();
result.Data = new
{
RecordCount = Messages.Count(),
RecordData = Messages.SelectMessages(pageIndex, pageSize)
};
return result;
}


Messages.cs

public static List<Message> SelectMessages()
{
return db.Messages.ToList();
}


GDview.js

$(function () {
var pageSize = 1; pageIndex = 1; counter = 1;

//Set Row Number
Handlebars.registerHelper('index', function () {
return (pageindex - 1) * pageSize + counter++;
});

//Set PageSize
$("#size").change(function () {
pageSize = $(this).val();
pageIndex = 1;
counter = 1;
GridView();
})

//Set PageIndex
$(".paging").delegate('a.page', 'click', function () {
pageIndex = $(this).attr("data-index");
counter = 1;
GridView();
})

//Main Function(AJAX)
function GridView() {
$("#loading").fadeIn("slow");

$.ajax({
url: '/Admin/Contact/Get',
type: 'Post',
data: { pageIndex: pageIndex, pageSize: pageSize },
success: function (result) {
var source = $("#entry-template").html();
var template = handlebars.compile(source);
var output = template({
list: result.RecordData,
Count: result.RecordCount
});
$('#grid tbody').html(output);
},
error: function () {
alert('Nok');
}
})
}
GridView();

})

function makepaging(totalPages, pageIndex) {
var opaging, i, j, k;

i = pageIndex;
j = pageIndex - 1;
k = pageIndex + 1;

var oBefore, oAfter;
oBefore = "";
oAfter = "";

while (j != 0 && j != i - 6) {
oBefore = "<a class='Page' href='#' data-index='" + (j) + "'>" + j + "</a>&nbsp;" + oBefore;
j--;
}

if ((i - 6) > 0)
oBefore = "&nbsp;<a class='Page' href='#' data-index='" + (i - 6) + "'>...</a>&nbsp;" + oBefore;


for (; k < totalPages + 1 && k < i + 6; k++) {
oAfter += "<a class='Page' href='#' data-index='" + (k) + "'>" + k + "</a>&nbsp;";
}

if ((i + 6) <= totalPages)
oAfter += "<a class='Page' href='#' data-index='" + (i + 6) + "'>...</a>&nbsp;";

oPaging = oBefore + "<a class='CurPage' href='#' rel='' style='color:white;background-color:black'>" + i.toString() + "</a>&nbsp;" + oAfter;

$('.paging').html(oPaging);