Javascript Select a dropdown option "AttemptedValue undefined"

Question

Alguém pode me ajudar. debugando eu identifico o problema com uma variável em uma requisição javascript, abaixo o código e as imagens onde identifico "AttemptedValue undefined":

VIEW:

<div class="row">
                <div class="editor-label col-md-4">
                    <label class="control-label">Selecione a formulação</label>
                </div>
                <div class="editor-field col-md-6">
                    @Html.DropDownList("cod_Prod_Med_Formula", null, String.Empty, new { id="cod_Prod_Med_Formula", name = "cod_Prod_Med_Formula", @class = "form-control" })
                </div>
            </div>
            <div class="row">
                <div class="editor-label col-md-4">
                    <label class="control-label">Princípio ativo</label>
                </div>
                <div class="editor-field col-md-6">     
                    @Html.DropDownList("cod_Principio_Ativo", null, new { Name = "cod_Principio_Ativo", id = "cod_Principio_Ativo", @class = "form-control" })            
                  
                </div>
            </div>

<script>  

    $("#cod_Prod_Med_Formula").change(function () {
        var dados = $(this).val().toString();    
        var PrincipioID = $("#Formula_Existente").val();
        var options = '';
        if (dados != 0) {
            $.ajax({
                url: '@Url.Action("RetornaFormula", "Medicamento_Produto")',
                type: 'POST',
                dataType: 'json',
                data: { codigo: dados },
                success: function (result) {
                    $.each(result, function (key, val) {
                        if (val["id"] != PrincipioID)
                            options += '<option value="' + val["id"] + '">' + val["descricao"] + '</option>';
                        else
                            options += '<option value="' + val["id"] + '" selected>' + val["descricao"] + '</option>';
                    });
                    $("#cod_Principio_Ativo").html(options);
                }
            });
        } else {
            console.log(options)
            $("#cod_Principio_Ativo").html(options);
        }
    }).change();


</script>

CONTROLLER:

  [HttpPost]
        public ActionResult RetornaFormula(string codigo)
        {
            var _Codigo = Convert.ToInt32(codigo);
            var query = from c in db.Prod_Med_Produto_Formula
                        where c.id == _Codigo
                        select new { c.cod_Principio_Ativo, c.Prod_Med_Principio_Ativo.descricao};
            return Json(query);
        }

Answer 1

Chegando perto.  Observando no console aparece o valor indefindo:

<div class="editor-field col-md-6">

<select name="cod_Principio_Ativo" class="form-control" id="cod_Principio_Ativo">

<option value="undefined">Febendazol</option>

</select>

</div>

</div>

Answer 2

Chegando perto.  Observando no console aparece o valor indefindo:

<div class="editor-field col-md-6">

<select name="cod_Principio_Ativo" class="form-control" id="cod_Principio_Ativo">

<option value="undefined">Febendazol</option>

</select>

</div>

</div>

Porque retorna a descricao e não o cod_Principio_Ativo da ActionResult RetornaFormula?

Answer 3

Se eu determino um valor para o id "  options += '<option value="1">' + val["descricao"] + '</option>';" o código roda blz:

O que há de errado no "val"?

' + val["id"] + '

Answer 4

O erro está na linha: "var PrincipioID = $("#Formula_Existente").val();"

O que devo implementar para que o trecho "' + val["id"] + '" retorne com o "cod_Principio_Ativo"?

Abaixo as classes:

public partial class Prod_Med_Produto
    {
        public Prod_Med_Produto()
            
        public int id { get; set; }
        public Nullable<int> cod_Prod_Med_Formula { get; set; }
        public string nome_comercial { get; set; }       
        public Nullable<int> cod_Principio_Ativo { get; set; }
    
       
        public virtual Prod_Med_Principio_Ativo Prod_Med_Principio_Ativo { get; set; }
        public virtual Prod_Med_Produto_Formula Prod_Med_Produto_Formula { get; set; }
      
    }

 public partial class Prod_Med_Produto_Formula
    {
        public Prod_Med_Produto_Formula()
        {           
            this.Prod_Med_Produto = new HashSet<Prod_Med_Produto>();
        }
    
        public int id { get; set; }
        public string formula { get; set; }
        public Nullable<int> cod_Principio_Ativo { get; set; }    
      
        public virtual Prod_Med_Principio_Ativo Prod_Med_Principio_Ativo { get; set; }
        public virtual ICollection<Prod_Med_Produto> Prod_Med_Produto { get; set; }
       
    }

Answer 5

Resolvido:

    $("#cod_Prod_Med_Formula").change(function () {  
        var dados = $(this).val().toString();  
         var options = "";
        if (dados != 0) {
            $.ajax({
                url: '@Url.Action("RetornaPrincipio", "Medicamento_Produto")',
                type: 'POST',
                dataType: 'json',
                data: { codigo: dados },               
                success: function (result) {
                    $.each(result, function (key, val) {                    
                        options += '<option value="' + val["cod_Principio_Ativo"] + '" selected>' + val["descricao"] + '</option>';
                    });
                    $("#cod_Principio_Ativo").html(options);
                }
            });
        } else {
            console.log(options)
            $("#cod_Principio_Ativo").html(options);
        }
    }).change();