We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
I want to insert only unique code identification record in grid
if I will enter non-unique record in grid in net core js2.I should show me an error.
Thank you, waiting for you example reply
|
<ejs-grid id="Grid" dataSource="@ViewBag.DataSource" allowPaging="true" actionBegin="actionBegin" load=”load” actionFailure="actionFailure" toolbar="@(new List<string>() {"Add", "Edit", "Update", "Delete" })" actionComplete="actionComplete">
<e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true" mode="Dialog" template='#dialogtemplate'></e-grid-editSettings>
<e-grid-columns>
<e-grid-column field="OrderID" headerText="Order ID" isPrimaryKey="true" textAlign="Right" width="100"></e-grid-column>
<e-grid-column field="CustomerID" headerText="Customer ID" type="string" width="120"></e-grid-column>
<e-grid-column field="Freight" headerText="Freight" textAlign="Right" format="C2" editType="numericedit" width="120"></e-grid-column>
<e-grid-column field="ShipCity" headerText="Ship City" width="150"></e-grid-column>
</e-grid-columns>
</ejs-grid>
<script>
function load(args) {
this.columns[0].validationRules = { required: true, value: [customFn, 'Enter a unique value'] };
}
function customFn(args) {
var grid = document.getElementById('Grid').ej2_instances[0];
for (i = 0; i < grid.dataSource.length; i++) {
if (args['value'] === grid.dataSource[i].OrderID.toString()) {
return false;
}
else {
return true;
}
}
};
</script>
|
It does not allow me to download the example, the permission is not associated with my account.
The example does not work.
I implemented it this way because load locks the grid.
function actionComplete(args) {
if (args.requestType === 'beginEdit' || args.requestType === 'add') {
if (args.requestType === 'beginEdit') {
args.dialog.header = 'Modificar Registro';
args.dialog.width = '500px';
args.dialog.height = '400px';
var ajax = new ej.base.Ajax({
url: "@Url.Action("EditPartial", "Cargos")", //render the Edit partial view
type: "POST",
contentType: "application/json",
data: JSON.stringify({ value: args.rowData })
});
ajax.send().then(function (data) {
appendElement(data, args.form); //Render the edit form in newly created template with the selected record
args.form.elements.namedItem('Codigo').focus();
}).catch(function (xhr) {
console.log(xhr);
});
}
if (args.requestType === 'add') {
args.dialog.header = 'Adicionar Registro';
args.dialog.width = '500px';
args.dialog.height = '400px';
var ajax = new ej.base.Ajax({
url: "@Url.Action("AddPartial","Cargos")", //render the Add partial view
type: "POST",
contentType: "application/json",
data: JSON.stringify({ value: args.rowData })
});
ajax.send().then(function (data) {
appendElement(data, args.form); //Render the edit form with selected record
args.form.elements.namedItem('Codigo').focus();
}).catch(function (xhr) {
console.log(xhr);
});
}
if ((args.requestType === 'beginEdit' || args.requestType === 'add')) {
// Add Validation Rules
args.form.ej2_instances[0].addRules('Codigo', { required: [true, 'Este dato es requerido'], maxLength: [10, '10 caracteres máximo'], value: [customFn, 'Enter a unique value'] });
}
}
}
function customFn(args) {
var grid = document.getElementById('Grid').ej2_instances[0];
for (i = 0; i < grid.dataSource.length; i++) {
if (args['value'] === grid.dataSource[i].Codigo.toString()) {
return false;
}
else {
return true;
}
}
};
Please review what happens. in advance Thanks for the support.
|
@{
ViewData["Title"] = "Home Page";
}
<ejs-grid id="Grid" dataSource="@ViewBag.DataSource" allowPaging="true" actionBegin="actionBegin" actionFailure="actionFailure" toolbar="@(new List<string>() {"Add", "Edit", "Update", "Delete" })" actionComplete="actionComplete">
<e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true" mode="Dialog" template='#dialogtemplate'></e-grid-editSettings>
<e-grid-columns>
<e-grid-column field="OrderID" headerText="Order ID" isPrimaryKey="true" textAlign="Right" width="100"></e-grid-column>
<e-grid-column field="CustomerID" headerText="Customer ID" type="string" width="120"></e-grid-column>
<e-grid-column field="Freight" headerText="Freight" textAlign="Right" format="C2" editType="numericedit" width="120"></e-grid-column>
<e-grid-column field="ShipCity" headerText="Ship City" width="150"></e-grid-column>
</e-grid-columns>
</ejs-grid>
<script id='dialogtemplate' type="text/x-template">
<div id="dialogTemp">
</div>
</script>
<script type="text/javascript">
function customFn(args) {
debugger
var grid = document.getElementById('Grid').ej2_instances[0];
for (i = 0; i < grid.dataSource.length; i++) {
if (args['value'] === grid.dataSource[i].OrderID.toString()) {
return false;
}
else {
return true;
}
}
};
function actionBegin(args) {
if (args.requestType === 'save') {
console.log(args);
}
}
function actionFailure(args) {
console.log(args);
}
function actionComplete(args) {
if (args.requestType === 'beginEdit' || args.requestType === 'add') {
args.form.ej2_instances[0].addRules('OrderID', { required: [true, 'Este dato es requerido'], maxLength: [10, '10 caracteres máximo'], value: [customFn, 'Enter a unique value'] });
let spinner = ej.popups.createSpinner({ target: args.dialog.element });
ej.popups.showSpinner(args.dialog.element);
if (args.requestType === 'beginEdit') {
var ajax = new ej.base.Ajax({
url: "@Url.Action("Editpartial", "Home")", //render the partial view
type: "POST",
contentType: "application/json",
data: JSON.stringify({ value: args.rowData })
});
ajax.send().then(function (data) {
appendElement(data, args.form); //Render the edit form with selected record
args.form.elements.namedItem('CustomerID').focus();
ej.popups.hideSpinner(args.dialog.element);
}).catch(function (xhr) {
console.log(xhr);
ej.popups.hideSpinner(args.dialog.element);
});
}
if (args.requestType === 'add') {
var ajax = new ej.base.Ajax({
url: "@Url.Action("Addpartial","Home")", //render the partial view
type: "POST",
contentType: "application/json",
data: JSON.stringify({ value: args.rowData })
});
ajax.send().then(function (data) {
appendElement(data, args.form); //Render the edit form with selected record
args.form.elements.namedItem('OrderID').focus();
ej.popups.hideSpinner(args.dialog.element);
}).catch(function (xhr) {
console.log(xhr);
ej.popups.hideSpinner(args.dialog.element);
});
}
}
}
function appendElement(elementString, form) {
form.querySelector("#dialogTemp").innerHTML = elementString;
var script = document.createElement('script');
script.type = "text/javascript";
var serverScript = form.querySelector("#dialogTemp").querySelector('script');
script.textContent = serverScript.innerHTML;
document.head.appendChild(script);
serverScript.remove();
}
</script> |
|
function customFn(args) {
var grid = document.getElementById('Grid').ej2_instances[0];
var action = args.element.closest('.e-row').classList.contains('e-addedrow') ? 'add' : 'edit';
if (action == 'edit') {
var key = grid.getRowInfo(args.element.closest('tr')).rowData.Id
}
var y = grid.dataSource.executeLocal(
new ej.data.Query().where("EmailAddress", "equal", args.value)
);
if (y.length == 0 || key == y[0].Id) {
return true;
} else {
return false;
}
}; |
Hi Surendra,
Thanks for your update.
Query: 1) At edit time uniqueness of the email not working properly.We have modified the code example, please refer the below code example for more information.
Query: 2) Command button(Edit) incorrect behavior.This is the default behavior of the Grid. From that screenshot we could see that you are trying to edit the second row while the first row is in edited state. So by default the First row will be saved , While clicking the second row ‘s edit command icon.
Query: 3) Please guide me or give me an example, how to do server-side validation for an email address?By default In EJ 2 Form validator we do not have support for server side validation. But we can achieve this requirement by sending Ajax request to the server as a workaround . Once you confirm whether this is ok from your end we will provide the workaround solution for it.
Please let us know, if you need further assistance.
Regards,Manivel
|
<ejs-grid id="Grid" dataSource="ViewBag.DataSource" actionBegin="actionBegin" width="800">
. . .
</ejs-grid>
<script>
let selectedRecord = {};
var initial = false;
function actionBegin(args) {
if ((args.requestType === "save") && initial) {
initial = false;
}
else if ((args.requestType === "save")) {
args.cancel = true;
var sendObj = { value1: args.data.OrderID };
var ajax = new ej.base.Ajax({
url: "/Home/DataFrm",
type: "POST",
contentType: "application/json",
data: JSON.stringify(sendObj)
});
ajax.send().then(function (data) {
if (data == 'true') {
alert("grid payment value is greater...");
} else {
var grid = document.getElementsByClassName('e-grid')[0].ej2_instances[0];
if (!initial) {
initial = true;
grid.endEdit();
}
}
}).catch(function (xhr) {
console.log(xhr);
});
}
}
</script> |
|
public bool DataFrm([FromBody]Values val2)
{
if(val2.value1 == 2)
{
return true;
} else
{
return false;
}
} |
