Hey,

I was wondering if it is possible to add tabs on a CMS page that allows the user to switch between content without refreshing the page?

Example: About Page

Tab1: Content 1
Tab2: Content 2
Tab3: Content 3

I currently have a PHP script that updates the database and actual site information for one content area only.

I want three within one page, but I only want to display one at a time. Is there a way to do it?

I don't want three seperate PHP pages for each of the content updates. This would make my CMS not as efficent.

Thanks

    I would suggest u to use ajax to accomplish this task..
    Onclick of a particular tab, call a function to fetch data from the database respective to that tab.

    Like, suppose u have a tab called tab1 and a <div> with id 'db' where you want to show the data.

    <input type="button" value="Tab-1" onclick="get_db()"  />
<div id="db"></div>

    and the function get_db() would be like:

    function get_db()
		{
		$('#db').load('http://www.xyz.com/get_db.php);				
		}

    In the file get_db.php, u write your sql query to fetch the data from the database..
    In a similar manner, you can get the data for your other tabs too..

      Thanks for the reply. That piece of jQuery is very promising. I have checked how it functions.

      I did however want a piece of code that brought in different database data. This data would switch out the other form data without refreshing the page.

      Is there anyway of doing this without creating a new page? If anyone knows a way to do that, I will appreciate it a lot!

      @php_rockzz:

      When I tested this code, I create a new PHP file like you said, and in that I basically copied most of my about page code into it. This included the PHP and form. That how I guessed it worked.

      This worked, the information switches, and the other database data is displayed in the form. When I hit update however, I use a:

      header(location🙂;

      This allows the information for the 2nd content to be updated, but on refresh it goes back to displaying the content 1 form and data.

      Is there anyway of keeping the 2nd content on page refresh?

        i m not quite clear about the problem.. first, if u want to update the data in the database, what is the need of header location?? u can simply call a php function on submit that would execute the sql query.. a piece of code to highlight ur problem would be quite helpful..

          Basically, I have a form. This form contains echoes, that brings in the database information.

          Example:
          <input type="text" name="page_title" id="page_title" value="<?php echo $pagetitle; ?>" />

          This is required through a query.

          The form has an update button, that when submitted, it validates the form, and runs an update query to the database. This changes the database data. Once the Update button is pressed. The page refreshes, bringing in the newly updated information into the form.

          I need a way of bringing in other about data from the database. So When tab 2 is pressed. The form that holds content 1, switches with content 2 so that can be updated.

          I think I'm better off just making new pages for each content area. But this will lead to there being more pages than I wanted.

            4 days later

            hello you can accomplish this with jquery ui libary and php script,the best way is create your html mockup of the data then test it when done you would use the jquery ui tab ajax method to fetch the data from the php file which will process the request and return the data:
            - tab1: get.php?id=1
            - tab2: get.php?id=2
            in the get.php parse the id parameter and use a php switch for looping on your ids
            switch(id) case:1 / code to show based on id// you can get the data from db or array

            more info and download here: http://jqueryui.com/demos/tabs/

              Write a Reply...