个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
如果之前有人问过这个问题，我很抱歉，但我在任何地方都找不到。
我对 Web 开发的各个方面都比较陌生，但我决定创建一个漂亮的小应用程序，以便从办公室的任何地方访问和搜索数据库。
我遵循了几个使用 WebMatrix 的教程，了解如何设置一个简单的网页等，我大部分时间都在使用它，除了处理转到 WebGrid 中的下一页。这就是我所说的(有点晦涩，但无济于事)
我在网上找到了两个关于尝试使用 javascript 的例子，他们给了我这些代码来使用..
在名为 _layout.cshtml 的文件中
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Start</title>
<script src="@Href("~/scripts/jquery-1.6.2.min.js")" type="text/javascript"></script>
<link href="@Href("~/styles/site.css")" rel="stylesheet" />
@RenderSection("script", required: false);
</head>
<body>
@RenderBody();
</body>
</html>
然后是一个名为 _PageStart.cshtml 的文件
@{
Layout = "~/_layout.cshtml";
}
然后我开始创建自己的站点并根据我看过的一些教程对其进行建模，特别是围绕 WebGrid。
这是我的 Default.cshtml
@{
string searchStr = Request["searchBox"];
string choice = Request["choice"];
Database db = Database.Open("NameOfDatabase");
if(choice == null)
{
choice = "DefaultColumnName"; // they choose which column they want to search
//via radio buttons
}
var queryStr = "SELECT * FROM databaseTable WHERE "+choice
+" LIKE '"+searchStr+"%'";
var data = db.Query(queryStr);
WebGrid grid = new WebGrid(source: data,
defaultSort: "Name",
rowsPerPage: 20, canPage:true, canSort:true);
if(IsPost)
{//not really doing anything here
}
}
<head>
<title>Database</title>
<style type="text/css"> " //added that because it was goofing up the color scheme..
.grid { margin: 4px; border-collapse: collapse; width: 600px; }
.head { background-color: #E8E8E8; font-weight: bold; color: #FFF; }
.grid th, .grid td { border: 1px solid #C0C0C0; padding: 1px; }
.alt { background-color: #E8E8E8; color: #000; }
.style1{ min-width: 300px; max-width:400px; font-weight:bold; white-space:nowrap; overflow:hidden;}
.style2{ min-width: 100px; max-width:150px; overflow:hidden;}
.style3{ min-width: 200px; max-width:250px; overflow:hidden; white-space:nowrap;}
.style4{ min-width:100px; max-width:200px; overflow:hidden; }
.style5{ min-width: 150px; max-width:250px; overflow:hidden; white-space:nowrap;}
.style6{ min-width: 200px; max-width:250px; overflow:hidden;}
</style>
</head>
<body onload="document.form1.searchBox.focus();">
<h1>Database</h1>
<form name="form2" method="post" action="">
<p><input type="submit" name="populate" value="Populate DB" /></p>
</form>
<div id="grid">
@grid.GetHtml(
tableStyle: "grid",
headerStyle: "head",
alternatingRowStyle: "alt",
columns: grid.Columns(
grid.Column("Name","Name",
format: @<p title="@item.Name.Trim()">@item.Name</p>,
style:"style1"),
//repeat to create 5 more columns exactly the same essentially
), mode: WebGridPagerModes.All
)
</div>
<form name="form1" method="post" action="Default">
<p><label for="searchBox">Search:</label>
<input type="text" name="searchBox" value="@searchStr" /></p>
<p><input type="radio" name="choice" value="Name" />
<label for="Name">Name</label></p>
<p><input type="radio" name="choice" value="choice1" />
<label for="choice1">choice1</label></p>
<p><input type="radio" name="choice" value="choice2" />
<label for="choice2">choice2</label></p>
<p><input type="radio" name="choice" value="choice3" />
<label for="choice3">choice3</label></p>
<p><input type="radio" name="choice" value="choice4" />
<label for="choice4">choice4</label></p>
<p><input type="radio" name="choice" value="choice5" />
<label for="choice5">choice5</label></p>
<p><input type="submit" name="Submit" value="Submit" /></p>
</form>
</body>
@section script{
<script type="text/javascript">
$(function () {
$('th a, tfoot a').live('click', function () {
$('form1').attr('action', $(this).attr('href')).submit()
return false;
});
});
</script>
}
这是我的一般网站..好吧，每当你输入某人的名字和一个选择并点击提交时，它查询它很好，但如果有超过 20 个名字然后当我点击第二页时它基本上重做我的用于获取所有名称的原始查询，我丢失了他们在文本字段中输入的内容以及他们选择的选项。
我发现的脚本应该在用户单击 webgrid 创建的链接以转到下一页时触发，并将 form1 中的数据放入某个东西中，以便我可以在加载页面时将其拉回再次。
我在网上看了又看，寻找解决方案，如果我找到了一个，我还不明白它是如何工作的。所以如果有人理解我在说什么并且可以帮助我，我将不胜感激。
谢谢!
最佳答案
阅读 Mikesdotnetting The WebGrid - Efficient Paging and Sorting at
http://mikesdotnetting.com/Article/181/The-WebGrid-Efficient-Paging-And-Sorting-With-SQL-CE-4.0
应该给你一些工作的想法。
关于javascript - HTML、WebMatrix、Razor 等新手处理 WebGrid，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9167377/
25
4
0
我正在尝试为 Webgrid 列设置宽度。但它不起作用。 请任何人帮助我。 请在我的代码下面找到 @grid.GetHtml( tableStyle: "webgrid-table", headerS
我在单个 View 上有 2 个 WebGrid，它们使用相同的模型。现在的问题是，每当我在单个 webgrid 上应用排序时，它也会对另一个 webgrid 进行排序。我正在使用 fieldName
我正在阅读和听到一些痛点，想知道我是否应该走那条路。更不用说，我似乎找不到任何权威文档(来自 Microsoft)。如果你说我不应该使用它，你会建议什么路线？我正在尝试建立一个新网站，但我想第一次就做
我试图显示一个进度条，直到我的网格完全加载，我看到了他们基于按钮点击的各种方法，但我无法想出一种方法来显示进度条，直到我的网格完全加载以及何时我导航到 webgrid 中的其他页面。这是我第一次使用
我正在 MVC3 中使用 WebGrid 进行一些部分页面更新，但是当我使用 $('#grid').html(data) 更新网格，然后单击网格中的列/链接以按该列排序时，我的页面重新加载时仅使用非
我正在开发 ASP.NET WebGrid，用于显示对象集合并允许向集合添加新对象。 在 Webgrid View 上，我有一个“添加”按钮，使用该按钮我可以根据模板动态添加新行并附加到网格。 我需要
我正在使用 MVC 3 webgrid，我需要在 webgrid 中添加一个新行以显示产品表中的价格总和。 任何想法都表示赞赏。 这是我的代码 @{ WebGrid grid = new WebGri
我正在尝试找到一种方法使整行都可点击。到目前为止，我发现的教程使用表格上可见的项目来为每行创建链接。例如 $(function(){ $('tbody tr').live('hover', f
我一直在开发一个 asp.net mvc 3 应用程序，我正在使用 webgrid 在我的 View 中显示表格数据。我的问题是，如何通过计算数据库中的记录数来分页一些数据，并在网格的页脚中显示 we
我已经设置了一个 webgrid，它似乎工作正常，允许我排序和分页。我添加了一个过滤器选项，该选项也很好用，但是如果我过滤并然后对结果进行排序，过滤器将丢失并显示所有记录。 这是我的 Razor Vi
我正在尝试使用 Razor 使 WebGrid View 正常工作，到目前为止，我已经设法设置了除页脚的分页图标之外的大部分样式。 我搜索了很多地方以了解如何修改页脚的当前选定页面(文本)但无济于事。
我突然遇到了一个非常烦人的问题，我不知道它是怎么来的。 我正在使用此代码在我的 View 中生成一个表: @{ var grid = new WebGrid( Model, rowsPerPa
我正在使用 WebGrid 来显示我的数据库中的数据表。该表有一列包含数量。我希望有人能告诉我为什么这个网格没有排序？ @{ WebGrid grid = new WebGrid(
我在部分页面中有我的 webgrid，如下所示。从下一页开始，我通过 ajax 调用在局部 View 中更新了我的网格。 @using (Html.BeginForm("Manage", "Book"
我有一个下拉列表和按钮控件，单击按钮时我绑定(bind)了 WebGrid，它工作正常，加载时网格将为空，但绑定(bind)后网格分页不起作用，下面是我的代码 @using (Html.BeginFo
基本上，这是我在 View 中的代码，我不想重复 WebGrid 实例。 我的模型 public class UsersWithDetailsModels { public IEnumerab
我正在使用新的 MVC3 WebGrid。到目前为止一切顺利，只是在样式/格式化列标题时遇到问题。我得到的最好的方法是将相同的 css 类从 WebGrid 的第一行应用到表标题。 var heade
是否有任何原因无法检查和取消选中复选框？如果我不触摸任何复选框，它会在按钮单击事件中选中和取消选中所有复选框。如果我手动选中某个框，则该框从此不会被修改，但其余部分将继续修改。 如何解决这个问题？ f
我遇到了与此相同的问题 question . 我创建了一个应该与 WebGrid 一起工作的过滤器。过滤器适用于第一页，但如果您尝试转到其他页面或对结果进行排序，则过滤器将丢失。我按照上一个问题中的建
我在我的 webgrid 上使用 JS 对其进行排序时遇到问题。所以这个想法是用户在文本框中输入字符串，然后在不刷新空洞页面的情况下刷新下面的 webgrid(根据匹配结果过滤)。现在我的代码可以很好
我是一名优秀的程序员,十分优秀！