Solved

jquery UI

Posted on 2012-12-23

1 solution

296 Views

Last Modified: 2012-12-28

I have a Tab system like below:

$( "#tabs" ).tabs({
           beforeLoad: function( event, ui ) {
           ui.jqXHR.error(function() {
           ui.panel.html(
                 "Couldn't load this tab. We'll try to fix this as soon as possible.");
                 });
           }
     });

Now inside the first Tab, i have a link names view Data. Open Clicking want that it should open in the Same Tab from were it is clicked and show the data in tabular format. and in that page [Add Data] link will be there, which will just open the add action within the same Tab

how this is possible.

Also while viewing i want to use pagination so it loads data within the same and navigate back and forth

Please guide

Comment

Question by:Gurpreet Singh Randhawa

[X]

Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

Help others & share knowledge
Earn cash & points
Learn & ask questions

Join The Community

3 Comments

LVL 11

Expert Comment

by:mcnute

ID: 387173872012-12-23

Add Data link is calling some page which outputs information in a database?

I would do it like the following:

$.ajax({
        url: '/path/to/the/page/which-querys-your-data.php',
        data: 'some data in a key-value manner',
        error: function (XMLHttpRequest, textStatus, errorThrown) {
             console.log(textStatus+' '+errorThrown);
        },
        success: function(data) {
            $('.class_of_element_where_the_data_goes').html(data);
        }
        });

Open in new window

Your php page is making a query of your database and would echo the html already in the table structure.

LVL 16

Accepted Solution

by:Gurpreet Singh Randhawa

Gurpreet Singh Randhawa earned 0 total points

ID: 387180112012-12-23

Thanks for the Info, I solved it by using the ID of the Tab and then Reloading the Contents through the Herf Attribute and Jquery's ON click event

Thanks

LVL 16

Author Closing Comment

by:Gurpreet Singh Randhawa

ID: 387264642012-12-28

Solved Own by Using jquery UI tabs ID attribute and calling the Page using the Load Functionality

Featured Post

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Delegation for dynamic elements using JQuery on()

Article by: Anthony

There are a couple ways to attach a JavaScript function to dynamically created elements. You can make a new script for each element as it’s created or you can use delegation. Delegation allows a single script that is added at page creation to mat…

jQuery

jquery Dialog box with AJAX request on the page

Article by: Jeffrey

PROBLEM: The other day I was working on adding an ajax request to a webpage that already had a dialog box on the page. The dialog box was using relative positioning to be positioned next to a form field I had on the page. Everything was working…

jQuery

PHP, jQuery, and Form Actions

Video by: Marco

The viewer will learn how to dynamically set the form action using jQuery.

Introduction to jQuery (Part 2)

Video by: Jason

The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…