Tablesorter не работает в веб-приложении MVC3 в Visual Studio 2010 - PullRequest
Новая
       6

Tablesorter не работает в веб-приложении MVC3 в Visual Studio 2010

1 голос
/ 29 июля 2011

Tablesorter не работает в веб-приложении MVC3 в Visual Studio 2010?

Чтобы воспроизвести проблему:

  • откройте Visual Studio 2010
  • и создайте новый ASP.Веб-приложение NET MVC 3

  • Заменить Views / Shared / _Layout.cshtml на: 

    <!DOCTYPE html>
<html>
<head>
    <title>@ViewBag.Title</title>
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />

@* This doesn't work and I don't know why *@
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.tablesorter.min.js")" type="text/javascript"></script>

@*This works*@
@*<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
*@

</head>
<body>
    <div class="page">

    <div id="main">
        @RenderBody()
    </div>
    </div>
</body>
</html>

  • Заменить Views / Home / Index.html на: 

    <h2>debug jquery Kano</h2>
<p>
    testing
</p>

<table id="theTable" class="tablesorter">
<thead>
    <tr><th>Tic</th><th>Tac</th><th>Toe</th></tr>
</thead>
<tbody>
    <tr><td>o</td><td>o</td><td>x</td></tr>
    <tr><td>x</td><td>o</td><td>o</td></tr>
    <tr><td>o</td><td>x</td><td>x</td></tr>
</tbody>
</table>

<script type="text/javascript">
//    $(function () {
//        alert("$: jQuery found!");
//    });

    $(document).ready(function () {
        $("#theTable").tablesorter();
    });
</script>

  • Загрузите jquery.tablesorter.min.js из http://tablesorter.com и поместите в каталог / Scripts.

  • Создайте и запустите приложение.

Как вы, вероятно, увидите, вызов таблиц в Index.cshtml не выполняется успешно.

Спасибо за вашу помощь!

ПриветствияКевин

Ответы [ 2 ]

3 голосов
/ 06 декабря 2012

лучший способ сделать это добавить tablesorter.js в bundleconfig.cs, как это- 

bundles.Add(new ScriptBundle("~/bundles/jquery.tablesorter").Include("~/Scripts/jquery.tablesorter.js"));

На странице _layout.cshtml добавить css- 

@Styles.Render("~/Content/css")
        @Scripts.Render("~/bundles/modernizr")
          <link href="@Url.Content("~/Content/style.css")" rel="stylesheet" type="text/css" />
        </head>

и внизу добавьте скрипт типа 

 </footer>

        @Scripts.Render("~/bundles/jquery")
        @Scripts.Render("~/bundles/jqueryui")
        @RenderSection("scripts", required: false)
    </body>
</html>

и на странице используйте добавить сеанс для него .. так что вам не нужно использовать на каждой странице 

@section scripts
{
    @Scripts.Render("~/bundles/jquery.tablesorter")
    <script type="text/javascript">       

        $(document).ready(function () {
            $("#myTable").tablesorter();
        });

        $(document).ready(function () {         
            $("#myTable").tablesorter({ sortList: [[0, 0], [1, 0]] });
        });
    </script>
}
0 голосов
/ 04 августа 2011

Кажется, проблема в том, что Javascript кэшируется.Обходной путь - закрыть все экземпляры браузера между запусками и минимизировать использование кнопок возврата в браузере.

...