Summary - Slider does not work in SimpleModal window after more than once.
Detail: Step 1: Click to open modal window Step 2: Observe slider working properly, with value being updated, close modal Step 3: Click to open modal window Step 4: Observe slider NOT working properly, NaN being returned If you open the modal with the slider, then close the window, then re- open the modal and attempt to move the slider NaN errors occur. Attached is a simple html document that demonstrates the problem. This has also been posted to the SimpleModal google code group. Any thoughts would be greatly appreciated, thanks for all the hard work on jquery. To replicate, please cut and paste the following into a html document. <html xmlns="http://www.w3.org/1999/xhtml";> <head> <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css"; rel="stylesheet" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"; type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery- ui.min.js" type="text/javascript"></script> <script src='http://www.ericmmartin.com/simplemodal/js/jquery.simplemodal.js' type='text/javascript'></script> <script src='http://www.ericmmartin.com/simplemodal/js/basic.js' type='text/javascript'></script> <link type='text/css' href='http://www.ericmmartin.com/simplemodal/css/basic.css' rel='stylesheet' media='screen' /> <script type="text/javascript"> $().ready(function() { $('#basic-modal input.basic, #basic-modal a.basic').click(function (e) { e.preventDefault(); $('#basic-modal-content').modal(); }); $(function() { $("#slider-vertical").slider({ orientation: "vertical", range: "min", min: 50, max: 300, value: 100, slide: function(event, ui) { $("#amount").val(ui.value); } }); }); }); </script> </head> <body> <div id="basic-modal-content"> <input type="text" id="amount" style="border:0; color:#ffffff; font- weight:bold; width: 40px; background: #aaaaaa;" /> <div id="slider-vertical" style="height:200px;"></div> </div> <div id='basic-modal'> <h2>Basic Modal Dialog</h2> <form action='download/' method='post'> <input type='button' name='basic' value='Show modal' class='basic demo'/> </form> </div> </body>
