On Editor entry form, how do I allow a null input?
On Editor entry form, how do I allow a null input?
bruce@harrisonemail.com
Posts: 8Questions: 3Answers: 0
Code below. for min_amount and max_amount fields, I would like to be able to enter new data or edit data with the option of putting in a number or leaving the field blank or null value.
{% include "dt_csrf.html" %}
$('#opex').DataTable(
);
$('#otherexp').DataTable(
);
let bldg = {{ bldg.id}};
console.log("bldg" + " " + bldg);
let editor = new $.fn.dataTable.Editor({
ajax: "/api/exptiedrev/editor/?format=datatables",
table: "#exp",
fields: [
{
label: "Name",
name: "name"
},
{
label: "Type",
name: "exp_type",
type: "select",
options: [
{label: "Operating Expense", value: "Operating Expense"},
{label: "Other Expenses", value: "Other Expenses"}
],
def: "Operating Expense"
},
{
label: "Revenue Type",
name: "rev_type",
type: "select",
options: [
{label: "Base Rent", value: "Base Rent"},
{label: "Gross Rent", value: "Gross Rent"}
],
def: "Base Rent"
},
{
label: "Charge Rate %",
name: "charge_rate"
},
{
label: "Min, Charge $",
name: "min_amount"
},
{
label: "Maximum Charge $",
name: "max_aumount"
},
],
});
editor.on('preSubmit', function (e, data, action) {
if (action === 'create') {
data.data[0]['bldg'] = parseInt(bldg);
}
});
// Activate an inline edit on click of a table cell
$('#exp').on('click', 'tbody td ', function (e) {
editor.inline(this);
});
let table_rev_exp = $('#exp').DataTable({
"serverSide": true,
dom: "Bfrtip",
"ajax": "/api/exptiedrev/?format=datatables&bldg=" + bldg,
"columns": [
{"data": "bldg"},
{"data": "name"},
{"data": "exp_type"},
{"data": "rev_type"},
{
"data": "charge_rate",
"render": function (data, type, row) {
return data + "%";
}
},
{"data": "min_amount", render: $.fn.dataTable.render.number(',', '.', 2, '$')},
{"data": "max_amount", render: $.fn.dataTable.render.number(',', '.', 2, '$')},
],
select: true,
buttons: [
{extend: "create", editor: editor},
{extend: "edit", editor: editor},
{extend: "remove", editor: editor},
{
extend: 'collection',
text: 'Export',
buttons: [
{
extend: 'excelHtml5',
customize: function (xlsx) {
$(xlsx.xl["styles.xml"]).find('numFmt[numFmtId="164"]').attr('formatCode',
'[$$-45C] #,##0.00_-');
},
exportOptions: {
columns: [1, 2, 3, 4, 5, 6],
},
title: "Expenses"
},
{
extend: 'pdfHtml5',
exportOptions: {
columns: [1, 2, 3, 4, 5, 6]
},
title: "Expenses"
},
{
extend: 'print',
exportOptions: {
columns: [1, 2, 3, 4, 5, 6]
},
title: " Expenses"
},
]
},
],
"columnDefs": [
{
"targets": [0],
"visible": false,
"searchable": false
}
],
});
table_rev_exp.buttons().container()
.appendTo($('.col-md-6:eq(0)', table_rev_exp.table().container()));
});
This discussion has been closed.
Answers
I don't quite follow, as you can leave fields blank by default - see basic example here. Please can you provide some more information to help us understand your requirement.
Colin
I got it figured out. I am using a Django REST backend. The REST API was requiring a field, so it wasn't letting me leave a Editor form field blank. I need to fix the problem at the REST API level. Thank you for your time, I was asking the wrong question.
The issue is that in Editor I have a field, {
label: "Min, Charge $",
name: "min_amount"
},
This field could be a decimal or Null. The API POST works fine if min_amount is a NULL. But when I edit the record to remove a number with a NULL or create a new record with a NULL for min_amount, In Editor, I can't save the record.
Also, in Datatables, if the min_amount is zero, I would like to render it as
"".
Clarification for above comment. I am using a Django backend and Django Rest Framework. It actually works great. To fix the API accepting a NULL value, I just need to set a Serializer to required=False. So the remaining issue is only Editor inline editing and Editor Edit / New functions.
I'm not clear what you mean by NULL in this case - as I mentioned before, if the value was empty, it would send an empty string.
Colin