把手没有在Gridview中显示值

时间:2016-07-12 08:32:12

标签: jquery ajax gridview handlebars.js asp.net-mvc-5

我使用MVC5进行编程,并且在一个视图中我想使用一个表,但是tjis表应该是一个Ajax,并且所有的时间都应该修改行号,即使从我的表中省略了一个记录。总是数字应该是一个顺序(1,2,3,...)。同样在表的底部我想显示页码,所有这些职责都应该用于Ajax。 我使用Handlebars.js进行这些操作,并根据主机网页的说明编写了我的程序。现在我的问题是我的数据没有显示在我的表格中,我不知道为什么......

感谢您的帮助

部分视图=> _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);

}

0 个答案:

没有答案