Mixing
Open DevExpress MVC Grid in Edit Mode with Custom Edit Button
up vote
0
down vote
favorite
1
I'm using the Devexpress MVC Grid and I've added two custom buttons (Edit & Copy) and I'm performing the operations. With copy button, I'm creating a new record with existing data and opening the grid in Add New Row Mode.
Following is the code:
@Html.DevExpress().GridView(grid =>
{
grid.Name = "gvInformation";
grid.SettingsDetail.AllowOnlyOneMasterRowExpanded = true;
grid.SettingsEditing.Mode = GridViewEditingMode.EditForm;
//Callback Events
grid.CallbackRouteValues = new { Controller = "Case", Action = "InformationGridContent"};
grid.SettingsEditing.AddNewRowRouteValues = new { Controller = "Case", Action = "AddInformationRecord" };
grid.SettingsEditing.UpdateRowRouteValues = new { Controller = "Case", Action = "UpdateInformationRecord" };
grid.SettingsEditing.DeleteRowRouteValues = new { Controller = "Case", Action = "DeleteInformationRecord" };
grid.ClientSideEvents.BeginCallback = "BeginGridCallback";
grid.BeforeGetCallbackResult = (sender, e) =>
{
MVCxGridView gridView = sender as MVCxGridView;
if (isCopyRequired)
gridView.AddNewRow();
if (gridView.IsNewRowEditing)
{
gridView.SettingsText.CommandUpdate = Html.Raw("<span id='btnGridAdd'>Add</span>").ToHtmlString();
gridView.SettingsText.CommandCancel = Html.Raw("<span id='btnGridCancel'>Cancel</span>").ToHtmlString();
}
if (!gridView.IsNewRowEditing)
{
gridView.SettingsText.CommandUpdate = Html.Raw("<span id='btnGridUpdate'>Update</span>").ToHtmlString();
gridView.SettingsText.CommandCancel = Html.Raw("<span id='btnCancel'>Cancel</span>").ToHtmlString();
}
};
//Custom Copy Record Button
var btnCopy = new GridViewCommandColumnCustomButton { ID = "btnCopy" };
btnCopy.Text = "<i class="fa fa-copy fa-lg" title='Copy'></i>";
grid.CommandColumn.CustomButtons.Add(btnCopy);
//Custom Edit Button
var btnEdit = new GridViewCommandColumnCustomButton { ID = "btnEdit" };
btnEdit.Text = "<i class="fa fa-pencil fa-lg" title='Edit'></i>";
grid.CommandColumn.CustomButtons.Add(btnEdit);
//Custom Button Events
grid.ClientSideEvents.CustomButtonClick = "OnCustomButtonClick";
grid.CustomActionRouteValues = new { Controller = "Case", Action = "CustomInformationRecord" };
}
Client Side Events:
var buttonCommand;
function OnCustomButtonClick(s, e) {
buttonCommand = e.buttonID;
s.PerformCallback();
}
function BeginGridCallback(s, e) {
//Grid Edit Button Click Event
if (buttonCommand === "btnEdit") {
e.customArgs["buttonCommand"] = "btnEdit";
}
//Grid Copy Button Click Event
if (buttonCommand === "btnCopy") {
e.customArgs["buttonCommand"] = "btnCopy";
}
}
It is working fine for Copy button and opening the Grid in Edit Form Mode but when Edit Button is clicked it is not opening the Grid in Edit Mode. Is there something I'm missing?
devexpress devexpress-mvc devexpress-gridcontrol
asked 18 hours ago
Sahil Sharma
798518
add a comment |
up vote
0
down vote
favorite
1
I'm using the Devexpress MVC Grid and I've added two custom buttons (Edit & Copy) and I'm performing the operations. With copy button, I'm creating a new record with existing data and opening the grid in Add New Row Mode.
Following is the code:
@Html.DevExpress().GridView(grid =>
{
grid.Name = "gvInformation";
grid.SettingsDetail.AllowOnlyOneMasterRowExpanded = true;
grid.SettingsEditing.Mode = GridViewEditingMode.EditForm;
//Callback Events
grid.CallbackRouteValues = new { Controller = "Case", Action = "InformationGridContent"};
grid.SettingsEditing.AddNewRowRouteValues = new { Controller = "Case", Action = "AddInformationRecord" };
grid.SettingsEditing.UpdateRowRouteValues = new { Controller = "Case", Action = "UpdateInformationRecord" };
grid.SettingsEditing.DeleteRowRouteValues = new { Controller = "Case", Action = "DeleteInformationRecord" };
grid.ClientSideEvents.BeginCallback = "BeginGridCallback";
grid.BeforeGetCallbackResult = (sender, e) =>
{
MVCxGridView gridView = sender as MVCxGridView;
if (isCopyRequired)
gridView.AddNewRow();
if (gridView.IsNewRowEditing)
{
gridView.SettingsText.CommandUpdate = Html.Raw("<span id='btnGridAdd'>Add</span>").ToHtmlString();
gridView.SettingsText.CommandCancel = Html.Raw("<span id='btnGridCancel'>Cancel</span>").ToHtmlString();
}
if (!gridView.IsNewRowEditing)
{
gridView.SettingsText.CommandUpdate = Html.Raw("<span id='btnGridUpdate'>Update</span>").ToHtmlString();
gridView.SettingsText.CommandCancel = Html.Raw("<span id='btnCancel'>Cancel</span>").ToHtmlString();
}
};
//Custom Copy Record Button
var btnCopy = new GridViewCommandColumnCustomButton { ID = "btnCopy" };
btnCopy.Text = "<i class="fa fa-copy fa-lg" title='Copy'></i>";
grid.CommandColumn.CustomButtons.Add(btnCopy);
//Custom Edit Button
var btnEdit = new GridViewCommandColumnCustomButton { ID = "btnEdit" };
btnEdit.Text = "<i class="fa fa-pencil fa-lg" title='Edit'></i>";
grid.CommandColumn.CustomButtons.Add(btnEdit);
//Custom Button Events
grid.ClientSideEvents.CustomButtonClick = "OnCustomButtonClick";
grid.CustomActionRouteValues = new { Controller = "Case", Action = "CustomInformationRecord" };
}
Client Side Events:
var buttonCommand;
function OnCustomButtonClick(s, e) {
buttonCommand = e.buttonID;
s.PerformCallback();
}
function BeginGridCallback(s, e) {
//Grid Edit Button Click Event
if (buttonCommand === "btnEdit") {
e.customArgs["buttonCommand"] = "btnEdit";
}
//Grid Copy Button Click Event
if (buttonCommand === "btnCopy") {
e.customArgs["buttonCommand"] = "btnCopy";
}
}
It is working fine for Copy button and opening the Grid in Edit Form Mode but when Edit Button is clicked it is not opening the Grid in Edit Mode. Is there something I'm missing?
devexpress devexpress-mvc devexpress-gridcontrol
asked 18 hours ago
Sahil Sharma
798518
Are you got any errors in browser console? I think you should adds.StartEditRow(e.visibleIndex)to start editing rows - but I still not understand whyCopybutton opens the grid in edit mode without the command previously mentioned.
– Tetsuya Yamamoto
18 hours ago
No I'm not getting any errors. But when I added s.StartEditRow(e.visibleIndex) inside the if condition of BeginGridCallback(s, e), it throws an error that .toString() is not defined.
– Sahil Sharma
17 hours ago
add a comment |
up vote
0
down vote
favorite
1
up vote
0
down vote
favorite
1
1
I'm using the Devexpress MVC Grid and I've added two custom buttons (Edit & Copy) and I'm performing the operations. With copy button, I'm creating a new record with existing data and opening the grid in Add New Row Mode.
Following is the code:
@Html.DevExpress().GridView(grid =>
{
grid.Name = "gvInformation";
grid.SettingsDetail.AllowOnlyOneMasterRowExpanded = true;
grid.SettingsEditing.Mode = GridViewEditingMode.EditForm;
//Callback Events
grid.CallbackRouteValues = new { Controller = "Case", Action = "InformationGridContent"};
grid.SettingsEditing.AddNewRowRouteValues = new { Controller = "Case", Action = "AddInformationRecord" };
grid.SettingsEditing.UpdateRowRouteValues = new { Controller = "Case", Action = "UpdateInformationRecord" };
grid.SettingsEditing.DeleteRowRouteValues = new { Controller = "Case", Action = "DeleteInformationRecord" };
grid.ClientSideEvents.BeginCallback = "BeginGridCallback";
grid.BeforeGetCallbackResult = (sender, e) =>
{
MVCxGridView gridView = sender as MVCxGridView;
if (isCopyRequired)
gridView.AddNewRow();
if (gridView.IsNewRowEditing)
{
gridView.SettingsText.CommandUpdate = Html.Raw("<span id='btnGridAdd'>Add</span>").ToHtmlString();
gridView.SettingsText.CommandCancel = Html.Raw("<span id='btnGridCancel'>Cancel</span>").ToHtmlString();
}
if (!gridView.IsNewRowEditing)
{
gridView.SettingsText.CommandUpdate = Html.Raw("<span id='btnGridUpdate'>Update</span>").ToHtmlString();
gridView.SettingsText.CommandCancel = Html.Raw("<span id='btnCancel'>Cancel</span>").ToHtmlString();
}
};
//Custom Copy Record Button
var btnCopy = new GridViewCommandColumnCustomButton { ID = "btnCopy" };
btnCopy.Text = "<i class="fa fa-copy fa-lg" title='Copy'></i>";
grid.CommandColumn.CustomButtons.Add(btnCopy);
//Custom Edit Button
var btnEdit = new GridViewCommandColumnCustomButton { ID = "btnEdit" };
btnEdit.Text = "<i class="fa fa-pencil fa-lg" title='Edit'></i>";
grid.CommandColumn.CustomButtons.Add(btnEdit);
//Custom Button Events
grid.ClientSideEvents.CustomButtonClick = "OnCustomButtonClick";
grid.CustomActionRouteValues = new { Controller = "Case", Action = "CustomInformationRecord" };
}
Client Side Events:
var buttonCommand;
function OnCustomButtonClick(s, e) {
buttonCommand = e.buttonID;
s.PerformCallback();
}
function BeginGridCallback(s, e) {
//Grid Edit Button Click Event
if (buttonCommand === "btnEdit") {
e.customArgs["buttonCommand"] = "btnEdit";
}
//Grid Copy Button Click Event
if (buttonCommand === "btnCopy") {
e.customArgs["buttonCommand"] = "btnCopy";
}
}
It is working fine for Copy button and opening the Grid in Edit Form Mode but when Edit Button is clicked it is not opening the Grid in Edit Mode. Is there something I'm missing?
devexpress devexpress-mvc devexpress-gridcontrol
asked 18 hours ago
Sahil Sharma
798518
I'm using the Devexpress MVC Grid and I've added two custom buttons (Edit & Copy) and I'm performing the operations. With copy button, I'm creating a new record with existing data and opening the grid in Add New Row Mode.
Following is the code:
@Html.DevExpress().GridView(grid =>
{
grid.Name = "gvInformation";
grid.SettingsDetail.AllowOnlyOneMasterRowExpanded = true;
grid.SettingsEditing.Mode = GridViewEditingMode.EditForm;
//Callback Events
grid.CallbackRouteValues = new { Controller = "Case", Action = "InformationGridContent"};
grid.SettingsEditing.AddNewRowRouteValues = new { Controller = "Case", Action = "AddInformationRecord" };
grid.SettingsEditing.UpdateRowRouteValues = new { Controller = "Case", Action = "UpdateInformationRecord" };
grid.SettingsEditing.DeleteRowRouteValues = new { Controller = "Case", Action = "DeleteInformationRecord" };
grid.ClientSideEvents.BeginCallback = "BeginGridCallback";
grid.BeforeGetCallbackResult = (sender, e) =>
{
MVCxGridView gridView = sender as MVCxGridView;
if (isCopyRequired)
gridView.AddNewRow();
if (gridView.IsNewRowEditing)
{
gridView.SettingsText.CommandUpdate = Html.Raw("<span id='btnGridAdd'>Add</span>").ToHtmlString();
gridView.SettingsText.CommandCancel = Html.Raw("<span id='btnGridCancel'>Cancel</span>").ToHtmlString();
}
if (!gridView.IsNewRowEditing)
{
gridView.SettingsText.CommandUpdate = Html.Raw("<span id='btnGridUpdate'>Update</span>").ToHtmlString();
gridView.SettingsText.CommandCancel = Html.Raw("<span id='btnCancel'>Cancel</span>").ToHtmlString();
}
};
//Custom Copy Record Button
var btnCopy = new GridViewCommandColumnCustomButton { ID = "btnCopy" };
btnCopy.Text = "<i class="fa fa-copy fa-lg" title='Copy'></i>";
grid.CommandColumn.CustomButtons.Add(btnCopy);
//Custom Edit Button
var btnEdit = new GridViewCommandColumnCustomButton { ID = "btnEdit" };
btnEdit.Text = "<i class="fa fa-pencil fa-lg" title='Edit'></i>";
grid.CommandColumn.CustomButtons.Add(btnEdit);
//Custom Button Events
grid.ClientSideEvents.CustomButtonClick = "OnCustomButtonClick";
grid.CustomActionRouteValues = new { Controller = "Case", Action = "CustomInformationRecord" };
}
Client Side Events:
var buttonCommand;
function OnCustomButtonClick(s, e) {
buttonCommand = e.buttonID;
s.PerformCallback();
}
function BeginGridCallback(s, e) {
//Grid Edit Button Click Event
if (buttonCommand === "btnEdit") {
e.customArgs["buttonCommand"] = "btnEdit";
}
//Grid Copy Button Click Event
if (buttonCommand === "btnCopy") {
e.customArgs["buttonCommand"] = "btnCopy";
}
}
It is working fine for Copy button and opening the Grid in Edit Form Mode but when Edit Button is clicked it is not opening the Grid in Edit Mode. Is there something I'm missing?
devexpress devexpress-mvc devexpress-gridcontrol
devexpress devexpress-mvc devexpress-gridcontrol
asked 18 hours ago
Sahil Sharma
798518
asked 18 hours ago
Sahil Sharma
798518
asked 18 hours ago
Sahil Sharma
798518
asked 18 hours ago
Sahil Sharma
798518
asked 18 hours ago
Sahil Sharma
798518
798518
Are you got any errors in browser console? I think you should adds.StartEditRow(e.visibleIndex)to start editing rows - but I still not understand whyCopybutton opens the grid in edit mode without the command previously mentioned.
– Tetsuya Yamamoto
18 hours ago
No I'm not getting any errors. But when I added s.StartEditRow(e.visibleIndex) inside the if condition of BeginGridCallback(s, e), it throws an error that .toString() is not defined.
– Sahil Sharma
17 hours ago
add a comment |
Are you got any errors in browser console? I think you should adds.StartEditRow(e.visibleIndex)to start editing rows - but I still not understand whyCopybutton opens the grid in edit mode without the command previously mentioned.
– Tetsuya Yamamoto
18 hours ago
No I'm not getting any errors. But when I added s.StartEditRow(e.visibleIndex) inside the if condition of BeginGridCallback(s, e), it throws an error that .toString() is not defined.
– Sahil Sharma
17 hours ago
Are you got any errors in browser console? I think you should add
s.StartEditRow(e.visibleIndex) to start editing rows - but I still not understand why Copy button opens the grid in edit mode without the command previously mentioned.– Tetsuya Yamamoto
18 hours ago
Are you got any errors in browser console? I think you should add
s.StartEditRow(e.visibleIndex) to start editing rows - but I still not understand why Copy button opens the grid in edit mode without the command previously mentioned.– Tetsuya Yamamoto
18 hours ago
No I'm not getting any errors. But when I added s.StartEditRow(e.visibleIndex) inside the if condition of BeginGridCallback(s, e), it throws an error that .toString() is not defined.
– Sahil Sharma
17 hours ago
No I'm not getting any errors. But when I added s.StartEditRow(e.visibleIndex) inside the if condition of BeginGridCallback(s, e), it throws an error that .toString() is not defined.
– Sahil Sharma
17 hours ago
add a comment |
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
draft saved
draft discarded
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53371679%2fopen-devexpress-mvc-grid-in-edit-mode-with-custom-edit-button%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Are you got any errors in browser console? I think you should add
s.StartEditRow(e.visibleIndex)to start editing rows - but I still not understand whyCopybutton opens the grid in edit mode without the command previously mentioned.– Tetsuya Yamamoto
18 hours ago
No I'm not getting any errors. But when I added s.StartEditRow(e.visibleIndex) inside the if condition of BeginGridCallback(s, e), it throws an error that .toString() is not defined.
– Sahil Sharma
17 hours ago