how to get id value from bootstrap 4 dropdown from table row? - php

Question

PHP Code:
<td>
<div class="dropdown">
<button class="btn btn-warning dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
More
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton" id="demolist">
<a class="dropdown-item " id="achieve" value="<?php echo $value['user_login_id'] ?>">Achivements</a>
<a class="dropdown-item" id="skill" value="<?php echo $value['user_login_id'] ?>">Skills</a>
<!--
<a class="dropdown-item">Remove</a>
<a class="dropdown-item">View Applicant</a>
-->
</div>
</div>
</td>
Here I have a dropdown button in each row where each dropdown has a list of achievements / skills. When clicking an achievement or skill I want to pass that row's id to ajax.
How should I send with ajax?

Answer 1

Using this method you can easily get the dropdown value:
Pass the id or class by using the .value method.
var submitForm = function() {
var name = document.querySelector('.name').value;
console.log(name);
}
document.querySelector('.btn').addEventListener('click', submitForm);
<input type="text" placeholder="name" class="name"><button class="btn" value="submit">Submit</button>

Answer 2

I have solution like this code i think you enough smart to understand it but let me know if you cant get it.
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton" id="demolist">
<a class="dropdown-item achivementClass" id="achieve" value="value1">Achivements</a>
<a class="dropdown-item" id="skill" >Skills</a>
<a class="dropdown-item">Remove</a>
<a class="dropdown-item">View Applicant</a>
</div>
This your script code
<script>
$(function() {
$('.achivementClass').click(function(){
id =$(this).attr('value');
console.log(id);
});
});
</script>