Hi,
We are using the Jquery grid at our project but we're having some problems with it.The project is an ASP.NET MVC3 in Visual Basic.
The setup for the view is like this :
@Modeltype PrijsPerProfielViewModel@Code Layout = "~/Views/Shared/_Master.vbhtml"End Code
<script type="text/javascript"> function saveChanges2() { $("#grid3").igGrid("saveChanges"); return false; }
$('#grid3').live('iggridupdatingrowadded', function () { $("#grid3").igGrid("saveChanges") });
$('#grid3').live('iggridupdatingeditrowended', function (event, ui) { if (ui.rowAdding == false) { $("#grid3").igGrid("saveChanges"); } });
$('#grid3').live('iggridupdatingrowdeleted', function () { $("#grid3").igGrid("saveChanges") });</script>
<div class="DynamicForm"> <h2> Prijs per profiel</h2> @(Html.Infragistics().Grid(Model.TableData).ID("grid3").UpdateUrl("UpdateData").PrimaryKey("ID") .AutoGenerateColumns(True) _ .Columns(Sub(column) column.For(Function(x) x.Functie).HeaderText("Functie") End Sub) _ .Features(Sub(features) features.Paging().VisiblePageCount(5).ShowPageSizeDropDown(False).PageSize(10).PrevPageLabelText("Previous").NextgeLabelText("Next")
features.Selection().MouseDragSelect(True).MultipleSelection(True).Mode(SelectionMode.Row) features.Selection().MouseDragSelect(True).MultipleSelection(True).Mode(SelectionMode.Cell) features.Updating().EnableDeleteRow(False).EnableAddRow(False).EditMode(GridEditMode.Cell) End Sub) _
.DataSourceUrl(Url.Action("GetData/" & Model.MainProposalData.ProposalID.ToString())) _
.Width("100%") _
.Height("350px") _
.DataBind() _
.Render()
)
@<input type="button" onclick="saveChanges2(); return false;">Save Changes </input>
Here is the code for the viewmodel :
Public Class PrijsPerProfielViewModel
Public Property TableData() As IQueryable(Of ProposalVolumeEnPrijsPerProfielItem)
'bla bla more stuff that doesn't matter
End Class
ProposalVolumeEnPrijsPerProfielItem is a class wich contains a field called ID as shown here :
Public Class ProposalVolumeEnPrijsPerProfielItem Implements IHasNullableId
<DataMember()>
Public Property ID As Guid? Implements IHasNullableId.Id
End class
Ok so the problem is that we can't edit any record, we have disabled adding and deleting of records. When the page renders the data is displayed correct but when we click a cell to edit it gives me this error in the developer tools from Chrome :
The error looks self explaining,adding a PK but that is taken care of as you can see in the view. Besides the error nothing happens, my actions in the controller aren't executed or anything.
The things i've tried are :
- checking script references (compared them to samples from Infragistics blogs)- Checking that there is no empty data passed from controller to view- Compared my code to example code from the site- Abused google :p- Searched the forum here
So im kinda out of idea's here, hope someone here can help :).
If you need more info just ask.
PS sorry for the poor formatting!
Fabrizio
Hi Fabrizio,
I tried to experiment with grid using your codes related to configuration of columns, features, etc. But could not reproduce that issue. The exception related to primaryKey is raised when igGridUpdating is not able to find a marker/attribute in TR which contains identifier for row.
If it is possible to write a simple sample, which can be used to reproduce that issue, then please zip it and attach within Options tab.
I am having the same problem and described above.
I followed the example in the Infragistics samples:
C:\Users\Public\Documents\Infragistics\NetAdvantage 2011.2\jQuery\Samples\Samples\Grid\EditingAndSelection\BatchingUpdate\MVC
There are problems with the samples. They are not MVC 3 compliant.
For example, the View base class needs to be WebViewPage, but the examples use an inheritance using ViewPage. It makes a big difference. WebViewPage has and expects Execute() but ViewPage does not. It has to do with the MVC 3 Controller. When I change my View base class to ViewPage the Execute(0 method is missing. When I use WebViewPage then other code in the example is wrong, such as @this.GetGlobalResourceObject because ViewPage goes all the way down to TemplateControl but WebViewPage does not. I figured out that I can switch this for @Resources, basically referencing the internal Resources generated class.
After all this, the execution is failing beacuse there is no HttpContext.Request.Form["ig_transactions"] value. I cannot see where this is established (declared). There is probably another coding difference between the sample and MVC 3. If/when I figure it out I will post here again.
In the mean time, please consider updating the sample for MVC 3.
Thanks, Joe
Solved my problem. It was my own mistake.
I set up Resources for column header text values and I used the Resource value also for the PrimaryKey. But the Resource value was abbreviated and hence was also not the name of an actual column in the data. My bad.
In case this helps, here is some code that used that is MVC 3 compliant.
View:
@inherits System.Web.Mvc.WebViewPage<IQueryable<Company.PositionManagement.Web.ViewModels.OutOfBalanceStatusViewModel>>@using Infragistics.Web.Mvc@using System.Web.UI
@Html.Infragistics().Grid(Model).ID("UpdateGrid").Height("300px").PrimaryKey("OutOfBalanceStatusId").UpdateUrl(Url.Action("EditingSaveOutOfBalanceStatusChanges")).Columns(column => { column.For(x => x.OutOfBalanceStatusId).HeaderText(Resources.AdminResources.OutOfBalanceStatusId).Width("150px"); column.For(x => x.Name).HeaderText(Resources.AdminResources.OutOfBalanceStatusName).Width("200px"); column.For(x => x.Description).HeaderText(Resources.AdminResources.OutOfBalanceStatusDescription).Width("250px"); column.For(x => x.DateTime).HeaderText(Resources.AdminResources.OutOfBalanceStatusDateTime).Width("60px"); }).Features(features => { features.Sorting(); features.Updating().ColumnSettings(settings => { settings.ColumnSetting().ColumnKey(Resources.AdminResources.OutOfBalanceStatusId).ReadOnly(true); settings.ColumnSetting().ColumnKey(Resources.AdminResources.OutOfBalanceStatusName).EditorType(ColumnEditorType.Text); settings.ColumnSetting().ColumnKey(Resources.AdminResources.OutOfBalanceStatusDescription).EditorType(ColumnEditorType.Text); settings.ColumnSetting().ColumnKey(Resources.AdminResources.OutOfBalanceStatusDateTime).EditorType(ColumnEditorType.DatePicker).EditorOptions("minValue: new Date(2012, 1, 1), maxValue: new Date(), required: true"); }); }).Virtualization(false).GenerateCompactJSONResponse(false).DataSourceUrl(Url.Action("GetOutOfBalanceStatusData")).DataBind().Render()
Controller:
#region OutOfBalanceStatusChaining
[ActionName("OutOfBalanceStatus")] public ActionResult OutOfBalanceStatus() { return View("OutOfBalanceStatus"); }
[GridDataSourceAction] [ActionName("GetOutOfBalanceStatusData")] public ActionResult GetOutOfBalanceStatusData() { List<OutOfBalanceStatusDTO> outOfBalanceStatusDTOViewList = outOfBalanceStatusComponent.GetOutOfBalanceStatusQuery().ToList(); return View("OutOfBalanceStatus", outOfBalanceStatusDTOViewList.Select(m => new OutOfBalanceStatusViewModel() { OutOfBalanceStatusId = m.OutOfBalanceStatusId, Name = m.Name, Description = m.Description, DateTime = m.DateTime, }).AsQueryable()); }
[ActionName("EditingSaveOutOfBalanceStatusChanges")] public ActionResult EditingSaveOutOfBalanceStatusChanges() { ViewData["GenerateCompactJSONResponse"] = false; GridModel m = new GridModel(); List<Transaction<OutOfBalanceStatusViewModel>> transactions = m.LoadTransactions<OutOfBalanceStatusViewModel>(HttpContext.Request.Form["ig_transactions"]);
foreach (Transaction<OutOfBalanceStatusViewModel> t in transactions) { if (t.type == "newrow") { OutOfBalanceStatusViewModel outOfBalanceStatusViewModel = t.row; OutOfBalanceStatusDTO outOfBalanceStatusDTO = outOfBalanceStatusViewModel.MapToDTO(); outOfBalanceStatusComponent.CreateOutOfBalanceStatus(outOfBalanceStatusDTO, 1); } else if (t.type == "deleterow") { OutOfBalanceStatusViewModel outOfBalanceStatusViewModel = t.row; OutOfBalanceStatusDTO outOfBalanceStatusDTO = outOfBalanceStatusViewModel.MapToDTO(); outOfBalanceStatusComponent.DeleteOutOfBalanceStatus(outOfBalanceStatusDTO.OutOfBalanceStatusId); } else if (t.type == "row") { OutOfBalanceStatusViewModel outOfBalanceStatusViewModel = t.row; OutOfBalanceStatusDTO outOfBalanceStatusDTO = outOfBalanceStatusViewModel.MapToDTO(); outOfBalanceStatusComponent.UpdateOutOfBalanceStatus(outOfBalanceStatusDTO, 1); } }
JsonResult result = new JsonResult(); Dictionary<string, bool> response = new Dictionary<string, bool>(); response.Add("Success", true); result.Data = response; return result; }
#endregion OutOfBalanceStatusChaining
The Component is just handling mapping the ViewModel to a DTO and persisting it in the EntityFramework context.
Joe
Hi Joe,
Thanks for the solution - hopefully it'll benefit other members of the community :)All the best,BorislavPS: By the way, sometimes it might be easier to attach a sample to your reply, rather than pasting the source code. However, this is a matter of personal choice (and there's also a 200 KB restriction on post attachments) so its up to the poster to choose either method.
i am trying to perform CRUD opeation using igGrid.
<script type="text/javascript">
function saveChanges2() {
$("#grid1").igGrid("saveChanges");
return false;
}
$('#grid1').live('iggridupdatingrowadded', function () { $("#grid1").igGrid("saveChanges") });
$('#grid1').live('iggridupdatingeditrowended', function(event, ui) {
if (ui.rowAdding == false) {
});
$('#grid1').live('iggridupdatingrowdeleted', function () { $("#grid1").igGrid("saveChanges") });
</script>
public ActionResult UpdatingSaveChanges()
{AppConfigRepository _app = new AppConfigRepository();
var lstapp = _app.GetAppConfig().ToList<AppConfig>();
ViewData["GenerateCompactJSONResponse"] = false;
GridModel m = new GridModel();
Transaction<AppConfig> transaction = m.LoadTransactions<AppConfig>(HttpContext.Request.Form["ig_transactions"]).First<Transaction<AppConfig>>();
switch(transaction.type)
{
case "row":
string x = transaction.rowId;
var appconf = (from ac in lstapp where ac.AttributeName == x select ac).Single();
if (transaction.row.AttributeName != null)
appconf.AttributeName = transaction.row.AttributeName;
if (transaction.row.AttributeValue != null)
appconf.AttributeValue = transaction.row.AttributeValue;
if (transaction.row.AttributeHelp != null)
appconf.AttributeHelp = transaction.row.AttributeHelp;
_app.UpdateAppConfigByAttributeName(appconf);
break;
case "newrow":
var newAppConf = new AppConfig
AttributeName = transaction.row.AttributeName,
AttributeValue = transaction.row.AttributeValue,
AttributeHelp = transaction.row.AttributeHelp,
};
_app.UpdateAppConfigByAttributeName(newAppConf);
case "deleterow":
string id = transaction.rowId;
var deleteAppConf = (from ac in lstapp where ac.AttributeName == id select ac).Single();
if (deleteAppConf != null)
_app.DeleteAppConfigByAttributeName(id);
reak;
return RedirectToAction("IndexJQ", lstapp);
event for new row event it goes for "deleting" case.
Thanks,
Nirav