Change the keys passed to the querystring in a DotNet Core web application

Question

In my view I have the following, typical razor markup.

<div class="form-item-container">
  @Html.LabelFor(m => m.BookingFormFields.FirstName, new { @class = "form-item-label" })
  @Html.TextBoxFor(m => m.BookingFormFields.FirstName, new { @class = "form-item", name="fn" })
  @Html.ValidationMessageFor(m => m.BookingFormFields.FirstName, null, new { @class = "error-text" })
</div>

The problem is this results in querystring like this

?BookingFormFields.FirstName=Test

Which is fine and works, but wouldn't it be better if it could avoid exposing internal fields and be more succinct?

Wouldn't it look better if it looked more like this

?fn=Test

I could achieve this by intercepting the submit action in JavaScript, but I would like to avoid using that if there's a better native DotNet method that I'm not aware of!

Any ideas?

Answer 1

The problem is this results in querystring like this

?BookingFormFields.FirstName=Test

Your codes failed to override the name property of input

You could try

@Html.EditorFor(m => m.BookingFormFields.FirstName, null, "fn")

Result:

To introduce class, you may try:

@Html.EditorFor(m => m.BookingFormFields.FirstName, null, "fn", new { htmlAttributes = new { @class = "myCssClass", style = "Width:50px" } })

Result: