Topic: TableEditor – add, but with validation
joelgrondrup asked 3 years ago
Hi guys.
In the Table Editor I'm adding new rows using an ajax request. I'm using the add.mdb.tableEditor event.
But I need to do some validation.
One of the fields in the table view is an e-mail field. If this field is not filled out, the new row shouldn't be removed.
Instead I'm notifiying the user with a toast.
Here's my code.
table.addEventListener('add.mdb.tableEditor', event => {
input.removeAttribute('disabled');
if (!event.row.email){
$(".page-loader").hide();
var toastElement = document.getElementById("basic-warning");
toastElement.querySelector(".toast-header .me-auto").innerHTML = "Fejl!";
toastElement.querySelector(".toast-body").innerHTML = "Du skal udfylde en e-mail";
let toast = mdb.Toast.getInstance(toastElement);
toast.show();
//How to dismiss the removal of the new row
//Expected something like this: tableAdvancedSearch.add(event.row);
// But I'm just getting this error: Uncaught TypeError: Illegal invocation
// at Object.find (all.min.js:319)
// at i.value (all.min.js:319)
// at i.value (all.min.js:319)
// at all.min.js:319
//
return;
}
var data = event.row;
data["existingClient"] = true;
$.ajax({
method: "POST",
url: "createuser",
data: data
})
.done(function(msg) {
var obj = JSON.parse(msg);
if (obj["success"]){
var toastElement = document.getElementById("basic-success");
toastElement.querySelector(".toast-header .me-auto").innerHTML = "Bruger oprettet";
toastElement.querySelector(".toast-body").innerHTML = obj["text"];
let toast = mdb.Toast.getInstance(toastElement);
toast.show();
reloadData();
}
else {
$(".page-loader").hide();
var toastElement = document.getElementById("basic-failure");
toastElement.querySelector(".toast-header .me-auto").innerHTML = "Fejl!";
toastElement.querySelector(".toast-body").innerHTML = obj["text"];
let toast = mdb.Toast.getInstance(toastElement);
toast.show();
}
});
});
Dawid Wajszczuk staff answered 3 years ago
Hi.
I'm not quite sure what you are trying to accomplish. Are you trying to prevent removing or rather adding row when there is no email? Either way, currently it is not possible to prevent event from further execution, so validation can't be done. I have added proper task for this.
Keep coding,
Dawid
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Free
- Premium support: No
- Technology: MDB Standard
- MDB Version: MDB5 3.10.1
- Device: Macbook
- Browser: Chrome
- OS: OSX 12.0.1
- Provided sample code: No
- Provided link: No