I’m dynamically generating an image tag, and the final slash for self-closing the tag is not coming through, even though the slash is escaped with a backslash. Worse, I think this is screwing up my attempt to select the image in another function. Any ideas what could be causing problems?
var closeImage = “<img style=‘float:left;’ src=‘close_x_gray.gif’ alt=‘close’ \/>”;
// Ensure all selection zones are revealed except (i.e. then hide) technology
function WriteTechnologyToMainSelection(technology) {
var mainSelectionXhtml = ‘’;
if (technology != ‘’)
{
mainSelectionXhtml = ‘<div style=“float: left;”>’ + technology + ‘</div>’ + closeImage;
}
Thanks AllanP. This is a unicode page, but I’ll try the unicode equivalents and let you know.
No. This may be something I don’t thoroughly understand about JS, but whenever I’ve written click functions with jQuery all I’ve ever needed to do is reference the proper selector (e.g. #mainSelectionRight img).
OK, I tried including escaped line breaks (i.e. carriage return / line feed) and if I try View Selection Source in FF, I can see that they are indeed causing line breaks at the appropriate places, however, I’m still missing my self-closing slash.
Next I tried, escaping the slash not with a backslash but as a unicode character like the line breaks (\u002F). All these continue to produce the same malformed image tag…
At this point I wondered if jQuery might be processing this into the same output so the tag <img blah blah blah /> looked the same whether the result was escaped or not. Therefore, I tried to write something which would process into “\/” and be read correctly (assuming that’s even correct). Therefore I escaped both slashes (\u005C\u002F). That didn’t work, though it at least produced something different…
However, I don’t believe that really an improvement. $(“#mainSelectionRight img”).click(StartTheSearch); doesn’t work in IE8, FF3.6, or O11, so I still can’t trigger the search to start over just by clicking on the close image.
Actually, the site is hosted on IIS so I don’t even need to check to know that the content-type is “text/html”. Someone once told me that’s it’s possible to get IIS to serve content as “application/xhtml+xml”, but I’ve never seen an MS server actually configured to do it. In MSland, I live where XHTML served as “text/html” is as close as you can ever get.
Is that why the content I’m creating in jQuery is incorrect?
No it’s not. The web page is of type “text/html” which is why HTML tags are being added to your page.
The whole XHTML/HTML debacle though is completely unrelated to why you’re experiencing the problem.
Here’s a quick test page that I put together, which can be played around with to confirm that the image is easily found, and that the attached event does work.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Test page</title>
</head>
<div id="mainSelectionRight">
</div>
<p>
<button onclick="WriteTechnologyToMainSelection('This technology')">This technology</button>
<button onclick="WriteTechnologyToMainSelection('That technology')">That technology</button>
</p>
<p><button onclick="getTheImage()">Get the image</button></p>
<p><button onclick="attachEventToImage()">Attach event to image</button></p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script>
var closeImage = "<img style='float:left;' src='close_x_gray.gif' alt='close' \\/>";
// Ensure all selection zones are revealed except (i.e. then hide) technology
function WriteTechnologyToMainSelection(technology) {
var mainSelectionXhtml = '';
if (technology != '') {
mainSelectionXhtml = '<div style="float: left;">' + technology + '</div>' + closeImage;
}
// $('#sideColumn').css('color', 'red');
$('#mainSelectionRight').html(mainSelectionXhtml);
}
function getTheImage() {
alert($('#mainSelectionRight img')[0]);
}
function StartTheSearch() {
alert('Search started');
}
function attachEventToImage() {
$("#mainSelectionRight img").click(StartTheSearch);
}
</script>
</head>
</html>
I had to go with a fallback functionality and only had time to circle back and resolve this issue now. Hazards of deadlines. Anyway, this was the problem. Apparently the image was being injected into the page after my run time code executed and tried to attach the event handler to it. Instead of binding to the image at run time, I had to write that into the function I was calling which created the image, then everything worked fine.
var closeImage = newLine + “<img style=\“float:left;\” src=\“close_x_gray.gif\” alt=\“close\” \/>” + newLine; // TODO // forward slash is escaped but still does not appear (try template solution??)
mainSelectionXhtml = “<div style=\“float: left;\”>Select a Technology</div>” + closeImage;
$(“#mainSelectionRight”).html(mainSelectionXhtml);
// Need to bind the event here, because the image does not exist on the page
$(“#mainSelectionRight img”).bind(“click”, StartTheSearch)
Just saw your status. Prayers and thoughts to you, your family, and your entire community. I am so saddened to hear what you’ve all gone through, Paul.
Thanks. We’re making it through, but it’s going to be a long hard battle. Power & Internet have returned to my home, which is the important thing but water and sewage could be a few weeks to go.[/ot]
I’m glad to hear that they’ve fixed the important things.
It is amazing to think what you’re all going through, Paul. Are you relying on bottled water then? Can’t think of a bloody useful thing we can do, but you should know that my family and I care. We’re praying for you and everyone as you start to rebuild and for all those who’ve lost loved ones. If there’s anything I can do, PM me. And take care; we’re so glad that it sounds like you and yours are doing all right.
Many many bottles and buckets of water. We fortunately have a source from a factory with external pipes, which is one of the official water collection sources. Most other people are going to water tankers that are spread around the city. We all still have to boil the water before use, but this factory source has no queues, tastes good, and is easy to access.
This may sound harsh, but prayers aren’t very useful to us right now. It’s like paying your landlord by giving them your love. If you gain some peace of mind for yourself though, then by all means carry on for your sake.
If you do want to help in some way, the best thing that can be done is to donate to the Red Cross appeal. They do not take administrative costs from donations towards the earthquake appeal. Every last donated dollar goes directly to funding the rescue and recovery of people from the damaged buildings, and towards helping the residents who are affected by this.[/ot]
but water and sewage could be a few weeks to go.[/ot]