I have a modal that’s powered by jquerymodal.com

I trigger it with:

<div class="panel2" id="panel2">
<p>Content goes here</p>
</div>
<p><a href="#ex1" rel="modal:open" id="panel2">Insert content here</a></p>

The modal content itself is within a hidden div on the page. It contains the following:

<div id="ex1" class="modal">
<form method="post">
<input type="hidden" name="myFile" id="myFile" value=“<php print($fileid); ?>> 
<button type="submit" name="submit" id="submit">Insert</button>
</form>
</div>

Finally, the javascript to make it all work is:

<script>
$(function () {
$('form').on('submit', function (e) {

e.preventDefault();

$.ajax({
 type: 'post',
 url: 'somephpfile.php',
 data: $('form').serialize(),
 success: function () {
  //do stuff here when sucessful 
  $.modal.close(); //close the modal window
}
});          
});
});
</script>

That all works.

However, I need to be able to pass some data to the modal so that I can include it in the form as a hidden field. That data is id of the div that immediately precedes the link to trigger the modal. So for example in the following example the value that I’d like to pass to the modal is “panel234”, then in the modal I need to add an extra hidden field called divid with that value set.

<div class="panel234" id="panel234">
<p>Content goes here</p>
</div>
<p><a href="#ex1" rel="modal:open" id="panel234">Insert content here</a></p>

It’s not as simple as hardcoding it as the link to open the modal will appear lots of times below lots of different divs, so I need to make sure it’s always the relevant value. It could be hundreds of divs within a page.

Is there a way of sensibly doing this?