Jquery and Coldfusion Loops
If you are calling a mod开发者_运维知识库al dialog box in jquery, but have the image file location in an array, how would you call this dialog box where if they clicked the link, the image would pop up? Right now, because of a loop it is obviously only using the last file name.
function showDialog(){
$("#image_viewer").html('<iframe id="modalIframeId" width="100%" height="100%" marginWidth="0" marginHeight="0" frameBorder="0" scrolling="auto" />').dialog("open");
$("#modalIframeId").attr("src","image_view.cfm");
return false;
}
$(document).ready(function() {
$("#image_viewer").dialog({
autoOpen: false,
modal: true,
height: 800,
width: 600
});
});
You're trying to use an iframe as a modal dialog, you should just use a DIV.
<!--- HTML ---> <div id="imageDialog" class="dialog" style="display:none;"></div>
Then you can output a list of links to your images like this:
<!--- CFML ---> <cfoutput query="qImages"> <a href="#qImages.url#" class="image">#qImages.label#</a><br /> </cfoutput>
Finally, you can open the URL for the image directly into the modal dialog using a bit of class trickery.
<!--- jQuery ---> $(document).ready(function(){ $('.dialog').dialog( { autoOpen: false, modal: true, width: 440, height: 330, title: "Image Viewer" } ); $('a.image').click(function(e){ $('#imageDialog').load( $(this).attr('href') ).dialog("open"); e.preventDefault(); }); });
精彩评论