通过特定的表ID值以从模态AJAX请求

Question

我有我正在从一个组移动目录到另一个AJAX请求。从本质上讲，这一切确实是一个表更新一行。我的问题是，我不从模式发送请求，并在这一点上我不知道怎么知道该请求发送该行的表（目录编号）。是什么造成了我一个问题是，我的模式是我foreach循环并在那儿显示每个目录运行之外。

我已经尝试了一些不同的东西，比如目录ID附加到模式的数据，然后抓住一次模态显示（这就是我下面尝试过），但我还是参数来通过空。我有一个后端控制器的方法，没有任何问题存在，我只是如何正确的目录编号传递到通话中挣扎。下面是一些代码：

资金：

<div id="frmMoveCatalog" class="modal" tabindex="-1" role="dialog" aria-labelledby="frmMoveCatalog" aria-hidden="true">
                <div class="modal-dialog modal-sm modal-dialog-centered" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <h3 class="modal-title" style="text-align:center" id="frmCatalogLabel">Move Catalog to Group</h3>
                        </div>
                        <div class="modal-body">
                            <div class="container-fluid form-group">
                                <label for="txtGroupName" class="control-label">Current Group: @Model.Group.Name</label>
                                <br />
                                <label for="txtGroupCode" class="control-label">Select new group:</label>
                                @Html.DropDownList("txtGroupID",
                                    lGroupCodes,
                                    "Select Group",
                                    new { @class = "form-control" })
                            </div>
                            <div class="container-fluid form-group">
                                <input class="btn btn-primary text-right pull-right btn-move-catalog" type="button" value="Move" />
                            </div>
                        </div>
                    </div>
                </div>
            </div>

HTML / C＃.NET表：

@foreach (var lCatalogVersion in Model.LatestCatalogVersions)
                {
                    <tr>
                        <td>
                            <div class="dropdown">
                                <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">
                                    <span class="fa-chevron-down"></span>
                                </button>
                                <ul class="dropdown-menu">
                                    @if (!lCatalogVersion.IsPublished)
                                    {
                                        <li><a href="#">Activate Version</a></li>
                                    }
                                    <li><a href="#">Items</a></li>
                                    <li><a href="#">Products</a></li>
                                    @if (lCatalogVersion.IsPublished)
                                    {
                                        <li><a href="@Url.Content($"~/Catalog/{lCatalogVersion.Guid}/Copy")">Copy to New Version</a></li>
                                    }
                                    <li><a class="fa-folder pointer" data-target="#frmMoveCatalog" data-toggle="modal" data-original-title="move this catalog to a new group" data-catalogid="@lCatalogVersion.CatalogID">Move Catalog to New Group</a></li>
                                </ul>
                            </div>
                        </td>
                        <td>
                            <a href="@Url.Content($"~/Catalog/{lCatalogVersion.Guid}")">@lCatalogVersion.Code</a>
                        </td>
                        <td>
                            @lCatalogVersion.Guid.ToString()
                        </td>
                        <td>
                            <a href="@Url.Content($"~/Catalog/{lCatalogVersion.Guid}")">@lCatalogVersion.GetName(Steelcase.Application.EBusiness.CatalogBuilder.DataModel.MetaData.LanguageEnum.English)</a>
                        </td>
                        <td>
                            @lCatalogVersion.GetDescription(Steelcase.Application.EBusiness.CatalogBuilder.DataModel.MetaData.LanguageEnum.English)
                        </td>
                        <td data-sort="@lCatalogVersion.VersionNumber.SortableVersionNumber()">
                            @if (lCatalogVersion.Status == CatalogVersion.CatalogVersionStatusEnum.Active)
                            {
                                <a href="@Url.Content($"~/Catalog/{lCatalogVersion.Guid}/Version")">@lCatalogVersion.VersionNumber.ToString()</a>
                            }
                            else
                            {
                                var lVersion = Model.ActiveCatalogVersions.FirstOrDefault(x => x.Code == lCatalogVersion.Code);
                                if (lVersion != null)
                                {
                                    <a href="@Url.Content($"~/Catalog/{lVersion.Guid}/Version")">@lVersion.VersionNumber.ToString()</a>
                                }
                                else
                                {
                                    <text>N/A</text>
                                }
                            }
                        </td>
                        <td data-sort="@lCatalogVersion.VersionNumber.SortableVersionNumber()">
                            <a href="@Url.Content($"~/Catalog/{lCatalogVersion.Guid}/Version")">@lCatalogVersion.VersionNumber.ToString()</a> (@lCatalogVersion.Status.ToString())
                        </td>
                        <td>
                            @if (lAllCatalogTags.ContainsKey(lCatalogVersion.ID))
                            {
                                foreach (TagValue lTag in lAllCatalogTags[lCatalogVersion.ID])
                                {
                                    <span class="label label-default">@lTag.Value</span>
                                }
                            }
                        </td>
                    </tr>
                }

AJAX代码/电话：

$(function () {
        var $container = $('#div-@lGuid');
        var moveGroupModal = $container.find('#frmMoveCatalog');
        moveGroupModal.on('show.bs.modal', function (event) {
            var pCatalogID = $(event.relatedTarget).data('val');
            moveGroupModal.data('pCatalogID', pCatalogID);
        });

        var btnMoveCatalog = $container.find('.btn-move-catalog');
            btnMoveCatalog.click(function () {
            var form = new FormData();
            form.append("pGroupID", $container.find('#txtGroupID').val());
            form.append("pCatalogID", $('#moveGroupModal').data('pCatalogID'));

            $.post({
                url: '@Url.Content("~/Group/" + Model.Group.Guid + "/MoveCatalog")',
                contentType: false,
                processData: false,
                data: form,
                success: function (data) {
                        if (data.error) {
                            //Show error
                            scs.site.alert('Error', data.message);
                        } else {
                        $('#frmMoveCatalog').modal('hide');
                        $("#catalog-list").html(data);
                        }
                    },
                error: function (textStatus, errorThrown) { scs.site.alert('Error', textStatus + ':' + errorThrown); },
                cache: false
            });
        });
    });

任何帮助深表感谢！

Answer 1

我可以用下面来解决这个问题：

moveGroupModal.on('show.bs.modal', function (event) {
            pCatalogID = $(event.relatedTarget).attr('data-catalogid');
        });

然后我用pCatalogID在AJAX调用我的变量传递到窗体。所述$(event.relatedtarget)返回其元件进入或退出的模态。