Home / Questions / 286342
Accepted
sunflower
Asked: 2020-08-17 10:10:08 +0800 CST 2020-08-17 10:10:08 +0800 CST

How to fill an input according to the value of another? ASP.NET MVC

  • 772

I have a form on my web page in which I need that when a user enters a Code in an input in another input, the Name is auto-completed. I have the code shown below, but it does nothing. I have two tables: TablaCodigos: Codigo_p varchar ...

TablePersonas Codigo_p varchar Name varchar ...

my script

<script type="text/javascript">
$("#Codigo_p").change(function () {
$.getJSON("/Solicitud/GetPersona?Codigo_p=" + $("#Codigo_p").val(), function (result) 
{
            var select = $("#nombreP");
            select.empty();
            $.each(result, function (index, itemData) {
            select.append($({
            value: itemData.Nombre
            }));
        });
    });
 }
</script>

my controller

public JsonResult GetPersona(string Codigo_p)
{
  bd.Configuration.ProxyCreationEnabled = false;
  TablaPersonas nom_p = bd.TablaPersonas.Where(x => x.Codigo_p == Codigo_p).Single();
  return Json(nom_p, JsonRequestBehavior.AllowGet);
}

HTML

<div class="form-group">
<div class="m-0 font-weight-bold text-primary subtitulo">Persona:</div>
<input type="text" class="form-control" id="nombreP" name="nombreP" placeholder="Nombre" readonly="" >
</div>

enter image description here

enter image description here

enter image description here

ajax

2 Answers

  1. Best Answer

    You don't need a loop to iterate through the results because the response is just an object. To set the value you can set the input value equal to the property you want like so:

    $.getJSON("/Solicitud/GetPersona?Codigo_p=" + $("#Codigo_p").val(), function (result) 
{
            var select = $("#nombreP");
            select.empty();
            select.val(result.Nombre);                
        });
    });
 }

    Or to simplify your code, the following line is equivalent:

    $("#nombreP").val(result.Nombre);
    • 9

  2. From input I see that when select you empty it before filling the other input

    var select = $("#nombreP");
select.empty();

    What I would do is something like this

    $("#Codigo_p").change(function(){
      var select = $("#nombreP");
      $('#id_input_a_rellenar').val(select);
});

    I hope it works for you!

    • 3