Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to keep #hash in URL for @sortablelink's? #179

Open
artifex-media opened this issue Apr 22, 2021 · 5 comments
Open

How to keep #hash in URL for @sortablelink's? #179

artifex-media opened this issue Apr 22, 2021 · 5 comments

Comments

@artifex-media
Copy link

artifex-media commented Apr 22, 2021

I noticed the @sortablelink does not automaticly recognize you are on a URL with a #hash on it, for example https://www.mywebpage.com/pages/#tab1

@sortablelink will not append that hash into it's link which causes the user to jump back to either a beginning of a page (if the hash is being used as an anchor) or jumps to another part of the page/default tab when the hash is being used a tab reminder, for example with bootstrap tabs.

Is there a way to make it recognize hash in the current url's? Or can I somehow append it myself with the 4th parameter?

@dunkdigital
Copy link

My work-around:

I added a new parameter called $anchorId, and appended it to the $queryString.

See updates in render() and parseParameters().

I then create the link like this: @sortablelink('name', 'Name', [], [], ['hash' => '#jump_to_name'])

Hope this helps.

public static function render(array $parameters)
    {
        // NEW - ADDED $anchorId AS A RETURNED PARAMETER
        list($sortColumn, $sortParameter, $title, $queryParameters, $anchorAttributes, $anchorId) = self::parseParameters($parameters);

        $title = self::applyFormatting($title, $sortColumn);

        if ($mergeTitleAs = config('columnsortable.inject_title_as', null)) {
            request()->merge([$mergeTitleAs => $title]);
        }

        list($icon, $direction) = self::determineDirection($sortColumn, $sortParameter);

        $trailingTag = self::formTrailingTag($icon);

        $anchorClass = self::getAnchorClass($sortParameter, $anchorAttributes);

        $anchorAttributesString = self::buildAnchorAttributesString($anchorAttributes);

        $queryString = self::buildQueryString($queryParameters, $sortParameter, $direction);

        // NEW - APPENDED MY $anchorId TO THE STRING
        $queryString = $queryString . implode($anchorId);

        return '<a'.$anchorClass.' href="'.url(request()->path().'?'.$queryString).'"'.$anchorAttributesString.'>'.e($title).$trailingTag;
    }


    /**
     * @param array $parameters
     *
     * @return array
     * @throws \Kyslik\ColumnSortable\Exceptions\ColumnSortableException
     */
    public static function parseParameters(array $parameters)
    {
        //TODO: let 2nd parameter be both title, or default query parameters
        //TODO: needs some checks before determining $title
        $explodeResult    = self::explodeSortParameter($parameters[0]);
        $sortColumn       = (empty($explodeResult)) ? $parameters[0] : $explodeResult[1];
        $title            = (count($parameters) === 1) ? null : $parameters[1];
        $queryParameters  = (isset($parameters[2]) && is_array($parameters[2])) ? $parameters[2] : [];
        $anchorAttributes = (isset($parameters[3]) && is_array($parameters[3])) ? $parameters[3] : [];

        // NEW - ADD IN $anchorId AS A PARAMETER AND RETURN IT

        $anchorId         = (isset($parameters[4]) && is_array($parameters[4])) ? $parameters[4] : [];

        return [$sortColumn, $parameters[0], $title, $queryParameters, $anchorAttributes, $anchorId];
    }

@Healyhatman
Copy link
Collaborator

Healyhatman commented Jul 8, 2021 via email

@Healyhatman
Copy link
Collaborator

I've merged in and made a release for my custom href update. In the fourth parameter for example you can do
@sortablelink('column', 'Title', null, ['href' => '/#tab1'])
Please give it a go and let me know

@artifex-media
Copy link
Author

@Healyhatman A bit late bit like to respond that this worked great :)

@tcowin
Copy link

tcowin commented Apr 1, 2023

If you're trying to use the hash and the query string, the hash param has to come after the query string for it to work...right?
AFAICT...it has to be like this for it to work:
https://example.com/path?sort=name&direction=desc#named_anchor
So, wouldn't there need to be something pretty close to @dunkdigital's solution here to make this work?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants