Есть ли способ заполнить поля ввода после выбора значения поля предложения? - PullRequest
Новая
       58

Есть ли способ заполнить поля ввода после выбора значения поля предложения?

0 голосов
/ 06 ноября 2019

Я работаю в веб-приложении (MVC) с ядром системы продаж asp.net.

В моем создании заказа на продажу у меня есть поле, которое, когда пользователь начинает печатать, предлагаеттекст для выбора. Дело в том, что мне нужно, чтобы, когда пользователь выбирает текст, другие поля, связанные с этой информацией, заполнялись автоматически.

Я пытался реализовать свой контроллер и представление (как показано ниже), но единственное, что я мог сделать, это поле предложения #searchCNPJ без заполнения # nomeCliente

Controller 

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);
}

View 

<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);
}

1 Ответ

0 голосов
/ 07 ноября 2019

Вот простая демонстрация, как показано ниже:

1.Модель: 

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

2.View: 

<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.Контроллер: 

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.Результат (когда вы набираете букву, вы получите предложения. Затем вы выбираете один элемент и щелкаете в любом месте , чтобы вызвать событие изменения): enter image description here

...