Question

I have the following code:

<div id="DivPassword" title="test" > 

I want to change the div title and I have the following code:

 function ChangeAttribute() {
         $("#DivPassword")
            .attr('title', 'Photo by Kelly Clark');
         $('#DivPassword').dialog('open');
         return false;
     }

When the dialog is opened, the title is still test! if I don’t assign any title to the div, the dialog doesn’t show any title. How can I correct that?

---

 function ChangeAttribute() {
         $("#DivPassword")
            .attr('title', 'Photo by Kelly Clark')
            .dialog('open');

         alert($("#DivPassword").attr('title'));
     }

$('#DivPassword').dialog({
             autoOpen: false,
             width: 800,
             buttons: {
                 "Cancel": function() {
                     $(this).dialog("close");
                 },
                 "Accept": function() {
                 alert($(this).attr('title'));
                     $(this).dialog("close");
                 }
             }
         });

---

 <script type="text/javascript">
     var Dtitle;
     $(function() {
        $('#DivPassword').dialog({

             autoOpen: false,
             width: 800,
             title : Dtitle,
             buttons: {
                 "Cancel": function() {
                     $(this).dialog("close");
                 },
                 "Accept": function() {
                     $(this).dialog("close");
                 }
             }
         });
     });

     function ChangeAttribute(name) {
         $("#DivPassword")
            .attr('title', name)
            .dialog('open');
         Dtitle = $("#DivPassword").attr('title');
         alert(Dtitle);
     }


</script>

Answer 1

Thanks for all the answers.

The $('#DivPassword').dialog({ had to be after .dialog('open');

The simplest way was to do as follows:

 $("#DivPassword")
            .dialog('open');
         $('#DivPassword').dialog({
             autoOpen: false,
             title: $('#DivPassword').attr('title') + name,
             width: 400,
             buttons: {
                 "Cancel": function() {
                     $(this).dialog("close");
                 },
                 "Accept": function() {
                     $(this).dialog("close");
                 }
             }
         });