Question

我遇到的问题是我的jQueryUI对话框没有，右上角有“x”图标。这个stackO帖子

建议jQueryUi.js引用在Bootstrap的

之前

Literally, swap the two so that instead of:

<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="js/bootstrap.min.js"></script>
it becomes

<script src="js/bootstrap.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

这就是我的开始：

    public class BundleConfig
    {
        public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                        "~/Scripts/jquery.validate*",
                        "~/Scripts/jquery.unobtrusive-ajax.min.js"));

            bundles.Add(new ScriptBundle("~/bundles/jquery-ui").Include(
                        "~/Scripts/jquery-ui-{version}.js"));

            // Use the development version of Modernizr to develop with and learn from. Then, when you're
            // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/Scripts/modernizr-*"));

            bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                      "~/Scripts/bootstrap.js",
                      "~/Scripts/respond.js"));

            bundles.Add(new StyleBundle("~/Content/css").Include(
                      "~/Content/bootstrap.css",
                      "~/Content/site.css"));            
        }
}

HTML横截面：

    </body>         
        @Scripts.Render("~/bundles/modernizr")
        @Scripts.Render("~/bundles/jquery")
        @Scripts.Render("~/bundles/jquery-ui")
        @Scripts.Render("~/bundles/jqueryval")
        @Scripts.Render("~/bundles/bootstrap")

        @RenderSection("scripts", required: false)

    </body>

我按如下方式修改了HTML，

</body>         
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")
    @Scripts.Render("~/bundles/jquery-ui")
    @Scripts.Render("~/bundles/jqueryval")

    @RenderSection("scripts", required: false)

</body>

虽然X已添加到对话框中，但“关闭”文本也会出现在右上角的按钮上，而不会保留在其中。对话框上的2个按钮，确定和取消，也没有填充。

我正在显示它：

function ConfirmDelete(vendorId) {

    var $myDialog = $('<div></div>')
        .html('Are you sure that you want to delete State Assessment "' + vendorId + '?"')
        .dialog({
            modal: true,
            autoOpen: false,
            title: 'Delete Confirmation',
            position: {
                my: "center center",
                at: "center center",
                of: window
            },
            buttons: {
                "Cancel": function () {
                    $(this).dialog("close");
                    return false;
                },
                "OK": function () {
                    $(this).dialog("close");
                    var form = $("#Form_" + vendorId);
                    form.submit();
                    return true;
                }
            }
        }).dialog();


    $myDialog.dialog('open');
}

我的packages.config，如果重要，如下所示。

<?xml version="1.0" encoding="utf-8"?>
<packages>
  <package id="Antlr" version="3.5.0.2" targetFramework="net461" />
  <package id="bootstrap" version="3.3.7" targetFramework="net461" />
  <package id="bootstrap.TypeScript.DefinitelyTyped" version="0.9.2" targetFramework="net461" />
  <package id="Cigna.Enterprise.Services.Data.DirectoryHelper" version="3.2.0.0" targetFramework="net451" />
  <package id="elmah.corelibrary" version="1.2.2" targetFramework="net461" />
  <package id="Elmah.Mvc" version="2.1.2" targetFramework="net461" />
  <package id="EntityFramework" version="6.1.3" targetFramework="net461" />
  <package id="jQuery" version="3.1.0" targetFramework="net461" />
  <package id="jQuery.Easing" version="1.3.0.1" targetFramework="net461" />
  <package id="jquery.TypeScript.DefinitelyTyped" version="3.1.0" targetFramework="net461" />
  <package id="jQuery.UI.Combined" version="1.12.0" targetFramework="net461" />
  <package id="jQuery.Validation" version="1.15.1" targetFramework="net461" />
  <package id="jqueryui.TypeScript.DefinitelyTyped" version="1.5.1" targetFramework="net461" />
  <package id="Microsoft.AspNet.Identity.Core" version="2.2.1" targetFramework="net451" />
  <package id="Microsoft.AspNet.Identity.EntityFramework" version="2.2.1" targetFramework="net451" />
  <package id="Microsoft.AspNet.Mvc" version="5.2.3" targetFramework="net461" />
  <package id="Microsoft.AspNet.Razor" version="3.2.3" targetFramework="net461" />
  <package id="Microsoft.AspNet.Web.Optimization" version="1.1.3" targetFramework="net451" />
  <package id="Microsoft.AspNet.WebPages" version="3.2.3" targetFramework="net461" />
  <package id="Microsoft.jQuery.Unobtrusive.Ajax" version="3.2.3" targetFramework="net461" />
  <package id="Microsoft.jQuery.Unobtrusive.Validation" version="3.2.3" targetFramework="net461" />
  <package id="Microsoft.Web.Infrastructure" version="1.0.0.0" targetFramework="net451" />
  <package id="Modernizr" version="2.8.3" targetFramework="net461" />
  <package id="Newtonsoft.Json" version="9.0.1" targetFramework="net461" />
  <package id="NUnit" version="3.4.1" targetFramework="net461" />
  <package id="Respond" version="1.4.2" targetFramework="net461" />
  <package id="WebGrease" version="1.6.0" targetFramework="net461" />
</packages>

我欢迎任何有关如何解决此特定问题以及更好地订购或修改依赖关系的见解。

谢谢！

模态和常见解决方案右上角缺少jQuery UI对话框“X”图标失败

0 个答案: