同步回调 - 阻止与GCD队列(Synchronization callbacks - block vs GCD queue)

 我会选择： 
 
 
 
 在左侧创建包含较小列表空间的页面，在右侧创建人员列表。 
 
 
 使用以下内容在表格中显示带分页的人： 
 
<table id="people">
    <tr>
        <td id="<?php echo $person['id']; ?>"><?php echo $person['name']; ?></td>
    </tr>
</table>
 
 当有人点击tr时，javascript代码被执行以发送带有id的人的帖子请求。 负责处理的PHP文件将id存储在$_SESSION['selectedPeople']数组中，如果存在则将其从那里删除。 此外，当您单击td时，将切换.selected类，并更新左侧所选人员列表（例如，通过从PHP文件获取JSON并将其处理以显示在表中）。 
 
 
 
 你可以随时按提交。 它会： 
 
 
 a）带你到另一页并提交列表（你有$_SESSION['selectedPeople']变量）b）发送一个ajax调用页面，它将处理$_SESSION['selectedPeople'] 
 
 一些代码： 
 
 selectHandler.php： 
 
<?php
if($_POST && isset($_POST['id'])) {
    $id = (int)$_POST['id'];
    $action = '';
    session_start();
    if(!isset($_SESSION['selectedPeople'])) {
        $_SESSION['selectedPeople'] = array($id);
        $action = 'added';
    } else {
        if(in_array($id, $_SESSION['selectedPeople'])) {
            $_SESSION['selectedPeople'] = array_diff($my_array, array($id));
            $action = 'removed';
        } else {
            $_SESSION['selectedPeople'][] = $id;
            $action = 'added';
        }
    }
    echo json_encode(array('action' => $action));
}
?>
 
 Javascript（+ JQuery ）： 
 
$(function () {
    $('#people tr').click(function () {
        var id = $(this).children('td[id]').attr('id');
        $.post("selectHandler.php", { id: id })
            .done(function( data ) {
                if(data.action == "added") {
                    $(this).addClass('selected');
                } else if(data.action == "removed") {
                    $(this).removeClass('selected');
                } else {
                    alert('Some kind of error.');
                }
            }, "json");
        refreshSelectedList();
    });
});
 
 我希望你明白这个主意。 

I would go with:
 
 
 
Create page with space for smaller list on the left and list of people on the right.
 
 
Display people, with pagination, in table using something like this:
 
<table id="people">
    <tr>
        <td id="<?php echo $person['id']; ?>"><?php echo $person['name']; ?></td>
    </tr>
</table>
 
When someone clicks on tr javascript code is executed to send post request with id the person. PHP file responsible for handling this stores the id in the $_SESSION['selectedPeople'] array or removes it from there if it is present. Also, when you click on td, .selected class is toggled and list of selected people on the left side is updated(for example, via getting JSON from PHP file and processing it to display in the table). 
 
 
 
you can press submit at any time. It would:
 
 
a) take you to the other page and submit the list(you have $_SESSION['selectedPeople'] variable) b) send an ajax call to page which will process $_SESSION['selectedPeople']
 
Some code:
 
selectHandler.php:
 
<?php
if($_POST && isset($_POST['id'])) {
    $id = (int)$_POST['id'];
    $action = '';
    session_start();
    if(!isset($_SESSION['selectedPeople'])) {
        $_SESSION['selectedPeople'] = array($id);
        $action = 'added';
    } else {
        if(in_array($id, $_SESSION['selectedPeople'])) {
            $_SESSION['selectedPeople'] = array_diff($my_array, array($id));
            $action = 'removed';
        } else {
            $_SESSION['selectedPeople'][] = $id;
            $action = 'added';
        }
    }
    echo json_encode(array('action' => $action));
}
?>
 
Javascript(+JQuery):
 
$(function () {
    $('#people tr').click(function () {
        var id = $(this).children('td[id]').attr('id');
        $.post("selectHandler.php", { id: id })
            .done(function( data ) {
                if(data.action == "added") {
                    $(this).addClass('selected');
                } else if(data.action == "removed") {
                    $(this).removeClass('selected');
                } else {
                    alert('Some kind of error.');
                }
            }, "json");
        refreshSelectedList();
    });
});
 
I hope you get the idea.