How much to use @Html.Actionlink or Javascript

Question

I’m having trouble understanding when to use a @Html.ActionLink or javascript:document.getElementById('Comercial').submit()

For example:

<a><i class="fa fa-home"></i> Home <span class="fa fa-chevron-down"></span></a>
<ul class="nav child_menu">

         <li><a>@Html.ActionLink("Painel Inicial", "Index_Comercial", "Home")</a></li>

</ul>

Or:

using (Html.BeginForm("Index_Comercial", "Home", FormMethod.Post, new { id = "Comercial" }))
{

}
<a><i class="fa fa-home"></i> Home <span class="fa fa-chevron-down"></span></a>
<ul class="nav child_menu">

         <li><a href="javascript:document.getElementById('Comercial').submit()">Painel Inicial</a></li>

</ul>

• When using one or the other?
• What are the main differences?

Answer 1

Well, this usage is incorrect:

<ul class="nav child_menu">

         <li><a>@Html.ActionLink("Painel Inicial", "Index_Comercial", "Home")</a></li>

</ul>

@Html.ActionLink already generates a <a>. You don’t have to put <a> and </a> around him. @Html.ActionLink() generates a traditional link, whose request method is GET, by the standard of the protocol.

Already this:

<a href="javascript:document.getElementById('Comercial').submit()">Painel Inicial</a>

causes the link to change behavior and starts to act with the method POST, which requires a working form (in this case, 'Comercial'). In this case, the behavior of the link will be equal to that of a <input type='submit' />.