Question

我有这个排行榜： leaderboard

单击排行榜中的名称时，会显示一个弹出窗口。 popup snap

现在，我想显示弹出窗口中已点击其名称的任何人的信息。因为，您可以看到弹出窗口中不包含任何数据。

我一直在使用一个活动目录，从那里我可以获取数据，如配置文件pic和我正在维护的数据库中的其他信息。

问题是如何链接活动目录和数据库，并在点击名称时在弹出窗口中显示所需信息。请帮助

弹出窗口涉及的Javascript：

＆＃13;

$(document).ready(function() {
        $('.tab a').on('click', function(e) {
            e.preventDefault();
            var _this = $(this);
            var block = _this.attr('href');
            $(".tab").removeClass("active");
            _this.parent().addClass("active");
            $(".leadboardcontent").hide();
            $(block).fadeIn();
        });


        /**
         * Fade in the Popup
         */
        $('.leaderboard li').on('click', function () {
            $('#popup').fadeIn();
            var mark = $(this).find('name').text();
            var small = $(this).find('points').text();
            $('#popup-name').text('Name: ' + name);
            $('#popup-score').text('Score: ' + points);
        });

});

＆＃13;

对于活动目录我正在使用此变量并在任何我想要登录用户的地方回显它：

＆＃13;

<?php
$username   = $_POST['username'];
$password   = $_POST['password'];
$server = 'ldap:xxxxx';
$domain = 'xxx'
$port       = xxx;

$ldap_connection = ldap_connect($server, $port);
if (! $ldap_connection)
{
    echo '<p>LDAP SERVER CONNECTION FAILED</p>';
    exit;
}

// Help talking to AD
ldap_set_option($ldap_connection, LDAP_OPT_PROTOCOL_VERSION, 3);
ldap_set_option($ldap_connection, LDAP_OPT_REFERRALS, 0);

$ldap_bind = @ldap_bind($ldap_connection, $username.$domain, $password);

if (! $ldap_bind)
{
    echo '<p>LDAP BINDING FAILED</p>';
    exit;
}
else
{
	echo 'login successful <br/>';

}
$base_dn = "OU=Employees,OU=Accounts,OU=India,DC=asia,DC=manh,DC=com";
$filter ="(&(objectClass=user)(samaccountname=$username))";

$result = ldap_search($ldap_connection,$base_dn,$filter);

$rescount = ldap_count_entries($ldap_connection,$result);

$data = ldap_get_entries($ldap_connection,$result);

if ($data["count"] > 0)
{
for ($i=0; $i<$data["count"]; $i++)
{

if(isset($data[$i]["employeeid"][0]))
{
$user= $data[$i]["employeeid"][0];
session_start();
$_SESSION['id']=$user;
}


if (isset($data[$i]["thumbnailphoto"][0]))
{
$photo=$data[$i]["thumbnailphoto"][0];
$_SESSION['photo']=$photo;

}


if (isset($data[$i]["title"][0]))
{
$title=$data[$i]["title"][0];
$_SESSION['Employeetitle']=$title;
}


if (isset($data[$i]["department"][0]))
{
$department=$data[$i]["department"][0];
$_SESSION['Employeedepartment']=$department;
}



}
}
else
        {
            echo "<p>No results found!</p>";
        }


if(isset($_SESSION['id']))
{
echo "session set";
header('location:Profile/index.php');
}


?>

＆＃13;

Answer 1

<强>更新

使用以下代码替换代码

HTML

<li>
                                        <mark>Weekly LB</mark>
                                        <small>315</small>
                                        <input type="hidden" class="email" value="<?php echo $_SESSION['Employeetitle']; ?>">
                                        <input type="hidden" class="designation" value="<?php $_SESSION['Employeedepartment'] ?>">
                                        <input type="hidden" class="pro_pic" value="<?php echo $_SESSION['photo']; ?>">
                                    </li>

<强> JS

                            /**
                             * Fade in the Popup
                             */
                            $('.leaderboard li').on('click', function () {
                                $('#popup').fadeIn();

                                // Changes
                                var email = $(this).find('.email').val();
                                var designation = $(this).find('.designation').val();
                                var pro_pic = $(this).find('.pro_pic').val();
                                // -------------------

                                var mark = $(this).find('mark').text();
                                var small = $(this).find('small').text();

                                // Changes
                                $('#popup-email').text('Email: ' + email);
                                $('#popup-designation').text('Name: ' + designation);
                                $('.profile__image').attr("src", pro_pic);
                                // -------------------

                                $('#popup-name').text('Name: ' + mark);
                                $('#popup-score').text('Score: ' + small);
                            });

如果您对此有任何顾虑，请告诉我。

Answer 2

您的数据似乎存储在db中，您已经设法正确获取它们。因此，您可以将所有必要的信息/密钥视为html标记中的自定义属性，而不是进行ajax调用，以便可以通过JavaScript轻松获取它。即;

<li id="someid" designation="..." rmanager="..." email="...">
    <mark>Weekly LB</mark>
    <small>315</small>
</li>

并使用JQuery;

var designation = $('#someid').attr('designation');
$('#designation-field').text('Designation: ' + designation);

希望它会有所帮助。

顺便说一下，这种方法有优点和缺点; 缺点：它会增加您的列表页面大小优点：将减少客户端 - 服务器和数据库调用

Answer 3

你有没有试过这个...... 定义li元素的类如下..

<div class="leaderboard">
<ul>
   <li class="name">value</li>
   <li class="points">value</li>
</ul>
</div>

然后像这样获取值

var name= $(".leaderboard").find('.name').text();
var points= $(".leaderboard").find('.points').text();

$('#popup-name').text('Name: ' + name);
$('#popup-score').text('Score: ' + points);

在弹出窗口中显示信息

3 个答案: