remove trash icon from date field in DV

[bebbit]

Hi,

I have a detail view screen for a table holding date fields.
Each field is accompanied by two icons: a trash icon and a calendar icon.
I would like to remove the trash icon because the dates are mandatory.

Does anyone have a clue to accomplish that?

[jsetzer]

You are right, default date picker (combination of three <select/>-boxes) shows date-clear-button, even if the field is required.

In many situations this makes sense to me, because it is faster to click that button instead of selecting empty option three times.

Anyway, you can use the following Javascript code for hiding the date-clear-button:

Before

chrome_E5e4ma8cdW.png (2.03 KiB) Viewed 6225 times

Javascript Code

Code: Select all

// file: hooks/TABLENAME-dv.js
const fieldname = "date_till";

hideDateClearButton(fieldname);

function hideDateClearButton(fieldname) {
    jQuery(`.fd-date-clearer[data-for='${fieldname}']`).hide();
}

After

j4bhb7KR4m.png (1.88 KiB) Viewed 6225 times

---

PS: Just in case someone also wants to hide the Calendar-button:

Code: Select all

// file: hooks/TABLENAME-dv.js
const fieldname = "date_till";

hideDateClearButton(fieldname);
hideDateSelectButton(fieldname);

function hideDateClearButton(fieldname) {
    jQuery(`.fd-date-clearer[data-for='${fieldname}']`).hide();
}

function hideDateSelectButton(fieldname) {
    jQuery(`#fd-but-${fieldname}`).hide();
}

gxM2LF8HEA.png (1.69 KiB) Viewed 6225 times

---

PPS: In case you want to hide all date-clear-buttons in a DV at once, you can use this:

Code: Select all

// file: hooks/TABLENAME-dv.js
hideAllDateClearButtons();

function hideAllDateClearButtons() {
    jQuery(`.fd-date-clearer[data-for]`).hide();
}

Hope this helps.

[bebbit]

Thanks for the reply.

Unfortunately it does not work.

This is what I added in the file ARCHIEFSTUK-dv.js:
// file: hooks/ARCHIEFSTUK-dv.js

const fieldname = "date_till";

hideDateClearButton(fieldname);

function hideDateClearButton(fieldname) {
jQuery(`.fd-date-clearer[data-for='${fieldname}']`).hide();
}

Any suggestion?

[jsetzer]

const fieldname = "date_till";

Are you sure your specific field has the same name date_till as my sample field?

Are there any red errors in console?

[bebbit]

Changed fieldname to my actual fieldname "DatumArchiefstuk", but that didn't help.

Tried your clear all option. Doesn't work either.

[jsetzer]

I cannot see your code, so I cannot help debugging.

It works here if put into the correct file in hooks directory with correct fieldname after reload without cache.

Are there any red errors in console?

Did you check that?

And are you using an up-to-date version?

Is it really a date field or something different, for example datetime?

We need more information!

[bebbit]

created a page with some pictures.
hope that helps.