Ajax not firing when transition from Display to Edit

[smithme]

Here is a small quirk that I noticed and was wondering what you might suggest.

I am using the Ink Sketch and a photo attachment to allow users to draw on a photo. Per the online documentation, I have some Javascript that loads the list item attachment into the background of the Ink Sketch. I have noticed that when a user opens a form in Display first, then they decided to edit the form so they click the Edit button, the transition of the form from Display to Edit doesn't execute my Javascript and so the Edit form Ink Sketch no longer has the photo as the background.

Any ideas on how to make my form Javascript to fire when transitioning from the Display to the Edit form?

[Nikita Kurguzov]

Can please provide an example of the code you are using in Edit Form? We'll try to test it and see how this situation best can be handled in your particular case.

[smithme]

Here is the code. It fires if you go straight to the Edit form but if you are leaving Display to Edit, it doesn't fire. I search the page source and can't even find this code in the dom.

Code: Select all

var itemID = GetUrlKeyValue('ID');
var fileName = $('#idAttachmentsTable tr td.ms-vb').eq(0).text();
var path = $.trim('https://cityofnampaid.sharepoint.com/it/sandbox/Lists/Evidence%20Database/Attachments/' + itemID + '/' + fileName);

$('.sketch').css('background-image', 'url("' + path + '")');

$('.ink-pal').each(function (index) {
	$(this).click(function () {
		var clr = $(this).css('background-color');
		console.log(clr);
		$('.ink-pal').each(function() {
			$(this).css({
				'border-color':'#000000',
				'border-width':'1px',
				'border-style':'solid'
			});
		});
		
var signaturePad = $('.sketch').data('signaturePad');
signaturePad.penColor = clr;
		
		$(this).css({
			'border-color':'#FF0000',
			'border-width':'4px',
			'border-style':'solid'
		});
	});
});


window.blockMenuHeaderScroll = false;

$(window).on('touchstart', function(e)
{
    if ($(e.target).closest('.sketch').length == 1)
    {
        blockMenuHeaderScroll = true;
    }
});

$(window).on('touchend', function()
{
    blockMenuHeaderScroll = false;
});

$(window).on('touchmove', function(e)
{
    if (blockMenuHeaderScroll)
    {
        e.preventDefault();
    }
});

[Nikita Kurguzov]

Technically, it shouldn't happen. In both cases, Edit Form should be loaded and the code should run. Just tested it myself in SharePoint Online to make sure that it is indeed so. Can you tell me what version of SharePoint you are using? SP 2013/2016 or SP Online?

Another thing to try, you can replace all your code with this alert for now, just to see if the code runs at all or not:

Code: Select all

alert("Code works!");

[smithme]

Technically, it shouldn't happen. In both cases, Edit Form should be loaded and the code should run. Just tested it myself in SharePoint Online to make sure that it is indeed so. Can you tell me what version of SharePoint you are using? SP 2013/2016 or SP Online?

Another thing to try, you can replace all your code with this alert for now, just to see if the code runs at all or not:

Code: Select all

alert("Code works!");

I am using SP Online.

I will make a test of the code using alert and get back to you.

[smithme]

I just tested the with a simple, default list with only a Title field. The alert on the edit form did in fact execute. I am at a loss as to why my code isn't working then.