Customisation doesn't work with new Knack theme

Hi folks. Knack did a customisation for me (back in the days when this was part of the service). I want to update to their new theme as I like it a lot better but my code no longer works. The code was basically to add checkboxes to a table, a link that said 'copy selected emails' which produced a popup box with the email addresses from the email field which would then be copied and pasted into and email application. Pretty clumsy but it did the job and I'd like it back. Is anyone able to tell me what needs changed with the code? I have basically zero coding knowledge. Image attached of what the feature looked like, code that works on the old theme pasted below:

$(document).bind('knack-records-render.view_2393 knack-records-render.view_1886 knack-records-render.view_1279 knack-records-render.view_1842 knack-records-render.view_1831 knack-records-render.view_1451 knack-records-render.view_1461 knack-records-render.view_1376 knack-records-render.view_1518 knack-records-render.view_1515 knack-records-render.view_1313 knack-records-render.view_1303 knack-records-render.view_1271 knack-records-render.view_1743 knack-records-render.view_1128 knack-records-render.view_1793 knack-records-render.view_1773 knack-records-render.view_2135 knack-records-render.view_52 knack-records-render.view_725 knack-records-render.view_604', function(event, view) {

var view_key = view.key;

log('handleRenderLists()!');
log(arguments);

$('.' + view_key + '.kn-table thead tr').prepend('<th><input type="checkbox"></th>');
$('.' + view_key + '.kn-table thead input').change(function() {
log('changed checkbox!, val: ' + $('.' + view_key + '.kn-table thead input').attr('checked'));
$('.' + view_key + '.kn-table tbody tr input').each(function() {
$(this).attr('checked', $('.' + view_key + '.kn-table thead input').attr('checked') != undefined);
});

});

$('.' + view_key + '.kn-table tbody tr').each(function() {
$(this).prepend('<td><input type="checkbox"></td>');
});

$('.' + view_key + ' .kn-filters-nav').show().append('&nbsp;<a href="submit" class="generate-emails">copy selected emails</a>');

$('.' + view_key + ' .generate-emails ').click(function(event) {
event.preventDefault();

var $table = $(event.currentTarget).closest();

// get emails
var emails = '';
$('.' + view_key + ' input[type=checkbox]:checked').each(function() {
var id = $(this).closest('tr').attr('id');
if (id) {

var email = Knack.models[view_key].data.get(id).get('field_110_raw');

console.log(email);

if (email) {
//var node = $(email);

emails += ',' + email.email;
}
}
});

emails = emails.substr(1);

var html = '<div style="padding: 25px;">Copy and paste these email addresses into the "To" or "Bcc" fields in your email application<br /><textarea id="dest-emails" style="width:600px; height: 200px;">' + emails + '</textarea></div>';

$.fancybox(
html,
{
'autoDimensions' : true,
'width' : 500,
'height' : 'auto',
'transitionIn' : 'none',
'transitionOut' : 'none',
}
);

$('#dest-emails').focus().select();

})

});

$(document).bind('knack-records-render.view_1731', function(event, view) {

var view_key = view.key;

log('handleRenderLists()!');
log(arguments);

$('.' + view_key + '.kn-table thead tr').prepend('<th><input type="checkbox"></th>');
$('.' + view_key + '.kn-table thead input').change(function() {
log('changed checkbox!, val: ' + $('.' + view_key + '.kn-table thead input').attr('checked'));
$('.' + view_key + '.kn-table tbody tr input').each(function() {
$(this).attr('checked', $('.' + view_key + '.kn-table thead input').attr('checked') != undefined);
});

});

$('.' + view_key + '.kn-table tbody tr').each(function() {
$(this).prepend('<td><input type="checkbox"></td>');
});

$('.' + view_key + ' .kn-filters-nav').show().append('&nbsp;<a href="submit" class="generate-emails">copy selected emails</a>');

$('.' + view_key + ' .generate-emails ').click(function(event) {
event.preventDefault();

var $table = $(event.currentTarget).closest();

// get emails
var emails = '';
$('.' + view_key + ' input[type=checkbox]:checked').each(function() {
var id = $(this).closest('tr').attr('id');
if (id) {
//var email = Knack.models[view_key].data.get(id).get('field_877_raw').email;
var email = Knack.models[view_key].data.get(id).get('field_877');
if (email) {
var node = $(email);

emails += ',' + node.html();
}
}
});

emails = emails.substr(1);

var html = '<div style="padding: 25px;">Copy and paste these email addresses into the "To" or "Bcc" fields in your email application<br /><textarea id="dest-emails" style="width:600px; height: 200px;">' + emails + '</textarea></div>';

$.fancybox(
html,
{
'autoDimensions' : true,
'width' : 500,
'height' : 'auto',
'transitionIn' : 'none',
'transitionOut' : 'none',
}
);

$('#dest-emails').focus().select();

})

});

$(document).on('knack-page-render.any', function(event, page) {

$(".kn-table-group.kn-group-level-1").each(function() {

$(".kn-table-group.kn-group-level-1 br").replaceWith(", ");
// $(this).find("<br>").replaceWith(", ");

})

});

$(document).on('knack-page-render.any', function(event,page) {
if (location.protocol != 'https:') {
location.href = 'https:' + window.location.href.substring(window.location.protocol.length);
}
});

Hi David, thanks for this. Had a bunch of deleting to do as all of the records were still in the app. All that remains are dummy records for testing.

You can create a new user if you need to test it all. The best page to test the email feature is here:

https://destinyedinburgh.knack.com/the-hub-copy#pastoral-team/

This one is slightly different I think as the email field is actually pulled from a connected record (the primary parent's email, not the child's email)

https://destinyedinburgh.knack.com/the-hub-copy#kids-home/

Let me know if you need any more info. Thanks again so much for the help.

I'd be happy to help free of charge. If your app is currently being used in production, I'd recommend creating a copy of your app by clicking the cog next to your app > Copy. To share, go to the cog next to the copied app > Share and use the email david@drtech.co.

Hi David. Thanks for the offer. To be transparent, I was hoping someone could help me free of charge, I'm hoping not to have to employ someone to help with this! If this was the basis on which you were offering, I'd be very happy to arrange this, just let me know how to add you.

Thanks a lot

PS. There's not a lot to see on the app. Currently only the checkboxes show in the tables on the app but they don't do anything except check and uncheck.

It would help if you could also show me how it looks under the new theme. Perhaps you could add me as a builder for a copy of your app?

Thanks David, I accidentally posted that heading with no content. If you have any more wisdom to share I'd appreciate it!

Yup, I'm afraid you will need to change all your customizations to work with the new HTML structure. For instance, each individual checkbox is now wrapped in a <p> with class "control".