使用AJAX的Jquery循环，循环通过bootstrap模式

Question

我从数据库获取数据，通过它循环并附加到html页面中的div。它一直工作，直到我循环槽功能包含 bootstrap MODAL。我将参数传递给函数，但创建的每个MODAL都显示我的database table的第一行。我的目标是循环通过我的function(MODAL)并传递我的表的不同行，而不仅仅是第一行。

可以使用我的HTML

var table = {
        createTable: function(result) {
            $.each(result, function(i, column) {
                    $("#loopRows").append(
                        '<tr id="post"><td>' + column.ID + '</td>' +
                        '<td>' + column.Title + '</td>' +
                        '<td><button type="button" class="btn btn-primary" data-toggle="modal" data-target="#details">Details</button>+showBookmark.showItemTemplate(column.Title, column.Url, column.User)+</td>'
                    });
            }
        }

AJAX请求

$(document).ready(function() {
    $.ajax({
        type: "GET",
        url: 'http://localhost:62795/api/bookmarks',
        success: function(result) {
            table.createTable(result);
        }
    });
});

带HTML格式的BOOTSTRAP模式

var showBookmark = {
    showItemTemplate: function(title, url, user) {
        return '<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel"   id="details">' +
            '<label for="recipient-name" class="control-label">   Title:' + title + '</label>' +
            '<label for="message-text" class="control-label">   Url:' + url + '</label>' +
            '<label for="message-text" class="control-label">   User:' + user + '</label>' +
            '</div>'
    }
}