jquery dialog title dynamically

Question

how to change jquery dialog title dynamically here is the code we are using this will show normal title but we have to update depending on the code.

<!doctype html>
<html lang="en">
 <head>
   <meta charset="utf-8">
<title>jQuery UI Dialog - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

<script>
$(function() {
  $( "#dialog" ).dialog();
 });
  </script>
 </head>
<body>

 <div id="dialog" title="Basic dialog">
     <p>This is the default dialog which is useful for displaying information.</p>
   </div>


   </body>
   </html>

stackoverflow.com/questions/14488774/… This will help u

Anup
– Anup

2013-12-23 10:44:07 +00:00
Commented Dec 23, 2013 at 10:44 — Anup
– Anup, Commented Dec 23, 2013 at 10:44

Tomanow · Accepted Answer · 2013-12-23 10:29:51Z

32

$('#dialog').attr('title', 'New Title').dialog();

OR

$( "#dialog" ).dialog({ title: "New Dialog Title" });

answered Dec 23, 2013 at 10:29

Tomanow

7,3953 gold badges30 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Arun P Johny · Accepted Answer · 2013-12-23 10:29:54Z

15

use the title option

$(function () {
    $("#dialog").dialog({
        title: 'new'
    });
});

Demo: Fiddle or Fiddle2

answered Dec 23, 2013 at 10:29

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

Comments

Kevbo · Accepted Answer · 2018-01-02 22:12:56Z

11

Neither of these worked for me. However, this did...

$("#dlg").dialog("option","title","New Title").dialog('open');

answered Jan 2, 2018 at 22:12

Kevbo

9439 silver badges12 bronze badges

Comments

Eric Aya · Accepted Answer · 2018-09-30 07:55:42Z

1

I agree with the existing answers just if you would like to add additional properties like height, weight and how the model should behave and where to call another function see below code:

     $( "#dialog-confirm" ).dialog({
    resizable: false,
    height: "auto",
    width: 400,
    modal: true,
    title: "Delete Personnel Record",
      buttons: {

        "Delete": function() {
         //-----------Calling function once Delete button is clicked----//
            RemovePersonal(PID);

          $( this ).dialog( "close" );

        },

        Cancel: function() {

          $( this ).dialog( "close" );

        }

      }

});

function RemovePersonal(id)
{
    //--------Call your function to remove record------//
    //-----------Or any other logic you want to implement---//
}

edited Sep 30, 2018 at 7:55

Eric Aya

70.2k36 gold badges190 silver badges266 bronze badges

answered Sep 30, 2018 at 4:02

MJ X

9,12413 gold badges85 silver badges124 bronze badges

Comments

Laurent Zminka · Accepted Answer · 2021-11-17 17:19:06Z

1

Like Jquery ui exemple, width var "dialog" you can use directly :

dialog.dialog({ title: "your title"});

Not need to use id div :)

answered Nov 17, 2021 at 17:19

Laurent Zminka

213 bronze badges

Collectives™ on Stack Overflow

jquery dialog title dynamically

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related