Remove "close" word from my dialog box

lulu50
lulu50 used Ask the Experts™
on
Hi,

my dialog box has the word "close" on top right
 
how can I remove it?

Thanks,


  $(function () {
            $('#dialog').dialog({
                autoOpen: false,
                width: 800,
                height:600,
                resizable: true,
                title: 'Product',
                modal: true,
                open: function(event, ui) {
                    $(this).load("@Url.Action("RulePartialView", "CareAdvanceBusinessRules")");
                },
                buttons: {
                    "Close": function () {
                        $(this).dialog("close");
                    }
                }

            });
            $("#opener").click(function (event) {
                event.preventDefault(); 
                $("#dialog").dialog("open");
            });
        });

  <div id="dialog" title="Basic dialog"> </div>

    <a id="opener" href="@Url.Action("RulePartialView", "CareAdvanceBusinessRules")">Click to open popup window </a>

Open in new window

Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®

Author

Commented:
Maybe I should have an "x" instead of the word "close"
Paul MacDonaldDirector, Information Systems

Commented:
Remove it by eliminating lines 12-16.

Change it by editing the word "Close" on line 13.

Author

Commented:
the button close code is for my button
I want to keep it

 buttons: {
                    "Close": function () {
                        $(this).dialog("close");
                    }
                }

Open in new window


but I see the word "close" on the top right side of my dialog box that i need to remove it or change it from "close" to "x"
Exploring SQL Server 2016: Fundamentals

Learn the fundamentals of Microsoft SQL Server, a relational database management system that stores and retrieves data when requested by other software applications.

Paul MacDonaldDirector, Information Systems

Commented:
I'm no jQuery programmer, but I'm suggesting this:

 buttons: {
                    "X": function () {
                        $(this).dialog("close");
                    }
                }

Author

Commented:
Paul

that made my button "X" but what I want to  change is the top right "close" not my button

I attach a picture of my dialog box

look at the top right side where you'll see the word "close" that's what I want to change.
popup-window.png

Author

Commented:
I found a solution to it

I added this code and my "close" top right disappeared

       closeOnEscape: false,
            open: function(event, ui) { $(".ui-dialog-titlebar-close").hide(); }

Open in new window

Commented:
 $(function () {
            $('#dialog').dialog({
                autoOpen: false,
                width: 800,
                height:600,
                resizable: true,
                title: 'Product',
                modal: true,
                open: function(event, ui) {
                    $(this).load("@Url.Action("RulePartialView", "CareAdvanceBusinessRules")");
                },
                buttons: {
                    "X": function () {
                        $(this).dialog("close");
                    }
                },


                closeOnEscape: false,
            open: function(event, ui) { $(".ui-dialog-titlebar-close").hide(); }


            });
            $("#opener").click(function (event) {
                event.preventDefault(); 
                $("#dialog").dialog("open");
            });
        });

Open in new window

Paul MacDonaldDirector, Information Systems

Commented:
I'm glad you were able to solve your problem.  Sorry I couldn't be of more assistance.

Author

Commented:
Paul

Thank you for all your help:

this is what I have for the final result:

 $(function () {
            $('#dialog').dialog({
                autoOpen: false,
                width: 800,
                height:600,
                resizable: true,
                title: 'Product',
                modal: true,
                open: function(event, ui) {
                    $(this).load("@Url.Action("RulePartialView", "CareAdvanceBusinessRules")")
                    $(".ui-dialog-titlebar-close").hide();
                },
                buttons: {
                    "Close": function () {
                        $(this).dialog("close");
                    }
                },
               closeOnEscape: false,
            });
            $("#opener").click(function (event) {
                event.preventDefault();
                $("#dialog").dialog("open");
            });
        });

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial