Question : jquery modal confirm how to pass url

Hello Experts,

I am trying to pass a URL value using a JQuery simplemodal confirm box but cannot figure out how to pass the url. I am new to JQuery and any assistance would be greatly appreciated.

<div id='confirm'>
      <div class='header'><span>Confirm</span></div>
      <p class='message'></p>
      <div class='buttons'>
            <div class='no simplemodal-close'>No</div><div class='yes'>Yes</div>
      </div>
</div>

HTML
<li><a href='#' class='confirm'>Opportunities &raquo;</a></li>

This code works great for one hard-coded target URL but I want to place the above HTML code in all my links on the page and depending on the link pressed the simplemodal will take me to that particular URL when the user presses YES.

Kind of in a rush here to offering 500 pts. Thanks in advance!

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
/*
 * SimpleModal Confirm Modal Dialog
 * http://www.ericmmartin.com/projects/simplemodal/
 * http://code.google.com/p/simplemodal/
 *
 * Copyright (c) 2010 Eric Martin - http://ericmmartin.com
 *
 * Licensed under the MIT license:
 *   http://www.opensource.org/licenses/mit-license.php
 *
 * Revision: $Id: confirm.js 238 2010-03-11 05:56:57Z emartin24 $
 *
 */

jQuery(function ($) {
	$('#confirm-dialog input.confirm, #confirm-dialog a.confirm').click(function (e) {
		e.preventDefault();

		// example of calling the confirm function
		// you must use a callback function to perform the "yes" action
		confirm("Continue to the Educational Opportunities for Students page?", function () {
			window.location.href = 'http://www.google.com';
		});
	});
});

function confirm(message, callback) {
	$('#confirm').modal({
		closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
		position: ["20%",],
		overlayId: 'confirm-overlay',
		containerId: 'confirm-container', 
		onShow: function (dialog) {
			$('.message', dialog.data[0]).append(message);

			// if the user clicks "yes"
			$('.yes', dialog.data[0]).click(function () {
				// call the callback
				if ($.isFunction(callback)) {
					callback.apply();
				}
				// close the dialog
				$.modal.close();
			});
		}
	});
}

Answer : jquery modal confirm how to pass url

Try storing the URL in the "rel" attribute:

  • Opportunities &raquo; 

  • Opportunities2 &raquo; 


  • The amended code is below.  Now no need to use a callback (although this is more generic); just pass in the url to goto, from the "rel" attribute.
    1:
    2:
    3:
    4:
    5:
    6:
    7:
    8:
    9:
    10:
    11:
    12:
    13:
    14:
    15:
    16:
    17:
    18:
    19:
    20:
    21:
    22:
    23:
    24:
    25:
    26:
    27:
    28:
    
    jQuery(function ($) {
    	$('#confirm-dialog input.confirm, #confirm-dialog a.confirm').click(function (e) {
    		e.preventDefault();
    
    		// example of calling the confirm function
    		confirm("Continue to the Educational Opportunities for Students page?", $(this).attr('rel'));
    	});
    });
    
    function confirm(message, url) {
    	$('#confirm').modal({
    		closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
    		position: ["20%",],
    		overlayId: 'confirm-overlay',
    		containerId: 'confirm-container', 
    		onShow: function (dialog) {
    			$('.message', dialog.data[0]).append(message);
    
    			// if the user clicks "yes"
    			$('.yes', dialog.data[0]).click(function () {
    				// Goto the location
    				window.location.href = url;
    				// close the dialog
    				$.modal.close();
    			});
    		}
    	});
    }
    
    Random Solutions  
     
    programming4us programming4us