how can you capture the event when pressing escape in the validation

[ryan paulParticipant]

hi,

when using a validation and you press escape, you will be allowed to modify the other records, right?
how can you capture the event of the escape so that you can show an alert or just remove the row that has invalid.

thanks

[Peter StoevKeymaster]

Hi,

When pressing escape on validation, the Grid will cancel the changes in the edit cell and will allow you to edit other cells.

If you want to show an alert when ESC is pressed, see the “handlekeyboardnavigation” method below:

     // initialize jqxGrid
            $("#jqxgrid").jqxGrid(
            {
                width: 685,
                source: dataAdapter,
                editable: true,
                theme: theme,
                handlekeyboardnavigation: function (event) {
                    var key = event.charCode ? event.charCode : event.keyCode ? event.keyCode : 0;
                    if (key == 27) {
                        alert('Pressed Esc Key.');
                        return true;
                    }
                },
                selectionmode: 'multiplecellsadvanced',
                columns: [
                  { text: 'First Name', columntype: 'textbox', datafield: 'firstname', width: 80 },
                  { text: 'Last Name', datafield: 'lastname', columntype: 'textbox', width: 80 },
                  { text: 'Product', columntype: 'dropdownlist', datafield: 'productname', width: 195 },
                  { text: 'Available', datafield: 'available', columntype: 'checkbox', width: 67 },
                  {
                      text: 'Ship Date', datafield: 'date', columntype: 'datetimeinput', width: 110, align: 'right', cellsalign: 'right', cellsformat: 'd',
                  validation: function (cell, value) {
                          if (value == "")
                             return true;
                          var year = value.getFullYear();
                          if (year >= 2014) {
                              return { result: false, message: "Ship Date should be before 1/1/2014" };
                          }
                          return true;
                      }
                  },
                  {
                      text: 'Quantity', datafield: 'quantity', width: 70, align: 'right', cellsalign: 'right', columntype: 'numberinput',
                      validation: function (cell, value) {
                          if (value < 0 || value > 150) {
                              return { result: false, message: "Quantity should be in the 0-150 interval" };
                          }
                          return true;
                      },
                      createeditor: function (row, cellvalue, editor) {
                          editor.jqxNumberInput({ decimalDigits: 0, digits: 3 });
                      }
                  },
                  { text: 'Price', datafield: 'price', align: 'right', cellsalign: 'right', cellsformat: 'c2', columntype: 'numberinput',
                      validation: function (cell, value) {
                          if (value < 0 || value > 15) {
                              return { result: false, message: "Price should be in the 0-15 interval" };
                          }
                          return true;
                      },
                      createeditor: function (row, cellvalue, editor) {
                          editor.jqxNumberInput({ digits: 3 });
                      }
                  }
                ]
            });

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[ryan paulParticipant]

this is good, 🙂

but is it also possible that you cannot move to another row or you cannot add new row if there’s still an error with the current row?

thank you

[ryan paulParticipant]

or do you have something like

$(‘#form’).jqxValidator(‘validate’, element);

or

$(‘#AddButton’).click(function () {
var isValid = $(‘#form’).jqxValidator(‘validate’);
if (isValid) {
$(‘#grid’).jqxGrid(‘addrow’, rowid, {});
}
else {
alert(“In-Valid”);
}
});

or when AddButton is clicked it will call the validation of the column to check if there’s an error,
what is the best approach for this?

thank you

[Peter StoevKeymaster]

Hi,

We do not have something like that. The Grid’s validation is handled by the Grid when a cell is edited. If you want to validate your users input when a new Row is going to be added then you can create a Form on your page and validate users input before allowing the user to add the new row.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[Author]

Posts