简体   繁体   English

jQuery UI TABS + AJAX + PHP动态内容加载

[英]jQuery UI TABS + AJAX + PHP Dynamic Content Loading

Here is the scenario: 这是场景:

  • I am using jQuery UI Tabs to load dynamic content into a content div below. 我正在使用jQuery UI Tabs将动态内容加载到下面的内容div中。
  • When clicking on the tabs, the content changes and loads (via Ajax) various PHP Files 单击选项卡时,内容会更改并通过Ajax加载(通过Ajax)各种PHP文件
  • One of the files is a list (accessed through a mysql db) that lists for example users in the general format 其中一个文件是一个列表(可通过mysql db访问),该列表以常规格式列出例如用户
  • Ex: ID - UserName - Full Name - View / Modify 例如:ID-用户名-全名-查看/修改

What I want to achieve, is that, from this list, when a user clicks the View Modify link, it replaces the list of users with the "viewUser.php" file in that div. 我要实现的是,从此列表中,当用户单击“查看修改”链接时,它将用该div中的“ viewUser.php”文件替换用户列表。

My question is as follows: - How do i pass the viewUser.php?ID=4 value back to the jQuery TABS so that it changes the content of the specific div with the output from the viewUser PHP file? 我的问题如下:-如何将viewUser.php?ID=4值传递回jQuery TABS,以便它通过viewUser PHP文件的输出更改特定div的内容?

The reason I've not included any code is that I am at a loss as to where to begin. 我没有包含任何代码的原因是,我对从哪里开始感到迷茫。 The only tutorials I've found so far is to pass POST values to an external file via AJAX and to display the result in the same DIV. 到目前为止,我发现的唯一教程是通过AJAX将POST值传递到外部文件,并在同一DIV中显示结果。 However, what I want to do is to send a GET Request and change the content of the DIV with the result. 但是,我要发送的是GET Request并用结果更改DIV的内容。

Any help is greatly appreciated, I hope that I've explained my situation adequately. 非常感谢您的帮助,我希望我已经充分解释了我的情况。

UPDATE (added code as suggested) UPDATE(建议添加代码)

This is my tabs / navigation + Content DIV. 这是我的标签页/导航+内容DIV。 The div tc0 is the format of what the div will be for the PHP files as well. div tc0也是PHP文件的div格式。

<div id="tabs">
    <ul class="grid_12 alpha" id="hmenu">
        <li><a href="#tc0">Dashboard</a></li>
        <li><a href="list-users.php">List Users</a></li>
        <li><a href="list-tasks.php">List Tasks</a></li>
    </ul>

    <div id="tc0">
        <p>Some Content</p>
    </div>
</div>

The PHP File (list-users.php or list-tasks.php): PHP文件(list-users.php或list-tasks.php):

<?php

    // Do Database query stuff here

    foreach($data as $row){
        echo '<tr>';
        echo '<td>' .$row['TID']. '</td><td>' .$row['user'];
        echo  '</td><td><a href="viewUser.php?ID=' .$row['ID'] . '" class="this">View User</a></td>';
        echo '</tr>';
    }

The jQuery portion (which works fine for loading the AJAX): (This is where I need the help) jQuery部分(对于加载AJAX来说效果很好):(这是我需要帮助的地方)

    <script type="text/javascript"><!--//TABS-->
        $(document).ready(function(){
            $("#tabs").tabs();          
    });
    </script><!--//END TABS-->

Hope this helps. 希望这可以帮助。 I don't know where to begin coding the jQuery to handle the link from the userlist. 我不知道从哪里开始编写jQuery来处理用户列表中的链接。

. on every tab of click event you Have To Pass Filename With id 在单击事件的每个选项卡上,您都必须传递带有ID的文件名

You have to do this simple line on onclick event of ever tag 您必须在ever标签的onclick事件上执行以下简单操作

window.location='viewUser.php?ID=4 window.location ='viewUser.php?ID = 4

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM