Динамический контент в админке - PullRequest
Новая
       0

Динамический контент в админке

0 голосов
/ 01 ноября 2011

В настоящее время я создаю панель администратора для своего сайта, и некоторые друзья запускают ее. Я хотел бы, чтобы панель содержала меню слева, которое просто переключает контент, отображаемый на главной странице в центре справа. Таким образом, в основном меню состоит из кнопок, и когда кнопка нажата, я хочу, чтобы она изменила то, что отображается на экране. Возможно ли это с помощью JavaScript? И если да, кто-нибудь знает, как связать его с HTML? Я даю тегам какой-то идентификатор, который вызывает функция javascript? Я знаю, что мой вопрос может показаться слишком расплывчатым, но любая помощь в этом вопросе будет принята с благодарностью.

Ответы [ 2 ]

0 голосов
/ 01 ноября 2011

Вы можете использовать что-то вроде simpleTabs и Jquery.Я создал демо здесь, http://jsfiddle.net/6kN5M/

В основном игнорируйте макет CSS, если хотите.Главное, что нужно понять из разметки, это то, что первая вкладка / кнопка подсвечена и показывает первый фрагмент содержимого.Когда вы нажимаете на другую вкладку / кнопку, это показывает другой кусок контента.Вы можете добавить столько вкладок, сколько захотите.

0 голосов
/ 01 ноября 2011

Вы можете сделать это с помощью jQuery. Это было бы что-то вроде этого: 

<head>
    <script type="text/javascript">
        function loadPage(thePage) 
        {
            $.ajax({
                type: 'GET',
                url: thePage,
                success: function(response) {
                     $('#main_content').html(response);
                },
                dataType: 'html'
            });
        }

        $(document).ready(function() {
            // I just imagine you have some php pages here
            $('#add_employee').click = loadPage('AddEmployee.php');
            $('#show_employee').click = loadPage('ShowEmployees.php');
        });
    </script>
</head>
<body>
    <div id="left_panel">
        <a href="#" id="add_employee">Add employee</a>
        <a href="#" id="show_employee">Show employees</a>
    </div>

    <div id="main_content">
        // This is your main content on the right of the admin panel
    </div>
</body>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...