简体   繁体   English

在数据表中显示数据以供登录用户

[英]Display Data In DataTable For Logged In User

I have been trying to research this for a while now, but haven't been able to find a good example to check out. 我已经尝试研究了一段时间,但是还没有找到一个好的例子来进行检验。 What I would like to accomplish is to have my DataTable display only data relevant to the user that is currently logged in (and then have an admin account that can see everything). 我要完成的工作是让DataTable仅显示与当前登录用户相关的数据(然后拥有一个可以查看所有内容的管理员帐户)。 I am using ASP.Net MVC 5 with Windows Authentication which doesn't have a traditional login screen built into it (it just does that quick check and logs in the user). 我正在使用带有Windows身份验证的ASP.Net MVC 5,它没有内置的传统登录屏幕(它只是进行快速检查并登录用户)。 The application is connected to an SQL database. 该应用程序已连接到SQL数据库。 The way that I would have done it in the past is have the user log in using a login screen, store their information into a session variable, and then work off of that. 我过去做的方式是让用户使用登录屏幕登录,将其信息存储到会话变量中,然后进行处理。 Is something similar to that possible with DataTables? 与DataTables类似吗?

Here is my html: 这是我的html:

<head>    
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/r/dt/jszip-2.5.0,dt-1.10.9,b-1.0.3,b-flash-1.0.3,b-html5-1.0.3/datatables.min.css" />
    <link rel="stylesheet" type="text/css" href="~/Content/dataTables.bootstrap.css" /> 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
    <link rel="stylesheet" href="/resources/demos/style.css"> 

    <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script> 
    <script type="text/javascript" src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script> 
    <script type="text/javascript" src="https://cdn.datatables.net/buttons/1.5.2/js/dataTables.buttons.min.js"></script> 
    <script type="text/javascript" src="https://cdn.datatables.net/buttons/1.5.2/js/buttons.html5.min.js"></script> 
    <script type="text/javascript" src="https://cdn.datatables.net/buttons/1.5.2/js/buttons.print.min.js"></script> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.min.js"></script> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script> 
</head>

<table border="0" cellspacing="5" cellpadding="5">
    <tbody>
        <tr>
            <td style="margin: 10px; padding: 5px;">Start Date:</td>
            <td><input name="min" id="min" type="text"></td>
        </tr>
        <tr>
            <td style="margin: 10px; padding: 5px;">End Date:</td>
            <td><input name="max" id="max" type="text"></td>
        </tr>
    </tbody>
</table>

