如何在列表中为php生成的jquery对话框创建唯一的id:s?

时间:2011-07-08 21:15:43

标签: php jquery jquery-ui button jquery-ui-dialog

我遇到了jquery对话框的问题。使用它们只需硬编码到一个按钮,它们工作得很好。但是当我在php中运行一个向量来生成一些搜索结果时,我的更多信息按钮停止工作。第一个选项会在按下时生成一个对话框,但其中的内容却是错误的。在此之后列出项目不会显示对话框弹出窗口,如果我向下滚动按钮时它会跳转到第一个项目。

我的猜测是由于具有相同ID的多个按钮而产生此行为。这是我制作的第一个主页,我真的不知道如何解决这个问题。

一些代码:

PHP part:

$outputList = '';
while($row = mysql_fetch_array($sql2)){

  ...yadayada...
  <a style="position:relative;left:600px;top:-40px;" href="#" id="dialog_link" onmouseover="document.rollover.src=button2.src" onmouseout="document.rollover.src=button1.src" >
    <img src="images/search/info_btn_unsel.png" border="0" name="rollover" />
  </a>
</div>
</div>
}

JavaScript part:

<script type="text/javascript">
  $(document).ready(function(){
    // Dialog           
    $('#dialog').dialog({
      autoOpen: false,
      width: 600,
      buttons: {
        "Ok": function() { 
          $(this).dialog("close"); 
        }, 
      }
    });

    // Dialog Link
    $('#dialog_link').click(function(){
      $('#dialog').dialog('open');
      return false;
    });
  });
</script>

完整的文件可以在这里找到: http://dl.dropbox.com/u/10627595/timeseek_result.php

由于

4 个答案:

答案 0 :(得分:0)

您必须从不重复ID,这导致了问题。请改用班级

所以你有:

<a class="dialog_link" ... >

你的jquery代码是:

$('.dialog_link').click(function(){ //Note the . instead of #
   $('#dialog').dialog('open'); //The same code
   return false; //The same code
});

希望这会有所帮助。干杯

答案 1 :(得分:0)

您不能拥有多个具有相同ID的项目,ID必须是唯一的。

将数据库结果中的一些唯一ID添加到html链接的ID中。

然后在链接中添加一个类“js_show_info”等,并将jQuery处理程序附加到此类。

$('.js_show_info').click()...

答案 2 :(得分:0)

如果每个对话框中的每个搜索结果行都有唯一的信息,那么每个对话框都需要自己唯一的ID。此外,每个对话框内容都需要每行唯一的php变量。

在阅读了您的问题并查看您的代码之后,情况似乎就是如此。如果我是正确的,那么解决问题将比将id更改为类更多。

答案 3 :(得分:0)

正如其他人已经提到的那样,您需要拥有唯一的ID。创建一个class dialog_link并在while循环中分配ID等于唯一值,例如给定记录的SQL表行号。