61,112
社区成员
发帖
与我相关
我的任务
分享JS参数传递到Controller，查询值被清空，奇怪。。。
小弟最近刚开始搞MVC，遇到个问题，JS里面的参数如果写固定值的话是可以传递，但如果取textbox中的值，后台controller获得的参数就变为空了，看了下有没有写错参数名什么的，发现好像也没有，实在不知道如何解决了，请各位大神帮帮忙看下哪里出了问题，下面贴出代码和效果图。
1.Index.cshtml
上面主要是
这段代码里面的documentname和Des两个参数，如果我把这2个参数变为固定值，那是能够传递到Controller里面，如果是参数，例如上面的代码，点击查询传过去的就是空，我怀疑是哪里清空了参数，但我不知道在哪，请帮忙看看。
2. DocumentController.cs
1.Index.cshtml
<!DOCTYPE html>
<html>
<head>
@*<meta name="viewport" content="width=device-width" />
<title>BootStrap Table使用</title>*@
@*1、Jquery组件引用*@
<script src="~/Scripts/jquery-1.10.2.js"></script>
@*2、bootstrap组件引用*@
@*<script src="~/Scripts/bootstrap.js"></script>
<link href="~/Content/bootstrap.css" rel="stylesheet" />*@
@*3、bootstrap table组件以及中文包的引用*@
@*<script src="~/Scripts/bootstrap-table.js"></script>
<link href="~/Content/bootstrap-table.css" rel="stylesheet" />
<script src="~/Scripts/bootstrap-table-zh-CN.js"></script>*@
</head>
<body>
<div class="panel-body" style="padding-bottom:0px;">
<div class="panel panel-default">
<div class="panel-heading">查询条件</div>
<div class="panel-body">
<form id="formSearch" class="form-horizontal">
<div class="form-group" style="margin-top:15px">
<label class="control-label col-sm-1" for="txt_search_documentname">文档名称</label>
<div class="col-sm-3">
<input type="text" class="form-control" id="txt_search_documentname" name="txt_search_documentname">
</div>
<label class="control-label col-sm-1" for="txt_search_Des">描述</label>
<div class="col-sm-3">
<input type="text" class="form-control" id="txt_search_Des">
</div>
<div class="col-sm-4" style="text-align:left;">
<button type="submit" style="margin-left:50px" id="btn_query" class="btn btn-primary">查询</button>
</div>
</div>
</form>
</div>
</div>
<div id="toolbar" class="btn-group">
<button id="btn_add" type="button" class="btn btn-default">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>新增
</button>
<button id="btn_edit" type="button" class="btn btn-default">
<span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>修改
</button>
<button id="btn_delete" type="button" class="btn btn-default">
<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>删除
</button>
</div>
<table id="tb_documents"></table>
</div>
<script>
$(function () {
//1.初始化Table
var oTable = new TableInit();
oTable.Init();
//2.初始化Button的点击事件
var oButtonInit = new ButtonInit();
oButtonInit.Init();
});
var TableInit = function () {
var oTableInit = new Object();
//初始化Table
oTableInit.Init = function () {
$('#tb_documents').bootstrapTable({
url: '/Document/GetDocument', //请求后台的URL（*）
method: 'get', //请求方式（*）
//method: 'post',
//contentType: "application/X-www-form-urlencoded",
toolbar: '#toolbar', //工具按钮用哪个容器
striped: true, //是否显示行间隔色
cache: false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
pagination: true, //是否显示分页（*）
sortable: false, //是否启用排序
sortOrder: "asc", //排序方式
queryParams: oTableInit.queryParams,//传递参数（*）
sidePagination: "server", //分页方式：client客户端分页，server服务端分页（*）
pageNumber: 1, //初始化加载第一页，默认第一页
pageSize: 10, //每页的记录行数（*）
pageList: [10, 25, 50, 100], //可供选择的每页的行数（*）
search: true, //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
strictSearch: true,
showColumns: true, //是否显示所有的列
showRefresh: true, //是否显示刷新按钮
minimumCountColumns: 2, //最少允许的列数
clickToSelect: true, //是否启用点击选中行
height: 500, //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
uniqueId: "ID", //每一行的唯一标识，一般为主键列
showToggle: true, //是否显示详细视图和列表视图的切换按钮
cardView: false, //是否显示详细视图
detailView: false, //是否显示父子表
columns: [{
checkbox: true
}, {
field: 'Name',
title: '文档名称'
}, {
field: 'Description',
title: '描述'
},]
});
};
//得到查询的参数
oTableInit.queryParams = function (params) {
var documentName = $("#txt_search_documentname").val();
var txtSearchDes = $("#txt_search_Des").val();
var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
limit: params.limit, //页面大小
offset: params.offset, //页码
documentname: documentName,
Des: txtSearchDes,
};
return temp;
};
return oTableInit;
};
//var ButtonInit = function () {
// var oInit = new Object();
// var postdata = {};
// oInit.Init = function () {
// //初始化页面上面的按钮事件
// };
// return oInit;
//};
</script>
</body>
</html>
上面主要是
//得到查询的参数
oTableInit.queryParams = function (params) {
var documentName = $("#txt_search_documentname").val();
var txtSearchDes = $("#txt_search_Des").val();
var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
limit: params.limit, //页面大小
offset: params.offset, //页码
documentname: documentName,
Des: txtSearchDes,
};
return temp;
};
这段代码里面的documentname和Des两个参数，如果我把这2个参数变为固定值，那是能够传递到Controller里面，如果是参数，例如上面的代码，点击查询传过去的就是空，我怀疑是哪里清空了参数，但我不知道在哪，请帮忙看看。
2. DocumentController.cs
using MVC研究项目6.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace MVC研究项目6.Controllers
{
public class DocumentController : Controller
{
private IPS_WZGDEntities db = new IPS_WZGDEntities();
// GET: Document
public ActionResult Index()
{
return View();
}
public JsonResult GetDocument(int limit, int offset, string documentname, string Des)
{
var dc = from d in db.Documents
select d;
if (!string.IsNullOrEmpty(documentname))
{
dc = dc.Where(d => d.Name.Contains(documentname));
}
if (!string.IsNullOrEmpty(Des))
{
dc = dc.Where(d => d.Description.Contains(Des));
}
var total = dc.ToList().Count;
var rows = dc.ToList().Skip(offset).Take(limit).ToList();
return Json(new { total = total, rows = rows }, JsonRequestBehavior.AllowGet);
}
}
}
...全文
请发表友善的回复…
发表回复
