Enter a screen with the dropdown option already selected

Question

I got this dropdown

<div class="form-group">
        @Html.Label("Grupo de Desconto", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("GrupoDescontos", new SelectList(ViewBag.Desconto, "Id", "Descricao"), new { @id = "GrupoDescontos", @class = "Makewide" })
            @*@Html.ValidationMessageFor(model => model.HomeTemplateId, "", new { @class = "text-danger" })*@
        </div>
    </div>

Whenever I select an ID on the list screen and when I enter the Detail screen, the ID=1 option is selected, even if I have selected Section 3, for example. How do I leave selected in Dropdown the corresponding ID item?

EDIT1

This is cshtml with the dropdown list that is called by index and then by Dropdown

<div>
    <h4></h4>
    <hr />
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    @Html.HiddenFor(model => model.Id)

    <div class="form-group">
        @Html.Label("Grupo de Desconto", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("GrupoDescontos", new SelectList(ViewBag.Desconto, "Id", "Descricao"), new { @id = "GrupoDescontos", @class = "Makewide" })
            @*@Html.ValidationMessageFor(model => model.HomeTemplateId, "", new { @class = "text-danger" })*@
        </div>
    </div>

</div>

<div id="GridPartial"></div>

@Html.Partial("DetailsPartial")

<p>
    @Html.ActionLink("Back to List", "Index")
</p>

<script type="text/javascript">
    $(document).ready(function () {
        $("#GrupoDescontos").change(function () {
            $.ajax
            ({
                url: '' + $(this).val(),
                type: 'GET',
                    success: function (dados) {
                    $("#GridPartial").empty();
                    $("#GridPartial").html(dados);
                    //var resultado = dados;
                },
                    error: function (erro) {

                        alert("erro");

                }
            });
        });
    });

    $(document).ready(function () {
        $("#GrupoDescontos").val();
    });
</script>

Answer 1

You can use a simple Jquery like this:

$("#GrupoDescontos").val("Valor_a_Selecionar");

If you bring that kind of value ViewBag:

$("#GrupoDescontos").val('@ViewBag.Valor_a_Selecionar');

See an example below:

$( document ).ready(function() {
    $("#MeuDropDownList").val("2");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="MeuDropDownList">
  <option value="0">Selecione...</option>
  <option value="1">Azul</option>
  <option value="2">Vermelho</option>
  <option value="3">Verde</option>
</select>

With C# in Controller

If you prefer you can do it with the Selected of SelectListItem:

List<SelectListItem> list = new List<SelectListItem> {
    new SelectListItem() { Text = "Selecione", Value = "0" },
    new SelectListItem() { Text = "Azul", Value = "1" },
    new SelectListItem() { Text = "Vermelho", Value = "2", Selected = true },
    new SelectListItem() { Text = "Verde", Value = "3" }
};