我想从视图中传递一些 selectedValue : jqgrid 到控制器,我可以用发布数据来做到这一点吗?请帮助我,我有 3 个级联下拉列表,我想用那些 selectedValue 过滤我的网格如何传递参数?
@model Project.Models.FRHEntities
@{
ViewBag.Title = "";
}
@section featured {
<section class="featured">
<div class="content-wrapper">
<hgroup class="title">
<h1>@ViewBag.Title</h1>
<h2>@ViewBag.Message</h2>
</hgroup>
</div>
</section>
}
@Styles.Render("~/Content/jquery.jqGrid/ui.jqgrid.css")
@Styles.Render("~/Content/blitzer/jquery-ui-1.10.3.custom.css")
<script src="@Url.Content("~/Scripts/jquery-2.0.3.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.jqGrid.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/i18n/grid.locale-fr.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Content/js/ui/minified/jquery.ui.autocomplete.min.js")" type="text/javascript" ></script>
<script src="@Url.Content("~/Content/js/ui/minified/jquery.ui.datepicker.min.js")" type="text/javascript" ></script>
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/jqueryui")
@Styles.Render("~/Content/themes/base/css")
<script type="text/javascript">
$(document).ready(function () {
$("#Dob").datepicker({
changeMonth: true,
changeYear: true
});
});
</script>
<script type="text/javascript">
$(document).ready(function () {
$("#Dob2").datepicker({
changeMonth: true,
changeYear: true
});
});
</script>
}
<h2>@ViewBag.Message</h2>
<table style="width: 100%;" >
<tr aria-atomic="False">
<td>date début :</td>
<td><input id="Dob" type="text" /></td>
</tr>
<tr>
<td>date fin :</td>
<td><input id="Dob2" type="text" /></td>
</tr>
<tr>
<td>Activité : </td>
<td>@Html.DropDownList("Activites", (SelectList)ViewBag.SelectList, "selectionnez --", new { id = "Activites" }) </td>
</tr>
<tr>
<td>Service :</td>
<td><select id="Services" name="services" ><option>Selectionnez --</option></select></td>
</tr>
<tr>
<td>Client :</td>
<td><select id="Clients" name="clients"><option>Selectionnez -- </option></select></td>
</tr>
<tr>
<td><input class ="button" id="ButtonSubmit" type="button" value="Visualiser" onclick="javascript: afficher_cacher('rapport')" /></td>
<td><input class="button" id="Exporter" type="button" value="Exporter" /></td>
</tr>
</table>
<table id="activitelist"></table>
<div id="activitelist_pager"></div>
<script type="text/javascript">
<!--
$(document).ready(function () {
$('#Activites').change(function () { ChangeActivite(); });
$('#Services').change(function () { ChangeService(); });
$('#Clients').change(function () { ChangeClient(); });
$('#activitelist').hide();
$('#ButtonSubmit').hide().click(function () { show(); });
});
function ChangeClient() {
var selectedValue = $('#Activites option:selected').val();
var selectedValue2 = $('#Services option:selected').val();
var selectedValue3 = $('#Clients option:selected').val();
if ($.trim(selectedValue).length > 0) {
$('#ButtonSubmit').show();
}
else {
$('#ButtonSubmit').hide();
$('#ClientInfo').empty();
}
}
function ChangeActivite() {
var selectedValue = $('#Activites option:selected').val();
if ($.trim(selectedValue).length > 0) {
// GetClients(selectedValue);
GetServices(selectedValue);
}
}
function ChangeService() {
var selectedValue = $('#Activites option:selected').val();
if ($.trim(selectedValue).length > 0)
var selectedValue2 = $('#Services option:selected').val();
if ($.trim(selectedValue).length > 0) {
// GetClients(selectedValue);
GetClients(selectedValue,selectedValue2);
}
}
function GetServices(activiteID) {
$.ajax({
url: '@Url.Action("Services", "Display")',
data: { activiteID: activiteID },
type: 'post',
cache: false,
async: false,
dataType: 'json',
success: function (data) {
if (data.length > 0) {
$('#Services').empty();
$('#Services').append($('<option></option>').val('').text('Selectionnez--'));
$.each(data, function (i, item) {
$('#Services').append($('<option></option>').val(item.Key).text(item.Value));
});
}
}
});
}
function GetClients(activiteID,service) {
$.ajax({
url: '@Url.Action("Clients", "Display")',
data: { activiteID: activiteID , service : service},
type: 'post',
cache: false,
async: false,
dataType: 'json',
success: function (data) {
if (data.length > 0) {
$('#Clients').empty();
$('#Clients').append($('<option></option>').val('').text('Selectionnez--'));
$.each(data, function (i, item) {
$('#Clients').append($('<option></option>').val(item.Key).text(item.Value));
});
}
}
});
}
function show() {
$("#activitelist").jqGrid({
url: '@Url.Action("LinqGridData", "Display")',
postData: { activite : "1-COURRIER ENTRANT" },
datatype: 'json',
mtype: 'POST',
colNames: ["Activité", "Service", "Client", "volume", "delta", "temps moyen", "temps total"],
colModel:
[
{ name: "Activité", index: "Activité" },
{ name: "Service", index: "Service" },
{ name: "Client", index: "Client" },
{ name: "vol", index: "vol" },
{ name: "delta_", index: "delta_" },
{ name: "tempsmoy_", index: "tempsmoy_" },
{ name: "tempstot", index: "tempstot" },
],
pager: $('#activitelist_pager'),
rowNum: 25,
rowList: [5, 10, 25, 50],
height: 'auto',
width: '800',
sortname: 'Activite',
sortorder: "ASC"
});
$("#activitelist").jqGrid('navGrid', '#activitelist_pager', { add: false, edit: false, del: false, search: false });
}
</script>
这是行动方法:
public ActionResult LinqGridData(string activite , string sidx, string sord, int page, int rows) {
var context = new FRHEntities();
int pageIndex = Convert.ToInt32(page) - 1;
int pageSize = rows;
int totalRecords = context.productivites.Count();
int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize);
var jsonData = new
{
total = totalPages,
page = page,
records = totalRecords,
rows = frh.productivites.AsEnumerable().Where(n => n.Activité == activite).Select(n => new { id = n.activitéID, cell = new string[] { n.Activité, n.Service.ToString(), n.action, n.vol.ToString(), n.delta_.ToString(), n.tempsmoy_.ToString(), n.tempstot_.ToString() } }).ToArray()
};
return Json(jsonData, JsonRequestBehavior.AllowGet);
}