Filter executable by URL?

Question

I have a filter system which filtrate data by category number,

Can i filter that not clicking button, but directly using URL something like "domain.com/?data-filter=2" ???

            $('[data-sort-name]').click(function() {
                var name = $(this).attr('data-sort-name');
                var type = $(this).attr('data-sort-type');
                console.log(name + ' ' + type)

                $('#main>a').sortElements(function(a, b) {
                    var av, bv;
                    av = ($(a).attr('data-' + name));
                    bv = ($(b).attr('data-' + name));
                    console.log(av + '///' + bv);
                    return (
                            isNaN(av) || isNaN(bv) ?
                            av >= bv : +av >= +bv
                            ) ?
                            type == '>' ? -1 : 1 :
                            type == '>' ? 1 : -1;
                });
            });
            $('[ data-filter]').click(function() {
                $('[ data-filter]').removeClass('active');
                var type = $(this).addClass('active').attr('data-filter');
                if (type == 'all') {
                      $('#main>a').css('display','block');                        
                } else {
                $('#main>a[data-cat]').each(function() {
                    $(this).css('display', $(this).attr('data-cat').indexOf(type) != -1 ? 'block' : 'none')
                })
            }
            });
        });`

here is #menu

                <div class="menu-button">


                            <a type="button" data-filter="all" class="btn" >ALL</a>
                            <a type="button" data-filter="2" class="btn">Category 1</a>
                            <a type="button" data-filter="3" class="btn">Category 2</a>

                </div>

score 0 · Accepted Answer · edited May 23 '17 at 12:05

0

Yes, you can read in the the document location which mean you can parse the query sting or the complete URL if needed to

function getUrlVars()
{
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for(var i = 0; i < hashes.length; i++)
    {
        hash = hashes[i].split('=');
        vars.push(hash[0]);
        vars[hash[0]] = hash[1];
    }
    return vars;
}

ref : jquery get querystring from URL

EDIT : implementation :

var $vars = getUrlVars();
//this will emulate a user click on the right filter
$('a[data-filter=' + $vars['data-filter'] + ']').click();

edited May 23 '17 at 12:05

Community

1
1

answered Sep 26 '14 at 12:53

DarkMukke

2,469
1
23
31

thank you , so i can, do i need to change the code? really not prof of JS, example? – Hobbycoder Sep 26 '14 at 12:55
as requested, an example on how to get the query string vars – DarkMukke Sep 26 '14 at 12:56
and added an implementation that just emulates the click so no need to change the code – DarkMukke Sep 26 '14 at 13:01

score 0 · Answer 2 · answered Sep 26 '14 at 12:56

Client side, you can use window.location.search to get the ?data-filter=2 string and manipulate your document accordingly.

Another option is to write a JS variable server side, e.g. in PHP:

<script>
    ...
    var myfilter = '<?php print $filter ?>';
    ...
</script>

Filter executable by URL?

2 Answers2