Pass value to a jqmodal window

Hi there,

I would like to use jqmodal window  (
to open a window and send a message in it.
But i need that this window is create dynamically with a var.



$().ready(function() {
  $('#ex2').jqm({ajax: 'mypage.cfm?ref=DynamicVariableHereFromtheHrefinsideCfloop', trigger: 'a.ex2trigger'});

<cfloop index="Ref" from="1" to="10" step="1">
<a href="#" class="ex2trigger">#ref#</a>

Si i need that the modal get the #ref# from the href to create the modal window.

Thanks in advance

Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

I assume you are looking JQuery window to open a AJAX form?

You can use onLoad callback to do this.

var myLoad = function(hash){ $('form',hash.w).ajaxForm(); };
quarkmikeAuthor Commented:
No i need to open a CFM page on my modal window and display a message depend of the #ref# i send on this window.

So i need to get the value set inside the href (ID for exemple like this <a href="#" class="ex2trigger" id="ref#ref#">) or the valu inside the div.

Hello, i am not able to fully understand you.

But i assume that you have a CFM page that render an anchor tag with some ID.
You want that object in AJAX Modal Dialogue.
If this is true, try executing the attached code.

I have used JQuery UI v1.7.2
placed the code for testing in

Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

quarkmikeAuthor Commented:
This is great but the <a href="#" class="ex2trigger" id="MyRef">myid</a> will be on the same page that the link is.

I just need to open a modal window who contains the page 'mypage.cfm' from a href like <a href="#" id="15">Click to add to basket</a>

When you click on this link the modal window open and the mypage.cfm receive the id of the href (15).

Mypage.cfm will be like this


Sorry i'm french and sometimes it's very difficult for me to explain.

you can do it like this using jqmodal (though i do advise you to switch to using jquery UI instead):

<script type="text/javascript">
$(document).ready(function() {
  $('#ex2').jqm({ajax: '@href'});
<cfloop index="ref" from="1" to="10" step="1">
<a href="mypage.cfm?ref=#ref#" class="ex2trigger">click to add this to cart</a>
<div id="#ex2"></div>

quarkmikeAuthor Commented:
Hmmm Sorry Azadi this don't work that open a new page not a modal :/

(If you have an example to do the same think using jquery UI don't hesitate :) )
Is this the one you are looking for in UI ??

<!doctype html>
<html lang="en">
	<title>jQuery UI Dialog - Basic modal</title>
	<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
	<script type="text/javascript" src="../../jquery-1.3.2.js"></script>
	<script type="text/javascript" src="../../ui/ui.core.js"></script>
	<script type="text/javascript" src="../../ui/ui.draggable.js"></script>
	<script type="text/javascript" src="../../ui/ui.resizable.js"></script>
	<script type="text/javascript" src="../../ui/ui.dialog.js"></script>
	<script type="text/javascript" src="../../external/bgiframe/jquery.bgiframe.js"></script>
	<link type="text/css" href="../demos.css" rel="stylesheet" />
	<script type="text/javascript">
	$(function() {
			bgiframe: true,
			height: 140,
			modal: true
	<a class="ex2trigger" href="mypage.cfm?ref=#ref#">
	  Open as dialog

	<script type="text/javascript">
	$(function (){
		$('a.ex2trigger').click(function() {
			var url = $(this).attr("href");
			var dialog = $('<div style="display:hidden"></div>').appendTo('body');
					function (responseText, textStatus, XMLHttpRequest) {
			return false;

Open in new window

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
If you want Modal dialogue, change the dialogue.dialogue() to:

dialog.dialog({ modal: true });

Best Regards.
quarkmikeAuthor Commented:
Thanks a lot all for your help
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Microsoft IIS Web Server

From novice to tech pro — start learning today.