lw-bobbimartin / simplemodal

Automatically exported from code.google.com/p/simplemodal
0 stars 0 forks source link

Multiple OSX on 1 page #32

Closed GoogleCodeExporter closed 9 years ago

GoogleCodeExporter commented 9 years ago
Hello,

I hope someone can help me on this one :)

I'm working on a webpage where I want to use the OSX Simplemodal more than
1 time.

For example, first I implemented this tool for a login-screen. This works
great. But now I want to use the same tool for a registrationform. But I
don't seem to manage to link the second <a href> to the second option.

In other words, it doesn't mather if I click on the first (login) of the
second (registration) link, I always get the "login popup".

Thank you in advance!
David

This is the code for the login popup: (works perfect)

<div id='osx-modal'><a href="#" class="osx">Login</a></div>

<div id="osx-modal-content">
<div id="osx-modal-title">Login</div>
<div id="osx-modal-data">

<table width="100%" cellpadding="0" cellspacing="0">
  <tr height="25px">
    <td class="doorlopend" width="15%">Login:</td>
    <td><input name="LOGIN" type="text" size="30"></td>
  </tr>
  <tr height="25px">
    <td class="doorlopend">Password:</td>
    <td><input name="PW" type="text" size="30"></td>
  </tr>
  <tr>
    <td></td>
    <td><input name="submit" value="Login!" type="submit"></td>
  </tr>
</table>

</div>
</div>

Original issue reported on code.google.com by davidde...@gmail.com on 25 Jan 2010 at 1:38

GoogleCodeExporter commented 9 years ago
This is a support question and not an issue with SimpleModal.

Please use http://stackoverflow.com or http://forum.jquery.com to ask these 
types of 
questions.

In general, you just need to modify the JS to use something like the id of a 
link to 
determine which content to display.

Example:

<a href='#' class='modal-links' id='content1'>content1</a>
<a href='#' class='modal-links' id='content2'>content2</a>
<a href='#' class='modal-links' id='content3'>content3</a>

<div id='modal_content1'>modal content1</div>
<div id='modal_content2'>modal content2</div>
<div id='modal_content3'>modal content3</div>

$('a.modal-links').click(function () {
  $('modal_' + this.id).modal();
  return false;
});

Original comment by emartin24 on 23 Feb 2010 at 4:17