Fatal编程技术网
  • javascript/
  • Javascript 将数据表追加到SweetAlert中的Div

Javascript 将数据表追加到SweetAlert中的Div

javascript asp.net-mvc

Javascript 将数据表追加到SweetAlert中的Div,javascript,asp.net-mvc,sweetalert,Javascript,Asp.net Mvc,Sweetalert,我目前正在使用SweetAlert填充一个对话框，允许用户选择表中的多行，然后使用通过MVC核心映射到控制器的ajax请求保存到DB 但是，我无法在DataTable弹出之前将其填充到视图中。让它工作的最好方法是什么 下面是我的SweetAlert调用，它会触发带有TableView的弹出窗口： $('#ApplicationTable').on('change', '#enableApp', function (event) { if ($(this).is(':ch

我目前正在使用SweetAlert填充一个对话框，允许用户选择表中的多行，然后使用通过MVC核心映射到控制器的ajax请求保存到DB

但是，我无法在DataTable弹出之前将其填充到视图中。让它工作的最好方法是什么

下面是我的SweetAlert调用，它会触发带有TableView的弹出窗口：

$('#ApplicationTable').on('change', '#enableApp', function (event) {

            if ($(this).is(':checked')) {
                $.ajax({
                    url: '@Url.Action("EnableApplication")',
                    data: {
                        'AppId': this.value, 'UserId': @Model.Id },
                    type: "post",
                    cache: false,
                    success: function (status) {
                        swal({
                            title: 'Permissions',
                            content: {
                                element: 'div',
                                attributes: {
                                    id: 'searchTableWrapPermissions'
                                }
                            }
                        });
                    },
                    error: function (xhr, ajaxOptions, thrownError) {
                        swal("Error enabling app, please contact support.");
                    }
                });
其想法是创建一个带有div的弹出窗口，然后我可以将该表附加到放置在内容中的id中

OnDeviceReady我也叫它：

 $('<table id="PermissionsTable" class="searchTable table table-striped stripe row-border dataTable">< thead ><tr><th>Name</th><th>Description</th><th>Edit</th></tr></thead ></table >').appendTo('#searchTableWrapPermissions');
在我看来，这似乎是合乎逻辑的，但由于某些原因，我无法让它弹出的sweetalert视图

MVC弹出窗口： 1.步骤1：创建共享页面

_help1.cshtml

当您使用Ajax时，您可以使用JsonResult作为控制器的返回类型，而不是partialView。这样，您就不需要依赖razorengine，而是可以使用JQuery或使用从控制器返回的json的纯JavaScript将数据附加到该div。这也为您的前端提供了更多的控制。

做一件事，为数据表和ajax调用swalplugin的成功函数创建动态html

var htmlcontent ="<table></table>"
 swal({
     title: "what ever",
     text: htmlcontent,
     html: true
 });
你是说没有办法利用甜警报来实现这一功能吗？我们现在在整个网站上都使用它，所以我们不想在警报模式之间切换。胡克，我能够得到这个填充，但不幸的是我无法接受你的答案，因为它没有回答我的问题。我不是在寻找MVC核心弹出式方法。如果你仔细阅读我的问题，你会发现我正在寻找一种通过AJAX使用SweetAlert触发这些请求的解决方案。我将很快发布我的解决方案，希望它能在将来帮助其他人解决这个问题。同样，在你的CSHTML中，你在头脑中调用Javascript，并想提到这是一个非常糟糕的做法。DOM尚未建立，使用JQuery很可能返回未定义的结果。通过将此逻辑移动到标签中页面的末尾，您将获得更好的结果。当我发布完整的解决方案时，我还将发布一些扩展信息，以帮助资源了解为什么这样更好：这将有助于打开弹出窗口。在这里，我使用datatable来增强过滤技术。这不是甜蜜警报。 
<head>
function GetHelp(urlstring, id, colnm, caption) {
          $.ajax({
            type: 'get',
            url: path of controller page function,
            success: function (result) {              
                $('#ReferanceFieldID').val(id);
                $('#ReferanceColumn').val(colnm);                
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                $("#WaitingMode").hide();
                msgError("Error: " + textStatus + "," + errorThrown);
            }
        });
    }
</head>
      <body>
 <div class="col-md-4">
                    <div class="editor-field">
                        @Html.EditorFor(model => model.M_WEEK.COMPCD, new { htmlAttributes = new { @class = "form-control textbox_image", id = "COMPCD", @placeholder = "COMPCD", maxlength = 4 } })
                        <img src="~/Image/search.png" width="20px" height="20px" class="Help_image_button" title="Help" onclick="GetHelp('@Url.Action("GetCompanyDetails", PageControllerName)','COMPCD/COMPNM','1/0','Company Code')" />
                    </div>
                </div>
                <div class="col-md-11">
                    <div class="editor-field">
                        @Html.EditorFor(model => model.M_COMP.COMPNM, new { htmlAttributes = new { @class = "form-control", id = "COMPNM", @TabIndex = -1, @placeholder = "COMPNM", maxlength = 60, @readonly = "readonly" } })
                    </div>
                </div>
        <div class="container">
            <div id="helpDIV">  
  </div>
 </div>
  </body>

public string PRODGRPCD_help(ImprovarDB DB)
    {
        var query = (from c in DB.M_PRODGRP
                     join i in DB.M_CNTRL_HDR on c.M_AUTONO equals i.M_AUTONO
                     where i.INACTIVE_TAG == "N"
                     select new
                     {
                         code = c.PRODGRPCD,
                         name = c.PRODGRPNM,
                     }).ToList();
        System.Text.StringBuilder SB = new System.Text.StringBuilder();
        SB.Append("<table id='helpmnu' class='table-hover' cellpadding='3px' cellspacing='3px' width='100%'><thead style='background-color:#2965aa; color:white'><tr>");
        SB.Append("<th>Product Group Name</th><th>Product Group Code</th></tr></thead>");
        SB.Append("<tbody>");
        for (int i = 0; i <= query.Count - 1; i++)
        {
            SB.Append("<tr id='Hrow_" + i.ToString() + "' onclick='HelpRowClick(this.id)'><td>" + query[i].name + "</td><td>" + query[i].code + "</td></tr>");
        }
        SB.Append("</tbody></table>");
        return SB.ToString();
    }

 return PartialView("_Help1", PRODGRPCD_help(DB));

query = (from c in DB.M_PRODGRP
                         join i in DB.M_CNTRL_HDR on c.M_AUTONO equals i.M_AUTONO
                         where i.INACTIVE_TAG == "N"
                         select new
                         {
                             code = c.PRODGRPCD,
                             name = c.PRODGRPNM,
                         }).ToList();

var htmlcontent ="<table></table>"
 swal({
     title: "what ever",
     text: htmlcontent,
     html: true
 });