Question

我是 jquery 的新手。我想将变量的值从 JQuery 函数传输到模态。变量名是applicationName。下面是我的 jquery 代码和 mu 模态代码。

<script>
    $("#btnLink").click(function () {
        var applicationName = $(this).closest("tr").find("td").eq(0).text();

        $('#ModalPopUp').modal('show');
    })
</script>

和模态代码：

div class="modal fade" id="ModalPopUp" role="dialog">
    <div class="modal-dialog err-pop" style="">
        <div class="modal-content">
            <div class="modal-header">
                <button id="DivClose" type="button" class="close" data-dismiss="modal">&times;</button>
                <h3 class="modal-title" id="exampleModalLabel">Attachment List</h3>
            </div>
            <div class="modal-body" style="text-align:center;">
                <table>
                    <tr>
                        <th>File Name</th>
                        <th>File Size</th>
                        <th>Attachment Type</th>
                        <th colspan="2" style="text-align:center">Action</th>
                    </tr>
                    @foreach (var app in Model)
                    {
                        foreach (var data in app.FileData)
                        {
                            if (data.ApplicationId == app.ApplicationId)
                            {
                                <tr>
                                    <td>@data.Name</td>
                                    <td>@data.Size</td>
                                    <td>@data.AttachmentType.Description</td>
                                    <td>
                                        @Html.ActionLink("Download", "DownloadAttachment", "Application", routeValues: new { id = data.Id }, htmlAttributes: new { @class = "btn btn-small" })
                                    </td>
                                </tr>
                            }
                        }
                    }
                </table>
            </div>
        </div>
    </div>
</div>

Answer 1

你不能在服务端代码中使用applicationName，但你可以在js中使用foreach，并在foreach中更改tr。这是一个演示：

查看（TestApplicationName.cshtml）：

<button id="btnLink">btnLink</button>
<div class="modal fade" id="ModalPopUp" role="dialog">
<div class="modal-dialog err-pop" style="">
    <div class="modal-content">
        <div class="modal-header">
            <button id="DivClose" type="button" class="close" data-dismiss="modal">&times;</button>
            <h3 class="modal-title" id="exampleModalLabel">Attachment List</h3>
        </div>
        <div class="modal-body" style="text-align:center;">
            <table>
                <thead>
                    <tr>
                        <th>File Name</th>
                        <th>File Size</th>
                        <th>Attachment Type</th>
                        <th colspan="2" style="text-align:center">Action</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach (var app in Model)
                    {
                        foreach (var data in app.FileData)
                        {
                            if (data.ApplicationId == app.ApplicationId)
                            {
                                <tr>
                                    <td>@data.Name</td>
                                    <td>@data.Size</td>
                                    <td>@data.AttachmentType.Description</td>
                                    <td>
                                        @Html.ActionLink("Download", "DownloadAttachment", "Application", routeValues: new { id = data.Id }, htmlAttributes: new { @class = "btn btn-small" })
                                    </td>
                                </tr>
                            }
                        }
                    }
                </tbody>
            </table>
        </div>
    </div>
</div>
    </div>
<script>

            $("#btnLink").click(function () {
                //var applicationName = $(this).closest("tr").find("td").eq(0).text();
                var applicationName = "f21";
                $("tbody tr").each(function (index, data) {
                    if (data.cells[0].innerText != applicationName) {
                        data.remove();
                    }
                })
             

            })
    </script>

型号：

public class App
    {
        public List<FileData> FileData { get; set; }
        public int ApplicationId { get; set; }

    }
    public class FileData {
        public int ApplicationId { get; set; }
        public int Id { get; set; }

        public string Name { get; set; }

        public string Size { get; set; }

        public AttachmentType AttachmentType { get; set; }


    }
    public class AttachmentType {
        public string Description { get; set; }
    }

控制器：

public IActionResult TestApplicationName()
        {
            List<App> l = new List<App> {
            new App{  ApplicationId=1, FileData=new List<FileData>{ new FileData {  ApplicationId=1, Id=11, AttachmentType=new AttachmentType {  Description="dsds"},  Name="f11", Size="2"} } },
            new App{  ApplicationId=2, FileData=new List<FileData>{ new FileData {  ApplicationId=2, Id=21, AttachmentType=new AttachmentType {  Description="dsdds"},  Name="f21", Size="2"},new FileData {  ApplicationId=2, Id=22, AttachmentType=new AttachmentType {  Description="dsgterbdds"},  Name="f22", Size="2"} }, },
            new App{  ApplicationId=3, FileData=new List<FileData>{ new FileData {  ApplicationId=3, Id=31, AttachmentType=new AttachmentType {  Description="dggsds"},  Name="f31", Size="2"} } },

            };
            return View(l);
        }

结果：

如何将jquery函数内的变量值传递给模态？

1 个答案: