Php 多个SimpleModel';在一个页面上动态显示

Php 多个SimpleModel';在一个页面上动态显示,php,javascript,jquery,smarty,simplemodal,Php,Javascript,Jquery,Smarty,Simplemodal,我正在内部处理一个项目,当在列出所有客户的表中单击时,我希望使用SimpleModel显示客户信息 但是这给我带来了一些麻烦,所以我现在问你们 这是我目前的代码: <table border="0" cellpadding="0" cellspacing="0" id="customertable" class="sortable"> <thead> <tr class="odd"> <th>Navn</th>

我正在内部处理一个项目,当在列出所有客户的表中单击时,我希望使用SimpleModel显示客户信息

但是这给我带来了一些麻烦,所以我现在问你们

这是我目前的代码:

<table border="0" cellpadding="0" cellspacing="0" id="customertable" class="sortable">
<thead>
    <tr class="odd">
        <th>Navn</th>
        <th>Telefon</th>
        <th>Postnummer</th>
        <th>By</th>
    </tr>
</thead>
<tbody>
{foreach $results as $customer}
{strip}
   <tr class="{cycle values='even,odd'}">
      <td class="name" id='mousetracking' title={$customer.name}><a href="#" id="osx{$customer.customerid}">{$customer.name}</a></td>
      <td class="data">{$customer.phone}</td>
      <td class="data">{$customer.postcode}</td>
      <td class="data">{$customer.city}</td>
   </tr>
{/strip}
        <!-- modal content -->
        <div class="modalhidden">
            <div id="osx-modal-content{$customer.customerid}">
                <div id="osx-modal-title">Customer no #{$customer.customerid}</div>
                <div class="close"><a href="#" class="simplemodal-close">x</a></div>
                <div id="osx-modal-data">
                    <h2>Hello! I'm Customer no. #{$customer.customerid}</h2>
                </div>
            </div>
        </div>
{/foreach}
</tbody>
</table>
Displaying {$total} records<br />

<script type="text/javascript">
function addModal(x)
{
    $("osx" + x).addEvent("click", function(){
          var SM = new SimpleModal();
              SM.show({
                "title":"Title",
                "contents": $("#osx-modal-content" + x).html()
              });
        });

}
</script>
以及原始的jquery.simplemodal.js


我现在唯一的问题是,它用正确的div加载model,但该div是隐藏的。

好的。我自己设法修好了

以以下代码结束:

<table border="0" cellpadding="0" cellspacing="0" id="customertable" class="sortable">
<thead>
    <tr class="odd">
        <th>Navn</th>
        <th>Telefon</th>
        <th>Postnummer</th>
        <th>By</th>
    </tr>
</thead>
<tbody>
{foreach $results as $customer}
{strip}
   <tr class="{cycle values='even,odd'}">
      <td class="name" id='mousetracking' title={$customer.name}><a href="#" id="{$customer.customerid}">{$customer.name}</a></td>
      <td class="data">{$customer.phone}</td>
      <td class="data">{$customer.postcode}</td>
      <td class="data">{$customer.city}</td>
   </tr>
{/strip}
        <!-- modal content -->
        <!--<div class="modalhidden">-->
            <div id="modal_{$customer.customerid}">
                <div id="osx-modal-title_{$customer.customerid}">Customer no #{$customer.customerid}</div>
                <div class="close"><a href="#" class="simplemodal-close">x</a></div>
                <div id="osx-modal-data_{$customer.customerid}">
                    <h2>Hello! I'm Customer no. #{$customer.customerid}</h2>
                </div>
            </div>
        <!--</div>-->
{/foreach}
</tbody>
</table>
Displaying {$total} records<br />
<table border="0" cellpadding="0" cellspacing="0" id="customertable" class="sortable">
<thead>
    <tr class="odd">
        <th>Navn</th>
        <th>Telefon</th>
        <th>Postnummer</th>
        <th>By</th>
    </tr>
</thead>
<tbody>
{foreach $results as $customer}
{strip}
   <tr class="{cycle values='even,odd'}">
      <td class="name" id='mousetracking' title={$customer.name}><div id="basic-modal"><a href="#" id="{$customer.customerid}">{$customer.name}</a></div></td>
      <td class="data">{$customer.phone}</td>
      <td class="data">{$customer.postcode}</td>
      <td class="data">{$customer.city}</td>
   </tr>
{/strip}
{/foreach}
</tbody>
</table>
{foreach $results as $customer}
{strip}
        <!-- modal content -->
        <div id="basic-modal-content_{$customer.customerid}" style="display:none;" width="600px">
            <h3>{$customer.name}</h3>
            <table border="0" cellpadding="0" cellspacing="0">
                <tr>
                    <td width="150px;">Adresse</td>
                    <td>{$customer.address1}<br />{$customer.postcode}&nbsp;{$customer.city}</td>
                </tr>
                <tr>
                    <td width="150px;">Telefon</td>
                    <td>{$customer.phone}</td>
                </tr>
                <tr>
                    <td width="150px;">Fax</td>
                    <td>{$customer.fax}</td>
                </tr>
                <tr>
                    <td width="150px;">Email</td>
                    <td>{$customer.email}</td>
                </tr>
                <tr>
                    <td width="150px;">Website</td>
                    <td>{$customer.web}</td>
                </tr>
            </table>
            <br /><br />
            <h4>Server Setup</h4>
            <code>{$customer.Server_setup}</code>
        </div>
{/strip}
{/foreach}
Displaying {$total} records<br />
与此javascript一起:

jQuery(function ($) {
    // Load dialog on page load
    //$('#basic-modal-content').modal();

    // Load dialog on click
    $('#basic-modal a').click(function (e) {
        $('#basic-modal-content_' + this.id).modal({
            overlayClose:true
        });
        return false;
    });

});
它就像一个符咒


谢谢大家的意见。

“……但这给我带来了一些麻烦……”什么样的麻烦?另外,编写一个示例可能更好。问题是,我无法使上述代码正常工作,也无法找出问题所在。这是Eric Martin的SimpleModel吗?使用它之后,他的代码库中没有
SimpleModal
原型。您可以使用
$.modal
打开一个对话框。@jamietre是的,这是他的SimpleModel。很抱歉,我没有真正理解您的其余评论。您的代码是
SM=new SimpleModal()
,如果没有其他代码,它将无法执行任何操作。所以我猜这一定是您创建的一个包装API的对象。那么您的
simpleModel
对象是什么样子的呢?
jQuery(function ($) {
    // Load dialog on page load
    //$('#basic-modal-content').modal();

    // Load dialog on click
    $('#basic-modal a').click(function (e) {
        $('#basic-modal-content_' + this.id).modal({
            overlayClose:true
        });
        return false;
    });

});