<table width="100%" class="display" id="reportTable" cellspacing="0">
        <thead>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Age</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </thead>
        <tfoot>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Age</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </tfoot>
        <tbody>
            <tr>
                <td>Tiger Nixon</td>
                <td>System Architect</td>
                <td>Edinburgh</td>
                <td>61</td>
                <td>2011/04/25</td>
                <td>$320,800</td>
            </tr>
            <tr>
                <td>Garrett Winters</td>
                <td>Accountant</td>
                <td>Tokyo</td>
                <td>63</td>
                <td>2011/07/25</td>
                <td>$170,750</td>
            </tr>
            <tr>
                <td>Ashton Cox</td>
                <td>Junior Technical Author</td>
                <td>San Francisco</td>
                <td>66</td>
                <td>2009/01/12</td>
                <td>$86,000</td>
            </tr>
            <tr>
                <td>Cedric Kelly</td>
                <td>Senior Javascript Developer</td>
                <td>Edinburgh</td>
                <td>22</td>
                <td>2012/03/29</td>
                <td>$433,060</td>
            </tr>
            <tr>
                <td>Airi Satou</td>
                <td>Accountant</td>
                <td>Tokyo</td>
                <td>33</td>
                <td>2008/11/28</td>
                <td>$162,700</td>
            </tr>
            <tr>
                <td>Brielle Williamson</td>
                <td>Integration Specialist</td>
                <td>New York</td>
                <td>61</td>
                <td>2012/12/02</td>
                <td>$372,000</td>
            </tr>
            <tr>
                <td>Herrod Chandler</td>
                <td>Sales Assistant</td>
                <td>San Francisco</td>
                <td>59</td>
                <td>2012/08/06</td>
                <td>$137,500</td>
            </tr>
            <tr>
                <td>Rhona Davidson</td>
                <td>Integration Specialist</td>
                <td>Tokyo</td>
                <td>55</td>
                <td>2010/10/14</td>
                <td>$327,900</td>
            </tr>
            <tr>
                <td>Colleen Hurst</td>
                <td>Javascript Developer</td>
                <td>San Francisco</td>
                <td>39</td>
                <td>2009/09/15</td>
                <td>$205,500</td>
            </tr>
            <tr>
                <td>Sonya Frost</td>
                <td>Software Engineer</td>
                <td>Edinburgh</td>
                <td>23</td>
                <td>2008/12/13</td>
                <td>$103,600</td>
            </tr>
            <tr>
                <td>Jena Gaines</td>
                <td>Office Manager</td>
                <td>London</td>
                <td>30</td>
                <td>2008/12/19</td>
                <td>$90,560</td>
            </tr>
            <tr>
                <td>Quinn Flynn</td>
                <td>Support Lead</td>
                <td>Edinburgh</td>
                <td>22</td>
                <td>2013/03/03</td>
                <td>$342,000</td>
            </tr>
            <tr>
                <td>Charde Marshall</td>
                <td>Regional Director</td>
                <td>San Francisco</td>
                <td>36</td>
                <td>2008/10/16</td>
                <td>$470,600</td>
            </tr>
            <tr>
                <td>Haley Kennedy</td>
                <td>Senior Marketing Designer</td>
                <td>London</td>
                <td>43</td>
                <td>2012/12/18</td>
                <td>$313,500</td>
            </tr>
            <tr>
                <td>Tatyana Fitzpatrick</td>
                <td>Regional Director</td>
                <td>London</td>
                <td>19</td>
                <td>2010/03/17</td>
                <td>$385,750</td>
            </tr>
            <tr>
                <td>Michael Silva</td>
                <td>Marketing Designer</td>
                <td>London</td>
                <td>66</td>
                <td>2012/11/27</td>
                <td>$198,500</td>
            </tr>
            <tr>
                <td>Paul Byrd</td>
                <td>Chief Financial Officer (CFO)</td>
                <td>New York</td>
                <td>64</td>
                <td>2010/06/09</td>
                <td>$725,000</td>
            </tr>
            <tr>
                <td>Gloria Little</td>
                <td>Systems Administrator</td>
                <td>New York</td>
                <td>59</td>
                <td>2009/04/10</td>
                <td>$237,500</td>
            </tr>            
        </tbody>
    </table>


<script type="text/javascript" src="~/Scripts/total.js"></script>

<script type="text/javascript" src="~/Scripts/daterange.js"></script>

Here is a fiddle of my DataTable: https://jsfiddle.net/l337method/hfyo90w7/ 这是我的数据表的小提琴: https : //jsfiddle.net/l337method/hfyo90w7/

Make your DataTable populate from an AJAX source and set up your Web API to display the data that's relevant for the currently logged in user. 使数据表从AJAX源填充,并设置Web API以显示与当前登录用户相关的数据。

Create a Web API controller like this: 创建一个这样的Web API控制器:

[HttpGet]
[Route("api/employees")]
public IEnumerable<Employees> GetEmployeesByLoggedInUser()
{
  var user = User.Identity.Name;  // <-- Username of the currently logged in user.
  // get the resource by this user
  var employees = repo.GetEmployeesByUser(user); 
  return employees;
}

Then initialize your DataTable this way: 然后以这种方式初始化您的DataTable:

$.ajax({
        url: '/api/employees',
        method: 'get',
        dataType: 'json',
        success: function (data) {
            $("#yourTableId").dataTable({
                data: data,
                columns: [
                    {
                        data: 'name'
                    },
                    {
                        data: 'position'
                    },
                    {
                        data: 'office'
                    },
                    {
                        data: 'age'
                    },
                    {
                        data: 'salary'
                    }]
            });

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM