J. Doe J. Doe - 4 months ago 8
PHP Question

changing data in a div

First off let me state I'm not web developer and I'm learning on the way. So this might not be possible or might be a horrible idea. If so please let me know and if not please point me in the right direction.

I developing a website and I got most of the foundation done for it, but this one section. The section I'm working on could have as little data as 1 set of data or it could have 40+ sets of data. I'm trying to come up with a good way of displaying that data. Oh by sets I mean it would at min. have 4 rows of data displayed (audio, format, location, etc).

I was thinking of using breadcrumbs to keep track of the user position and below that have links in a div. Oh it might help to mention I'm dealing with tv shows. So I was thinking that the first link could be format type. Then once the type is clicked it will show what seasons are related to that format. Then show links of all the different season. So then when one link it clicked it will look and see if there was collections to that season (some shows break seasons up into collections and make it difficult since there is no default standard). Then either show the disc involved with that and have them click and then show the data associated with that disc or just show all disc data associated with the season and/or collection.

I was thinking of having the div update and show the new data after each click.

Thoughts? Suggestions?

I would like to keep the look nice and simple without having to go to another web page, but I don't know if this idea is even possible. I also thought about hidden tabs in bootstrap, but I don't know if that is better or expanding panel, but then again I don't know if that is better either.

Answer

You should do this through AJAX. you can customise it to work on a click to reload some divs content example :

$.ajax({
        method:"POST",
        url: 'link_to_php_function.php',
        data:'',
        success: function(response){                                
            $('#yourdiv').html(response);
        });
});