Is there a way to pass a dynamic title to my jquery modal dialog?

Experts,

The following script opens the dynamic URLs contained within my hyperlinks into a modal dialog.

Is there a way that we can pass the value of "title" contained within my hyperlink URLs to the modal dialog?

In the example below, the title imparted to the modal dialog would be "Title100" and "Title101" respective to each dynamic link.

<head>
<script>
$(function() {         
      $(".modal_link").click(function(e) {
            e.preventDefault();
            var url = $(this).attr("href");
            $("#dialog").load(url,null,function() {
                  $("#dialog").dialog({
                        width:700,
                        modal: true,
                        close: function(event, ui) {
                        $("#dialog").empty(); // remove the content 
                        }//END CLOSE
                  });//END DIALOG
            });//END DIALOG
      });//END MODAL_LINK
});//END FUNCTION
</script>
</head>
<body>
<!----- MODAL DIALOG DIV ----->
<div id="dialog" title=""></div>
<!----- MODAL DIALOG LINKS ----->
<a class="modal_link" href="a3_dialog_content.php?cmd=preview&id=100&title=Title100">Click here</a>
<a class="modal_link" href="a3_dialog_content.php?cmd=preview&id=101&title=Title100">Click here</a>
</body>

Open in new window

evibesmusicAsked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
leakim971Connect With a Mentor PluritechnicianCommented:
0
 
evibesmusicAuthor Commented:
@leakin971:

I put the solution into place and it works but, because the titles in the url are dynamic, they are being pulled from the DB and in many cases contain special characters which cause my script to fail.

Is is possible to pull the "title" element from each link versus the title in the URL?

This way, the URL is not tainted by possible special characters which cause my script to not work, and we still get the expected result.

Example: Pull title from each link and place that into the title of each modal dialog

<a href="?cmd=preview&id=100" title="Title100">Click Here</a>

<a href="?cmd=preview&id=101" title="Title101">Click Here</a>
0
 
evibesmusicAuthor Commented:
@leakin971:

Something link this (obviously this doesn't work but, I hope you get what I mean):

var mytitle = $(this).attr("title");
0
Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
evibesmusicAuthor Commented:
@leakin971:

I got it to work....OMG, you can teach an old dog new tricks!

Thank you for getting me very close!
0
 
evibesmusicConnect With a Mentor Author Commented:
Final code:

      <script>
      $(function() {        
              $(".modal_link").click(function(e) {
                        e.preventDefault();
                        var url = $(this).attr("href");
                    var mytitle = $(this).attr("title");
                        $("#dialog").load(url,null,function() {
                                $("#dialog").dialog({
                                      title: mytitle,
                                          width:700,
                                          modal: true,
                                          close: function(event, ui) {
                                          $("#dialog").empty(); // remove the content
                                          }//END CLOSE
                                });//END DIALOG
                        });//END DIALOG
              });//END MODAL_LINK
      });//END FUNCTION
      </script>
0
 
evibesmusicAuthor Commented:
@leakin971:

Thank you for providing me the test code. Looking at the example you provided and then, cross referrencing it with the url variable made the solution possible.

Cheers!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.