Question

我正在使用具有销售系统的asp.net核心的Web应用程序（MVC）。

在我的销售订单创建中，我有一个字段，当用户开始键入时，建议要选择的文本。问题是：我需要用户选择文本时，与该信息相关的其他字段会自动完成。

我尝试实现我的控制器并查看（如下所示），但我唯一能做的就是建议字段#searchCNPJ，而无需填写#nomeCliente

控制器

public IActionResult AutoComplete_Cliente()
{
      var name = HttpContext.Request.Query["term"].ToString();
      var cnpj = _context.Juridicos.Where(pf => pf.CNPJ.Contains(name)).Select(pj => pj.CNPJ).ToList();

      return Ok(cnpj);
}

查看

<div class="form-row mt-2">
    <div class="col col1 col-sm-3 disabled">
        <label class="control-label">CNPJ/CPF CLIENTE</label>                
        <input id="searchCNPJ" type="text" name="SearchString" class="form-control" placeholder="" />
    </div>
    <div class="col col3 col-sm-9">
        <label class="control-label">NOME CLIENTE</label>
        <input id="nomeCliente" class="form-control disabled" />
    </div>
</div>

 @section Scripts{
        <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
        <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
        <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>        
        <script>
            $(function () {
                $("#searchCNPJ").autocomplete({
                    source: '/Pedidos/AutoComplete_Cliente'
                });
            });
        </script>
    }

我也为控制器尝试了以下代码，但是我不完全知道如何在我的视图中实现

 public IActionResult AutoComplete_Cliente(string cpf)
{
    var name = HttpContext.Request.Query["term"].ToString();           
    var cnpj = _context.Juridicos.Where(pj => pj.CNPJ.Contains(name)).Select(pj => new SelectListItem { Value = pj.CNPJ, Text = pj.RAZAO_SOCIAL,}).ToList();

    return Ok(cnpj);
}

Answer 1

这是一个简单的演示，如下所示：

1。型号：

public class Test
{
    public int Id { get; set; }
    public string CNPJCLIENTE { get; set; }
    public string NOMECLIENTE { get; set; }
}

2。视图：

<div class="form-row mt-2">
    <div class="col col1 col-sm-3 disabled">
        <label class="control-label">CNPJ/CPF CLIENTE</label>                
        <input id="searchCNPJ" type="text" name="value" class="form-control" placeholder="" />
    </div>
    <div class="col col3 col-sm-9">
        <label class="control-label">NOME CLIENTE</label>
        <input id="nomeCliente" class="form-control disabled" />
    </div>
</div>
@section Scripts{
    <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <script>
        $(function () {          
            $("#searchCNPJ").autocomplete({
                source: '/Home/Test'              
            });
        });          
        $('#searchCNPJ').on('autocompletechange change', function () {
            var data = this.value;
                $.ajax({
                    type: "Get",
                    url: "/Home/Test2?name="+data,
                    success: function (data) {
                        console.log(data);
                        $('#nomeCliente').val(data);
                    }
               })                     
             }).change();
    </script>
}

3.Controller：

public class HomeController : Controller
{
    private readonly YourContext _context;
    public HomeController(YourContext context)
    {
        _context = context;
    }
    public IActionResult Test()
    {
        //provides suggestions while you type into the field
        var name = HttpContext.Request.Query["term"].ToString();
        var CNPJCLIENTE = _context.Tests.Where(c => c.CNPJCLIENTE.Contains(name)).Select(c => c.CNPJCLIENTE).ToList();
        return Ok(CNPJCLIENTE);
    }
    [HttpGet]
    public JsonResult Test2(string name)
    {
        //fill input fields when you select CNPJ CLIENTE
        var NOMECLIENTE = _context.Tests.Where(c => c.CNPJCLIENTE == name).Select(c => c.NOMECLIENTE).ToList();
        return new JsonResult(NOMECLIENTE);
    }
}

4。结果（当您输入字母时，它会为您提供建议。然后选择一个项目并单击任意位置以触发更改事件）：

选择建议字段的值后，是否可以填充输入字段？

1 个答案: