如何将 JQuery-BootGrid 数据 api 调试到 NancyFX答案

【问题标题】：How do I debug JQuery-BootGrid data api to NancyFX如何将 JQuery-BootGrid 数据 api 调试到 NancyFX
【发布时间】：2016-01-11 16:43:15
【问题描述】：

问题已编辑：

我用 jquery-bootgrid 数据 API 编写了一个页面。

它应该使用 AJAX 调用我的 NancyFX REST API，但事实并非如此。

客户端：

我正在从本地 repo 提供引导网格：

<script src="~/scripts/jquery.bootgrid.min.js"></script>

也许我不应该使用 .min.js 文件，而应该使用打开的文件进行调试？如果是这样，你能告诉我该怎么做，或者给我指明方向吗？

页面代码是

...
data-toggle="bootgrid" data-ajax="true" 
data-url="/cars/0" data-method="GET"

服务器端：

我有 NancyFx 提供的 html 页面，除了网格是空的之外，它看起来还不错。在 Visual Studio 中有一个带有断点的 API 模块（在 localhost 上运行），具有以下内容：

Get["/cars/{status:int}?current={current}&rowCount={rowCount}"] = parameters => ...

永远不会调用此代码。如何强制调试器在检查路由之前捕获 ANY 调用，并向我显示进入服务器的内容？

我正在使用 chrome 调试器。

【问题讨论】：

标签： ajax google-chrome-devtools nancy jquery-bootgrid script-debugging

【解决方案1】：

当前 URL 不符合 Nancy 标准。我们不会在路由中添加查询字符串参数。

你会想写一些类似的东西：

Get["/cars/{status:int}"] = parameters => 
{
    var status = (int)parameters.status;
    var current = (string)parameters.current.TryParse("");
    var rowCount = (int)parameters.current.TryParse(10);

    ...
}

沿着这些思路。（写在我的头上）

另一种方法是像这样绑定请求：

Get["/cars/{status:int}"] = parameters => 
{
    var request = this.Bind<MyRequest>();

    ...
}

public class MyRequest
{
    public MyRequest()
    {
        RowCount = 10;
    }

    public int Status {get;set;}
    public string Current {get;set;}
    public int RowCount {get;set;}
}

【讨论】：

根据@Phill 指向正确方向的答案，查看下一个答案以了解有关此问题的详细信息。

【解决方案2】：

将 nancy 更改为 Get["/cars/{status:int}"] = parameters => 可以捕获请求。

没有调用 ajax，因为我丢失了 JQuery 第一行... $(document).ready(function() {

要获取你需要使用的 current 和 rowCount

var current = (int)Request.Form["current"];
var rowCount = (int)Request.Form["rowCount];

顺便说一句，Get 不起作用（我认为它是 Bootgrid 错误），所以我将其更改为 POST。

【讨论】：

【解决方案3】：

调试任何 jQuery 库最简单的方法是使用内置调试器，我使用 chrome 有点困难，所以我使用 Firefox，但如果你习惯使用 chrome，那么使用它，功能差不多相同，但使用 Firefox，您可以直接切换到与 html 中的任何元素关联的事件（在检查部分中）进入调试器后，设置断点并通过 F5 或 Ctrl+F5 刷新页面，如果您选择了有效断点，您可以看到与每个变量关联的所有值以及每个函数。其次，使用调试器中的步入选项查看确切的行指向的位置，如果它引用任何其他文件，它将在调试器菜单中自动弹出打开。 Firefox 的蜘蛛猴非常擅长调试和关联代码（这完全是我的看法）。 3-对于api调用，数据未处理或未显示的原因，很大程度上在于库的结构，（根据什么参数调用/获取/检索数据），为此尝试使用“watch表达式”选项，并尝试在控制台部分的加载 dom 上实现代码，并在您认为有错误或应该显示该值的节点上触发。

【讨论】：