Help me :)

Hey,

You can override the opening JS by adding something like this to your themes js

jQuery('.eModal-1').click(function(e){
  e.preventDefault();
  var $this = $(this);
  var src = $this.attr('src');
  var $modal = $('#eModal-1');
  $('img', $modal).attr('src', src);
  $('span.imgsrc', $modal).text(src);
  $modal.emodal('open');
});

You of course will need to tailor it to your needs.

Thanks for the reply but that isn’t what I’m looking for – it is a filename – in fact – any text to pass onto the modal popup so I can work on it from then to use with other shortcodes.

The modals content is generated with the rest of the page so shortcodes would already be processed.

What you are after would be better done with JS.

For instance say you had 20 links that all need to open a modal with an iframe with that links website shown in the modal ( you wont use an iframe of course ).

To accomplish this you would make just 1 modal. Set its content to be an iframe with no src tag, basically a blank ifarme.

Then in the code above you would change

var src = $this.attr('src');
  var $modal = $('#eModal-1');
  $('img', $modal).attr('src', src);
  $('span.imgsrc', $modal).text(src);

to

var src = $this.attr('href');
  var $modal = $('#eModal-1');
  $('iframe', $modal).attr('src', src);

Basically i take information from the link clicked and insert it into the modal just before opening. This way i can pass any info needed.

If you can explain in detail how you want it to work im sure we can get a working solution pretty easily.

Say if you had a paragraph of text and wanted to replace several key variables throughout. You could do it like this.

Modal Content

<p>
  Hello my name is <span class="name"></span>. I work at <span class="company"></span>.
</p>

and buttons might look like this.

<button class="eModal-1" data-name="olivertwist2007" data-company="WordPress">Click Me</button>

And for the JS

jQuery('.eModal-1').click(function(e){
  e.preventDefault();
  var $this = $(this);
  var $modal = $('#eModal-1');
  var name = $this.data('name');
  var company = $this.data('company');
  $('span.name', $modal).text(name);
  $('span.company', $modal).text(company);
  $modal.emodal('open');
});

Now you can litterally have hundreds of buttons on one page with different data. Each will open the same modal but changing the variables before it shows.

And how I display it out onto the modal form?

Im assuming you mean how do you take the info from the button and apply it to the modal? If so that’s precisely what this does

jQuery('.eModal-1').click(function(e){
  e.preventDefault(); // Prevent the default opening
  var $this = $(this); // Set variable representing button
  var $modal = $('#eModal-1'); // Set variable representing modal
  var name = $this.data('name'); // Get the buttons name
  var company = $this.data('company'); // Get the buttons company
  $('span.name', $modal).text(name); // Replace the text inside span class="name"
  $('span.company', $modal).text(company); // Replace the text inside span class="company"
  $modal.emodal('open'); // Open the modal window.
});

`

What I want to do is offer option of using another shortcode to include say the name/company that copies the text into clipboard and other option was to pay – again using another short code.

So to make that work checklist goes

Set modal content to include empty containers with unique classes/ids that you can target for replacement.

Create button / link / or even a html structure that has the correct info that needs to be passed for each button.

Copy and customize that JS code above into your themes main javascript code or using a plugin to add it.

Hope this helps.

Can you email me directly. danieliser at wizardinternetsolutions.com.

Please include some context such as overall scope of the site, what the final content of the modal should be, what will be clicked and lastly what dynamically needs to be passed from the item clicked to the modal.