How to implement the same sorting behaviour with custom header template

Question

My question is similar with this but the answer does not work for me as a linkbutton behaves differently than normal sorting headings.

Our website uses Server.Transfer to hide different page access under a unique URL. Clicking on a asp:LinkButton will lead to the front page, and not just sorting the gridview.

When looking at the client page code, I observed that the tool tip of a normal column header looks like

javascript:__doPostBack("(grid view control id)","Sort$(field name)");

and on a column with custom header template using LinkButton, it is

javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(
    "(link button control id)", "", true, "", "", false,true);

I think the difference is the cause.

How to make them behave the same?

Update

I noticed that for a asp:Button rather than link button, the javascript click event calls

javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(
    "(button control id)", "", true, "", "", false, false);

And it is not leading to the front page.

So it seems I only need to set up so that the link button does not do a client side submit. But what is the best way to do so?

Have you want to prevent postback when `LinkButton` is clicked? AFAIK, `LinkButton` always having `clientSubmit = true` because it renders as anchor tag, where `Button` has `UseSubmitBehavior` property to control `clientSubmit` behavior as plain button or form submit button. — Tetsuya Yamamoto, Apr 28 '17 at 07:09
See my own answer below. I am not looking at prevent the postback, only wanted to disable the submit - but I do need to trigger the server side callback. — Earth Engine, Apr 28 '17 at 07:26
One other solution is to use CSS to render the `Button` tag like an `a` tag. But my CSS skills is not good enough to do this properly... — Earth Engine, Apr 28 '17 at 07:28
There was how to implement button like an anchor link in CSS: `.submitbutton { background-color: transparent; text-decoration: underline; border: none; color: blue; cursor: pointer; }` and putting `outline: none;` when the button being focused. — Tetsuya Yamamoto, Apr 28 '17 at 07:39
I think there are more to set... for example `:visited` and/or `:horver` states... as I know. It is not easy for me to get a comprehansive set of those details. — Earth Engine, Apr 28 '17 at 10:00

Earth Engine · Answer 1 · 2017-04-28T07:22:51.537

Use the following trick, I achieved this. As it is kind of hacking, I am still open to see better ways to solve it.

<asp:LinkButton href="javascript:void(0);" 
    OnClientClick="javascript:__doPostBack(this.id.replace(/_/g,'$'),'');" ...

Will prevent the submit and so not switch to the front page. It first set the href attribute such that it does not lead to anywhere, then in OnClientClick trigger the callback event of the LinkButton.

It resolves my problem, but it depends on the implementation details that ASP.NET generates IDs and event target identifiers. Are there any better solutions?

How to implement the same sorting behaviour with custom header template

1 Answers1