如何在widget中更改此代码 [英] how change this code in widget
本文介绍了如何在widget中更改此代码的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
你好
i正在使用ac＃asp mvc中的小部件库。（服务器端）
i页面中有一个网格，其中有几列如下所示
i我的代码有问题。
这是我的表：
var source = t
{
datatype： json，
数据字段：[
{name：' EmployeeID'}，
{name：' FirstName'}，
{name：' LastName'}，
{name：' < span class =code-string> Title'}，
{name：' Address }，
{name：' City'}，
{name ：' Country'}
]，
1 - 当我更新网格中的单元格时，它不会同时更新，确实它不会刷新
。
2 - 我希望将我的城市列作为下拉列表类型。
当我点击该列时，它将被包含在我的所有城市中。
但如果我在列表中选择一个城市 - 下次没有在列表中显示。
如何解决它。
我应该如何修改我的代码？请帮助我 。非常感谢
这是我的代码：
@ {
ViewBag.Title = 雇员;
}
@section scripts {
< script type = text / javascript src = ../../ scripts / Widget / jquery-1.11.1.min.js > < / script >
< script type = text / javascript src = ../../ Scripts / Widget / jqx-all.js > < / script >
< link rel = stylesheet type = text / css < span class =code-attribute> href = ../../ Content / Widget / jqx.base.css / > ;
< script type = text / javascript >
$（ document ）。ready（ function （）{
// 准备数据
var data = {};
var theme = ' classic';
var editedRows = new 数组（）;
var source =
{
datatype： json，
datafields：[
{name：' EmployeeID'}，
{name：' FirstName'}，
{name：' LastName'}，
{ name：' Title'}，
{name：' 地址'}，
{名称：' City'}，
{name：' Count ry'}
]，
id：' EmployeeID' ，
url：' / Customer / GetEmployees'，
updaterow： function （rowid，rowdata，commit）{
// 与服务器同步 - 发送更新命令
var data =
update = true& FirstName = + rowdata.FirstName +
< span class =code-string> & LastName = + rowdata.LastName +
& Title = + ro wdata.Title + & Address = + rowdata.Address;
data = data +
& City = + rowdata.City + & Country = +
rowdata.Country;
data = data + & EmployeeID = + rowdata.EmployeeID;
$ .ajax（{
dataType：' json'，
url：' / Customer / UpdateEmployees'，
data：data，
成功：功能（数据，状态，xhr）{
// < span class =code-comment>执行更新命令。
commit（ true ）;
}，
错误： function （jqXHR，textStatus，errorThrown）{
// 更新失败。
commit（ false ）;
}
}）;
}
};
var dataAdapter = new $ .jqx.dataAdapter（source）;
var cellclass = function （row，datafield，value，rowdata）{
// fruits.push（Lemon）;
for （ var i = 0 ; i< editedRows.length; i ++）{
if （editedRows [i] .index == row）{
< span class =code-keyword> return editedRow;
}
}
}
// 初始化jqxGrid
$（ #jqxgrid）。jqxGrid（
{
宽度： 1000 ，
height： 350 ，
selectionmode：' singlecell'，
source：dataAdapter，
主题：主题，
可编辑： true ，
列：[
{
text：' EmployeeID'，
可编辑： false ，
datafield：' EmployeeID'，
width： 100
}，
{
text：' 名字' ，
datafield：' FirstName'，
width：< span class =code-digit> 100 ，
可编辑： false
}，
{
text：' 姓氏'，
columntype：' dropdownlist'，
cellclassname：cellclass，
datafield：' LastName'，
width： 100
}，
{text：' Title'，datafield：' 标题'，宽度： 180 ，}，
{text：' Address'，datafield：' 地址'，宽度： 180 }，
{
text：' City'，
datafield：' 城市'，
columntype：' dropdownlist'，
cellclassname：cellclass，
width： 100 ，
}，
{text：' Country'，datafield： ' Country'，width： 140 }
]
}）;
}）;
< / script >
}
< h2 > 员工< / h2 >
< div id = jqxgrid > < < span class =code-leadattribute> / div >
这是我的服务器端代码，用于更新：
< pre lang = cs > public bool UpdateEmployees（员工雇员）
{
if（ModelState.IsValid）
{
// var nn = new Customer（）;
// var chkInOut =（来自db2.Customers中的rec
//其中rec.CustomerID == customer.CustomerID
// select rec）.SingleOrDefault（）;
db2.Entry（employee）.State = EntityState.Modified;
db2.SaveChanges（）;
// db22.SubmitChanges（）;
RedirectToAction（GetEmployees，Customer）;
返回true;
}
返回false;
}
这是我的桌子清单方法。
public ActionResult GetEmployees（）
{
var dbResult = db2.Employees.ToList（）;
var employees = 来自 e dbResult
选择 new
{
e.EmployeeID，
e.FirstName，
e.LastName，
e.Title，
e.Address，
e.City，
e.Country
};
return Json（employees，JsonRequestBehavior.AllowGet）;
// return View（）;
返回 Json（employees，JsonRequestBehavior.AllowGet）;
}
解决方案
（ document ）。ready（< span class =code-keyword> function （）{
// 准备数据
var data = {};
var theme = < span class =code-string>' classic';
var editedRows = new 数组（）;
var source =
{
datatype： json，
datafields：[
{name：' EmployeeID'}，
{name：' FirstName'}，
{name：' LastName'}，
{name：' Title'}，
{name：' Address' }，
{name：' City'}，
{name：' Country'}
]，
id：' EmployeeID'，
url：' / Customer / GetEmployees'，
updaterow： function （rowid，rowdata，commit）{
// 与服务器同步 - 发送更新命令
var data =
update = true& FirstName = + rowdata.FirstName +
& LastName = + rowdata.LastName +
& Title = + rowdata.Title + & Address = + rowdata.Address;
data = data +
& City = + rowdata.City + & Country = +
rowdata.Country;
data = data + & EmployeeID = + rowdata.EmployeeID;
.ajax（{
dataType：' json'，
url：' / Customer / UpdateEmployees'，
data：data，
成功： function （data，status，xhr）{
// 执行更新命令。
commit（ true ）;
}，
错误： function （jqXHR，textStatus，errorThrown）{
// 更新失败。
commit（ false ）;
}
}）;
}
};
var dataAdapter = new
.jqx。 DataAdapter的（源）;
var cellclass = function （row，datafield，value，rowdata）{
// fruits.push（Lemon）;
for （ var i = 0 ; i< editedRows.length; i ++）{
if （editedRows [i] .index == row）{
< span class =code-keyword> return editedRow;
}
}
}
// 初始化jqxGrid
hello
i am working with widget library in a c# asp mvc.(server side)
i have a grid in page that have several columns like below
i have problems with my code.
this is my table :
var source =t
{
datatype: "json",
datafields: [
{ name: 'EmployeeID' },
{ name: 'FirstName' },
{ name: 'LastName' },
{ name: 'Title' },
{ name: 'Address' },
{ name: 'City' },
{ name: 'Country' }
],
1 - when i update a cell in grid it is not updated at the same time and indeed it
is not refreshed.
2-i want to have my city column as a dropdownlist type.
when i click on that column it be included all my cities.
but if i select a city in list -it is not shown in list in next time.
how can i solve it.
how should i modify my code? pls help me . thankyou so much
this is my code:
@{
ViewBag.Title = "Employee";
}
@section scripts {
<script type="text/javascript" src="../../scripts/Widget/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="../../Scripts/Widget/jqx-all.js"></script>
<link rel="stylesheet" type="text/css" href="../../Content/Widget/jqx.base.css" />
<script type="text/javascript">
$(document).ready(function() {
// prepare the data
var data = {};
var theme = 'classic';
var editedRows = new Array();
var source =
{
datatype: "json",
datafields: [
{ name: 'EmployeeID' },
{ name: 'FirstName' },
{ name: 'LastName' },
{ name: 'Title' },
{ name: 'Address' },
{ name: 'City' },
{ name: 'Country' }
],
id: 'EmployeeID',
url: '/Customer/GetEmployees',
updaterow: function(rowid, rowdata, commit) {
// synchronize with the server - send update command
var data =
"update=true&FirstName=" + rowdata.FirstName +
"&LastName=" + rowdata.LastName +
"&Title=" + rowdata.Title + "&Address=" + rowdata.Address;
data = data +
"&City=" + rowdata.City + "&Country=" +
rowdata.Country;
data = data + "&EmployeeID=" + rowdata.EmployeeID;
$.ajax({
dataType: 'json',
url: '/Customer/UpdateEmployees',
data: data,
success: function(data, status, xhr) {
// update command is executed.
commit(true);
},
error: function(jqXHR, textStatus, errorThrown) {
// update failed.
commit(false);
}
});
}
};
var dataAdapter = new $.jqx.dataAdapter(source);
var cellclass = function(row, datafield, value, rowdata) {
// fruits.push("Lemon");
for (var i = 0; i < editedRows.length; i++) {
if (editedRows[i].index == row) {
return "editedRow";
}
}
}
// initialize jqxGrid
$("#jqxgrid").jqxGrid(
{
width: 1000,
height: 350,
selectionmode: 'singlecell',
source: dataAdapter,
theme: theme,
editable: true,
columns: [
{
text: 'EmployeeID',
editable: false,
datafield: 'EmployeeID',
width: 100
},
{
text: 'First Name',
datafield: 'FirstName',
width: 100,
editable: false
},
{
text: 'Last Name',
columntype: 'dropdownlist',
cellclassname: cellclass,
datafield: 'LastName',
width: 100
},
{ text: 'Title', datafield: 'Title', width: 180, },
{ text: 'Address', datafield: 'Address', width: 180 },
{
text: 'City',
datafield: 'City',
columntype: 'dropdownlist',
cellclassname: cellclass,
width: 100,
},
{ text: 'Country', datafield: 'Country', width: 140 }
]
});
});
</script>
}
<h2>Employee</h2>
<div id="jqxgrid"></div>
and this is my server side code for updating :
<pre lang="cs">public bool UpdateEmployees(Employee employee)
{
if (ModelState.IsValid)
{
// var nn = new Customer();
//var chkInOut = (from rec in db2.Customers
// where rec.CustomerID == customer.CustomerID
// select rec).SingleOrDefault();
db2.Entry(employee).State = EntityState.Modified;
db2.SaveChanges();
// db22.SubmitChanges();
RedirectToAction("GetEmployees","Customer");
return true;
}
return false;
}
this is my method for list of table.
public ActionResult GetEmployees()
{
var dbResult = db2.Employees.ToList();
var employees = from e in dbResult
select new
{
e.EmployeeID,
e.FirstName,
e.LastName,
e.Title,
e.Address,
e.City,
e.Country
};
return Json(employees, JsonRequestBehavior.AllowGet);
// return View();
return Json(employees, JsonRequestBehavior.AllowGet);
} 解决方案
(document).ready(function() { // prepare the data var data = {}; var theme = 'classic'; var editedRows = new Array(); var source = { datatype: "json", datafields: [ { name: 'EmployeeID' }, { name: 'FirstName' }, { name: 'LastName' }, { name: 'Title' }, { name: 'Address' }, { name: 'City' }, { name: 'Country' } ], id: 'EmployeeID', url: '/Customer/GetEmployees', updaterow: function(rowid, rowdata, commit) { // synchronize with the server - send update command var data = "update=true&FirstName=" + rowdata.FirstName + "&LastName=" + rowdata.LastName + "&Title=" + rowdata.Title + "&Address=" + rowdata.Address; data = data + "&City=" + rowdata.City + "&Country=" + rowdata.Country; data = data + "&EmployeeID=" + rowdata.EmployeeID;
.ajax({ dataType: 'json', url: '/Customer/UpdateEmployees', data: data, success: function(data, status, xhr) { // update command is executed. commit(true); }, error: function(jqXHR, textStatus, errorThrown) { // update failed. commit(false); } }); } }; var dataAdapter = new
.jqx.dataAdapter(source); var cellclass = function(row, datafield, value, rowdata) { // fruits.push("Lemon"); for (var i = 0; i < editedRows.length; i++) { if (editedRows[i].index == row) { return "editedRow"; } } } // initialize jqxGrid
这篇关于如何在widget中更改此代码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
