Avatar of tonelm54
tonelm54 asked on

Dynamically creating dialogue with image

Im trying to code a jQuery UI dialogue dynamically but with an image in the title, however my dialogue just shows the code instead of the image:-
image
My code is currently:-
	var tag = $("<div title='test'></div>"); //This tag will the hold the dialog content.
	tag.html("data").dialog({
		title: '<img src="refresh.png" />'
		}).dialog('open');
	});

Open in new window


According to the documentation I can just include the html code so it should work fine.

Any ideas what Im doing wrong?

Thank you
jQuery

Avatar of undefined
Last Comment
Chris Stanyon

8/22/2022 - Mon
Gary

Code works fine
http://jsfiddle.net/GaryC123/HaZ9S/106/
Apart from the extraneous });
Chris Stanyon

Not sure if this is a bug or not as I can't find any docs on it, but setting the title to an image works fine in jQueryUI version 1.9.x and less, but in version 1.10.x and above, you just get to see the raw HTML:

Here it is with jQueryUI 1.9.2 - works fine
http://jsfiddle.net/ChrisStanyon/hu62f/

Here it is with jQueryUI 1.10.3 - doesn't work
http://jsfiddle.net/ChrisStanyon/G6RUT/
Gary

This is the best money I have ever spent. I cannot not tell you how many times these folks have saved my bacon. I learn so much from the contributors.
rwheeler23
Chris Stanyon

Yeah, just found it myself - don't ya just hate it when developers sneak these changes in - noone ever reads the ChangeLogs ;)

Anyway, here some code to override the title function so it works in jQueryUI 1.10:

http://jsfiddle.net/ChrisStanyon/4YpFV/
Chris Stanyon

Alternatively, avoid the title call altogether and set the title on open:

var tag = $('<div>').attr('title', 'test');
tag.html('data').dialog({
open: function() {
    $(".ui-dialog-title").html('<img src="http://lorempixel.com/50/50" />');
}
}).dialog('open');

Open in new window

ASKER
tonelm54

Ok, the easiest way I can get it working is ChrisStanyon suggestion, however when I create multiple dialogues, all of them have the image in, is it possible (do you think) to specify a title unique to the dialogue Im creating?
Get an unlimited membership to EE for less than $4 a week.
Unlimited question asking, solutions, articles and more.
ASKER CERTIFIED SOLUTION
Chris Stanyon

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
See how we're fighting big data
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question