Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Хеш роутинг JS (https://javascript.ru/forum/jquery/21583-khesh-routing-js.html)

Andrei 16.09.2011 00:13

Хеш роутинг JS
 
Здравствуйте!
Подскажите как реализовать такое:

В адресной строке:
http://site.ru/#/search/?q=test&cat_id=5
или
http://site.ru/#/page/?name=test

Т.е роутинг по хешу и последущая загрузка контента через AJAX ?
Наверняка уже есть готовые решения, что лучше использовать?

Спасибо за внимание !

melky 16.09.2011 08:28

о да.. вот целая "куча"

Andrei 19.09.2011 08:25

melky, спасибо, то что нужно !

И ещё вопрос: у меня данные приходят в json, наверное лучше будет использовать какой-нибудь js шаблонизатор для вывода данных ?

melky 19.09.2011 09:08

можно испльзовать какой-нибудь код для управления роутером ^_^

Andrei 19.09.2011 11:02

я остановился на https://github.com/kulikov/route-js

если делать примерно так:

Route.map('#/search/:name').to(function() {
    $.ajax({
            type: 'GET',
            url:  '/search',
            data: {
                'name'     : this._getParam('name')
            },
            success: function(msg){
                    $('#content').html('');

                    $.each(msg.data, function (i, row) {
                          tmpl = '<div class="row">';
                          tmpl += '<div class="title">'+row.title+'</div>';
                          tmpl += '<div class="body">'+row.text+'</div>';
                          tmpl += '</div>';

                          $('#content').append(tmpl);
                    });
            }
        });
});


правильно будет или можно лучше ?

melky 20.09.2011 10:42

только из цикла операции с DOM уберите.

success: function(msg){
                    $('content').empty();

*!*
                    var  a = $();
*/!*

                    $.each(msg.data, function (i, row) {

                          tmpl = '<div class="row">';
                          tmpl += '<div class="title">'+row.title+'</div>';
                          tmpl += '<div class="body">'+row.text+'</div>';
                          tmpl += '</div>';

*!*
                          a.append( tmpl )
*/!*
                    });

*!*
                    $('content').append(a);
*/!*
            }

Andrei 20.09.2011 10:55

melky ок, спасибо!

Andrei 20.09.2011 18:42

melky, хм не получается добавить DOM элемент в #content $('#content').append(a);, хотя по идеи всё правильно, в чём может быть проблема !?

bayrach 21.09.2011 10:17

var  a = $();
это что за безобразие?

Andrei 21.09.2011 17:09

bayrach,

success: function(msg){
                    $('#content').empty();
                    var tmpl = '';

                    $.each(msg.data, function (i, row) {
                          tmpl += '<div class="row">';
                          tmpl += '<div class="title">'+row.title+'</div>';
                          tmpl += '<div class="body">'+row.text+'</div>';
                          tmpl += '</div>';
                    });

                    $('#content').append( tmpl );
            }


Может так ?


Часовой пояс GMT +3, время: 21:59.