Forums

dialog only loading once

Permalink 1 user found helpful
I have a single page using a dialog, and everything works great once, then the second time the dialog comes up, it's empty. thoughts?

<div id="myDialogContent" style="display: none">
     <button>Yes, sign me up</button>
</div>
<script type="text/javascript">
loadMyDialog = function() {
  jQuery.fn.dialog.open({
    title: 'select this',
    element: '#myDialogContent',
    width: 300,
    modal: false,
    height: 80,
});
}
</script>
RadiantWeb
 
c5studio replied on at Permalink Reply
c5studio
What is happening is that when you close the dialog it is removing the "myDialogContent" instead of setting it to "display: none".

One way to get around this is to put your content in an external file and load that. This link explains that approach in more detail:http://www.concrete5.org/documentation/how-tos/javascript-jquery-an...
RadiantWeb replied on at Permalink Reply
RadiantWeb
yeah, I saw that, used the same tutorial to pull data internal. I would rather keep all the logic between this view, controller, model. I have some functions that need to be ran in that div per data set in a loop. so there will be a list of items that have a dialog associated with them, that on confirming the choice, more logic ensues.

thanks
C
Tony replied on at Permalink Reply
Tony
could you make a copy of that element with a different id, and point the dialog at that new one?
RadiantWeb replied on at Permalink Reply
RadiantWeb
can you expound on that T?

C
Tony replied on at Permalink Best Answer Reply
Tony
something like:

var el = document.createElement('div')
el.id = "myNewElement"
el.innerHTML = $('#myDialogContent').html();
el.style.display = "none"
$('#myDialogContent').parent().append(el);

jQuery.fn.dialog.open({
...
element:'#myNewElement',
...
})
RadiantWeb replied on at Permalink Reply
RadiantWeb
excellent. thanks bro. I recommend modifying the tutorial on that to include this.

C
Tony replied on at Permalink Reply
Tony
yeah. I sorta think that way of working with the dialog is error prone. I'd rather request stuff when needed through ajax, like:

$.fn.dialog.open({
title: $('#quick-edit_versionsMsg'+bID).val(),
href: url,
width: '700px',
modal: false,
height: '350px'
});
CodeOtaku replied on at Permalink Reply
CodeOtaku
This thread was useful to me, thanks guys.

In my case I had a series of anchor links where I needed to pop up a dialog with the content based on an attribute of the link (an ID) and the content being pulled from a PHP tool script that makes use of the C5 functionality and is not an anonymous (external) PHP script.

The selector in my case was class="ad"

So I ended up with this code:

$(function() {
   $(".ad").click(function() {
      var adID = $(this).attr("aid");
      $.post(CCM_TOOLS_PATH + '/ads/report', { adID: adID }, function(data){
         var el = document.createElement('div');
         el.id = "myDialogContent";
         el.innerHTML = data;
         $('#content').append(el);
         $.fn.dialog.open({
            title: 'Ad Campaign Performance',
            element: '#myDialogContent',
            width: 550,
            modal: false,
            height: 380,
         });
Viewing 15 lines of 18 lines. View entire code block.