Jquery - изменение параметра добавления по клику только один раз

Question

При существующем коде путь к конечной точке данных изменяется как

data.15435.json?parameter=test
data.13588.json?parameter=test?parameter=test
data.15435.json?parameter=test?parameter=test?parameter=test

При каждом изменении добавляется параметр. Но нужно включить этот параметр только один раз.

$('a.dropdown-item').on('click', function(){
    let getDataKey = $(this).attr('data-key');
    let getEndPoint = $('.detail.component').attr('data-endpoint');
    var getEndPointVal = getEndPoint.replace(/[.0-9]*\.json/, '.' + getDataKey + '.json');
    var getEndPointValParam = getEndPointVal + '?parameter=test';
    var getJsonUrl = $('.detail.component').attr('data-endpoint', getEndPointValParam);
    let getNewDataKey = getJsonUrl;

    console.log(getJsonUrl)
}

<div class="detail component" data-endpoint="detail.json">
..
</div>


<div class="dropdown start-date">
	<button id="startdate" type="button" class="btn btn-outline-dark">List 1</button> 
	<div class="dropdown-menu">
		<a type="button" data-key="15435" class="dropdown-item">List 1</a>
		<a type="button" data-key="13588" class="dropdown-item">List 2</a>
	</div>
</div>

Answer 1

Единственный способ, которым я могу видеть, это установить data-endpoint как постоянный или постоянный. Попробуйте это:

let getEndPoint = $('.detail.component').attr('data-endpoint');

$('a.dropdown-item').on('click', function(e){
    e.preventDefault();
    let getDataKey = $(this).data('key');
    var array = getEndPoint.split('.'); //now it is an array
    var getEndPointVal = array[0] + '.' + getDataKey + '.' + array[1];
    var getEndPointValParam = getEndPointVal + '?parameter=test';
    $('.detail.component').data('endpoint', getEndPointValParam);
    var getJsonUrl = $('.detail.component').data('endpoint');

    console.log(getJsonUrl);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="detail component" data-endpoint="detail.json">
</div>


<a href="#" data-key="15435" class="dropdown-item">List 1</a>
<a href="#" data-key="13588" class="dropdown-item">List 2</a>