This is a first for me.
I have a table field that has dates in a drop down. On a change to that field two other columns get populated with the reformatted dates. Those columns are hidden with jQuery not Field Rules.
How the columns are hidden:
//on load hide the .RecDtReformat column
$('.uploadNewDocsTbl td:nth-child(5), .uploadNewDocsTbl td:nth-child(6)').css('display', 'none');
$('.uploadNewDocsTbl th:nth-child(5), .uploadNewDocsTbl th:nth-child(6)').css('display', 'none');
//on click add new row, hide new .RecDtReformat column
$('.uploadNewDocsTbl .cf-table-add-row').on('click', function(){
$('.uploadNewDocsTbl .RecDtReformat, .uploadNewDocsTbl .recDayMo').each(function(){
$(this).css('display', 'none');
});
});
When it was just one column getting populated it was fine, but when I added the second both columns started showing an unfriendly message in the html:
here it is so it pings on a text search:
<td data-col="q68" data-title="RecDt Reformat" class="RecDtReformat" style="display: none;"><label class="cf-col-label" id="FieldLabel68(1)" for="Field68(1)">RecDt Reformat<span class="screen-reader-legend">field type single line</span></label><div class="cf-field"><input type="text" id="Field68(1)" name="Field68(1)" aria-labelledby="FieldLabel68(1)" class="singleline cf-xlarge" maxlength="4000" data-list-focus="true" data-parsley-legal-character="True" vo="e"><p class="screen-reader-legend">Input blocked. Maximum character limit of 4000 characters reached.</p></div></td>
this is a little easier to read:
The 'Input blocked' message appears on page load, not after my jQuery runs to populate the other 2 columns.
Here is that:
//reformat date into next column
$('.uploadNewDocsTbl').on('change', '.upDocsTblRecDt', function() {
var toDt = new Date($(this).find('option:selected').text());
var formatYr = toDt.getFullYear();
var mo = toDt.getMonth()+1;
var formatMo = new function(){
if (mo < 10){
(mo = '0' + mo)}
};//function
var day = toDt.getDate();
var formatDay = new function(){
if (day < 10){
(day = '0' + day)}
};//function
var newFormat = formatYr + '-' + mo + '-' + day;
//format for dd-MM
const months = ["JAN", "FEB", "MAR","APR", "MAY", "JUN", "JUL", "AUG", "SEP", "OCT", "NOV", "DEC"];
let dayMo = day + "-" + months[toDt.getMonth()];
$('.uploadNewDocsTbl p.screen-reader-legend').each(function(){
$(this).remove();
});
//write reformatted date to RecDt Reformat column
$(this).closest('tr').find('td:eq(5) input').val(newFormat).change();
//write reformatted date to Rec Dt-Mo column
$(this).closest('tr').find('td:eq(6) input').val(dayMo).change();
});
I really couldn't find much on the internet, so I am bringing it up here.
My workaround was to remove the <p> element containing the message on change of the above 'Receipt Date' drop-down field. With that, the reformatted dates appear as variable when the form is submitted. This is more of a workaround than a solution on an error message I don't understand.
Anyone ever see something like this before?
Thank you in advance