Modal Population Only Correct First Time

[Adamhumbug]

<a id="callDeleteUserConf" class="btn btn-danger" data-toggle="modal" data-userid="8" data-activesheets="" href="#userDeleteConfirmationModal" data-firstname="First Name" data-lastname="Last Name">

Yes its the right thing

Edited January 13, 2020 by Adamhumbug

[requinix]

So to be absolutely clear, your code is

var button2 = $(event.relatedTarget)
console.log(button2[0]);
console.log(button2.data('userid'))
console.log(event.relatedTarget)

and the first and third outputs show two different elements?

[Adamhumbug]

16 hours ago, requinix said:

So to be absolutely clear, your code is

var button2 = $(event.relatedTarget)
console.log(button2[0]);
console.log(button2.data('userid'))
console.log(event.relatedTarget)

and the first and third outputs show two different elements?

So i copied what you have above directly into my code and have selected one user, backed out and selected another, here are the console logs that i get.

My code to show second modal

$('#userDeleteConfirmationModal').on('show.bs.modal', function(event) {
		// Button that triggered the modal
		var button2 = $(event.relatedTarget)
		console.log(button2[0]);
		console.log(button2.data('userid'))
		console.log(event.relatedTarget)
		//data elements
		var userid = button2.data('userid')
		var firstname = button2.data('firstname')
		var lastname = button2.data('lastname')
		var activesheets = button2.data('activesheets').split(", ").join("<br/>")
		var modal = $(this)
		modal.find('#deleteUserConfLabel').text(firstname + ' ' + lastname)
		modal.find('#active-sheets-label').text('This user has the following active sheets')
		modal.find('#active-sheets').html(activesheets)
		modal.find('#staffMemberId').val(userid)


		});

First Try

first modalhttps://adamhumbug.co.uk/user-list.php#userModal

2

<a id="callDeleteUserConf" class="btn btn-danger" data-toggle="modal" data-userid="2" data-activesheets="A new event, Chelsea's Event" href="#userDeleteConfirmationModal" data-firstname="Chelsea" data-lastname="Hockley">

2

<a id="callDeleteUserConf" class="btn btn-danger" data-toggle="modal" data-userid="2" data-activesheets="A new event, Chelsea's Event" href="#userDeleteConfirmationModal" data-firstname="Chelsea" data-lastname="Hockley">

Second Try

first modalhttps://adamhumbug.co.uk/user-list.php#userModal

8

<a id="callDeleteUserConf" class="btn btn-danger" data-toggle="modal" data-userid="8" data-activesheets="" href="#userDeleteConfirmationModal" data-firstname="First Name" data-lastname="Last Name">

2

<a id="callDeleteUserConf" class="btn btn-danger" data-toggle="modal" data-userid="8" data-activesheets="" href="#userDeleteConfirmationModal" data-firstname="First Name" data-lastname="Last Name">

[requinix]

...ah.

IDs need to be unique on the page. Get rid of the one you have there and apply your event handler using some other selector.