Foren / Cotonti / Extensions / Support / jQuery modals in plugins

Hi guys,

I want to include a jquery modal window in my plugin, but I'm struggling to make it work as it's my first time playing with js in siena.

Using this demo & source here: http://jqueryui.com/dialog/#modal this is what I've done so far:

• Copied all js and css files used in the example code to my server (themes/[theme]/js).
• Inserted the following code into themes/[theme]/[theme].rc.php:

cot_rc_add_file($cfg['themes_dir'].'/'.$usr['theme'].'/js/jquery-ui.css');
cot_rc_add_file($cfg['themes_dir'].'/'.$usr['theme'].'/js/jquery-1.9.1.js');
cot_rc_add_file($cfg['themes_dir'].'/'.$usr['theme'].'/js/jquery-ui.js');

cot_rc_add_embed('modalexample','
	$(function() {
    $( "#dialog-modal" ).dialog({
      height: 140,
      modal: true
    });
  });
  ');

• Inserted the following lines into my plugin:

$plugin_body .= '<div id="dialog-modal" title="Basic modal dialog">
  <p>Adding the modal overlay screen makes the dialog look more prominent because it dims out the page content.</p>
</div>
 
<p>Sed vel diam id libero <a href="http://example.com">rutrum convallis</a>. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.</p>';

But no window is loaded and the divs just render ordinarily. Any help on how to achieve this simple javascript trick would be greatly appreciated!

Thank you.