Javascript : update input value via ajax on modal shown

I have a modal which I show it on an element click. So I want to update an input value in this modal via Ajax, I can retrieve data successfully but it doesn't update its value normally (get a value of an other article record not the current articleID), here my code :

$('#editArticle').on('show.bs.modal', function (e) {
    ...
    $articleID =  $(e.relatedTarget).attr('data-id');
    $.ajax({
            type: "POST",
            headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
            url : 'article/'+ $articleID +'/getData',                
            dataType : "json",
            success : function(data){                    
                document.getElementById("serial").value = data['serial'];
            }
    });  
});

Records are listed in datatable : What's the mistake ?!

via Chebli Mohamed