上下文:我正在使用WebMatrix和C#Razor构建Web应用程序。应用程序搜索数据库并将结果返回给WebGrid。返回结果后,您可以单击“详细信息”链接并在新的浏览器选项卡上查看详细信息。
问题:返回所有记录的初始搜索工作正常。如果我输入搜索词,则会返回正确的结果,但是当我单击“详细信息”时,我会获得初始搜索中所选行中记录的详细信息。
示例:初始搜索返回记录1-5。后续搜索返回记录31,65,86,92,101。如果我单击记录65的详细信息,我将获得记录2的详细信息,因为记录2在初始搜索中占用了第2行。
代码:
@{
Layout = "~/_SiteLayout.cshtml";
Page.Title = "Home Page";
}
@{
var db = Database.Open("xyz");
var query = "select bg_bug_id [BUGID], BG_SUMMARY SUMMARY from [dbo].[BUG] where BG_SUMMARY like @0 and BG_SUMMARY like @1";
var input1 = "%" + Request["input1"] + "%";
var input2 = "%" + Request["input2"] + "%";
var data = db.Query(query, input1, input2);
var gridBug = new WebGrid(source: data, canPage: true, canSort: true, rowsPerPage: 10);
if(gridBug.HasSelection){
var recordIdInt = 0;
recordIdInt = gridBug.SelectedRow.Value.BUGID;
var recordId = recordIdInt.ToString();
var bugDescQuery = "select [BG_DESCRIPTION] from [dbo].[BUG] where [BG_BUG_ID] =" + recordId; // or [BG_BUG_ID] = 25001";
var bugDescResult = db.Query(bugDescQuery);
foreach(var item in bugDescResult){
var desc = item.BG_DESCRIPTION;
var modDesc = desc.Replace("<div align=\"left\">", "<div>").Replace("<font face=\"Arial\">", "<font>").Replace("<span style=\"font-size:8pt\">", "<span>");
<script>
$(document).ready(function(){
var x = '@Html.Raw(HttpUtility.JavaScriptStringEncode(modDesc))';
var win = window.open();
win.document.body.innerHTML = "Record ID: " + @recordId + " - -" + x;
})
</script>
}
}
}
<form method="post">
<input type="text" name="input1"/>
<input type="radio" id="and" name="operator" value="and" checked>And
<input type="radio" id="or" name="operator" value="or">Or
<input type="text" name="input2" />
<select>
<option value="Unresolved">Unresolved</option>
<option value="Resolved">Resolved</option>
</select>
<input type="submit" value="Search" />
@gridBug.GetHtml(
tableStyle: "grid",
headerStyle: "head",
alternatingRowStyle: "alt",
columns: gridBug.Columns(
gridBug.Column(header:"", format:@<text>@item.GetSelectLink("Details")</text>, style: "product2"),
gridBug.Column("BUGID", "BUGID", style: "product2"),
gridBug.Column("SUMMARY", "SUMMARY", style: "product")))
</form>
@section script{
<script type="text/javascript">
$(function(){
$('th a, tfoot a').live('click', function() {
$('form').attr('action', $(this).attr('href')).submit();
return false;
});
});
</script>
}
<style type="text/css">
.grid {
margin: 4px;
border-collapse: collapse;
width: 950px;
margin-left: 5px
}
.head {
background-color: #0094ff;
font-weight: bold;
color: #fff;
}
.grid th, .grid td {
border: 1px solid #c0c0c0;
padding: 5px;
}
.alt {
background-color: #e8e8e8;
color: #000;
}
.product {
width: 200px;
font-weight: normal;
}
.product2 {
width: 10px;
font-weight: normal;
}
</style>
第二次搜索后的消息:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Home Page</title>
<link href="/Content/themes/base/jquery.ui.all.css" rel="stylesheet" type="text/css" />
<link href="/Content/Site.css" rel="stylesheet" type="text/css" />
<link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<script src="/Scripts/jquery-1.8.2.min.js"></script>
<script src="/Scripts/jquery-ui-1.8.24.js"></script>
<script src="/Scripts/modernizr-2.6.2.js"></script>
<meta name="viewport" content="width=device-width" />
<script type="text/javascript">
$(function(){
$('th a, tfoot a').live('click', function() {
$('form').attr('action', $(this).attr('href')).submit();
return false;
});
});
</script>
</head>
<body>
<header>
<div class="content-wrapper">
<div class="float-left">
<p class="site-title"><a href="/">XXXX</a></p>
</div>
<div class="float-right">
<section id="login">
<ul>
<li><a href="/Account/Register">Register</a></li>
<li><a href="/Account/Login">Log in</a></li>
</ul>
</section>
<nav>
<ul id="menu">
<li><a href="/">XXXX</a></li>
<li><a href="/About">XXXX</a></li>
<li><a href="/Contact">XXXX</a></li>
</ul>
</nav>
</div>
</div>
</header>
<div id="body">
<section class="content-wrapper main-content clear-fix">
<form method="post">
<input type="text" name="input1"/>
<input type="radio" id="and" name="operator" value="and" checked>And
<input type="radio" id="or" name="operator" value="or">Or
<input type="text" name="input2" />
<select>
<option value="Unresolved">Unresolved</option>
<option value="Resolved">Resolved</option>
</select>
<input type="submit" value="Search" />
<table class="grid">
<thead>
<tr class="head">
<th scope="col">
</th>
<th scope="col">
<a href="/?sort=BUGID&sortdir=ASC">BUGID</a> </th>
<th scope="col">
<a href="/?sort=SUMMARY&sortdir=ASC">SUMMARY</a> </th>
</tr>
</thead>
<tfoot>
<tr >
<td colspan="3">1 <a href="/?page=2">2</a> <a href="/?page=3">3</a> <a href="/?page=2">></a> </td>
</tr>
</tfoot>
<tbody>
<tr>
<td class="product2"><a href="/?row=1">Details</a></td>
<td class="product2">1655</td>
<td class="product">summary text for record 1655</td>
</tr>
<tr class="alt">
<td class="product2"><a href="/?row=2">Details</a></td>
<td class="product2">2516</td>
<td class="product">summary text for record 2516</td>
</tr>
<tr>
<td class="product2"><a href="/?row=3">Details</a></td>
<td class="product2">2639</td>
<td class="product">summary text for record 2639</td>
</tr>
<tr class="alt">
<td class="product2"><a href="/?row=4">Details</a></td>
<td class="product2">2643</td>
<td class="product">summary text for record 2643</td>
</tr>
<tr>
<td class="product2"><a href="/?row=5">Details</a></td>
<td class="product2">3493</td>
<td class="product">summary text for record 3493</td>
</tr>
<tr class="alt">
<td class="product2"><a href="/?row=6">Details</a></td>
<td class="product2">3746</td>
<td class="product">summary text for record 3746</td>
</tr>
<tr>
<td class="product2"><a href="/?row=7">Details</a></td>
<td class="product2">3864</td>
<td class="product">summary text for record 3864</td>
</tr>
<tr class="alt">
<td class="product2"><a href="/?row=8">Details</a></td>
<td class="product2">5172</td>
<td class="product">summary text for record 5172</td>
</tr>
<tr>
<td class="product2"><a href="/?row=9">Details</a></td>
<td class="product2">7156</td>
<td class="product">summary text for record 7156</td>
</tr>
<tr class="alt">
<td class="product2"><a href="/?row=10">Details</a></td>
<td class="product2">7532</td>
<td class="product">summary text for record 7532</td>
</tr>
</tbody>
</table>
</form>
<style type="text/css">
.grid {
margin: 4px;
border-collapse: collapse;
width: 950px;
margin-left: 5px
}
.head {
background-color: #0094ff;
font-weight: bold;
color: #fff;
}
.grid th, .grid td {
border: 1px solid #c0c0c0;
padding: 5px;
}
.alt {
background-color: #e8e8e8;
color: #000;
}
.product {
width: 200px;
font-weight: normal;
}
.product2 {
width: 10px;
font-weight: normal;
}
</style>
</section>
</div>
<footer>
<div class="content-wrapper">
<div class="float-left">
<p>© 2015 - XXXX</p>
</div>
</div>
</footer>
</body>
</html>