1

I'm trying to learn asp.net and I'm trying to use the ASP routing directly from the tablerow (tr), instead of for each anchor point inside the cell.

Below code, I'm able to click the "Case ID" in my table, but this leaves some unclickable area around the actual text. I basically want to be able to simply select the row and pass the @sc.ID for a database query in the ViewCase-page.I want end-user to click "category" (and several columns in the future), without having to define tags everyhwere.

@foreach (var sc in Model.Cases)
{
    <tr asp-area="" asp-page="ViewCase" asp-route-ID="@sc.ID">
        <td>
            <a asp-area="" asp-page="ViewCase" asp-route-ID="@sc.ID">   
            Case @Html.DisplayFor(Moldel  => @sc.ID)
            </a>
        </td>   
        <td>
            @Html.DisplayFor(Moldel  => @sc.Category) 
        </td>
    </tr>
}   

Snippet from table, mouse hovers on Case ID cell

Rena
  • 30,832
  • 6
  • 37
  • 72
Saetheer
  • 31
  • 5
  • 1
    You might take a look at the CSS-based approach used in this answer and see if it does what you need. https://stackoverflow.com/a/15801081/2708636 – Adam Shaver Aug 04 '22 at 01:50
  • You want something like ``, (or some other `Url.` method). Then JS / CSS for the click action. – Jeremy Lakeman Aug 04 '22 at 06:08

1 Answers1

0

It seems you do not want not want to specify the a tag every where. Tag helper does not work for table element, you just add js in the tr element like below:

<table class="table">
    @foreach (var sc in Model.Cases)
    {
        <tr  onclick="window.location.href='/ViewCase?ID=@sc.ID'">
            <td>                
                Case @Html.DisplayFor(Moldel  => @sc.ID)             
            </td>   
            <td>
                @Html.DisplayFor(Moldel  => @sc.Category) 
            </td>
        </tr>
    }  
</table>
Rena
  • 30,832
  • 6
  • 37
  • 72