создайте кнопку обновления для текстового поля

#javascript #jquery #model-view-controller

#javascript #jquery #модель-представление-контроллер

Вопрос:

Я пытаюсь создать кнопку обновления для моего model.id в помощнике html. Я работаю над проектом ERP, поэтому приложением будут пользоваться несколько пользователей, поэтому мне нужна кнопка обновления, поэтому я попробовал этот код ввода MVC здесь

  @Html.EditorFor(model => model.Id, new { id="code", @class = "form-control "})
<button id="button1" style="border: none;width: 50px;height: 50px;" value="Refresh"><i class="fas fa-sync"></i></button>

javascript—

  $("#button1").click(function (event) {
        alert('Clicked')
        $("#code").val('model.Id')
    });

но это не работает, пожалуйста, дайте несколько предложений по вводу кода здесь

1. используйте document.on(‘click’) вместо click

2. Похоже, вы пытаетесь выполнить обновление с сервера ( «несколько человек используют приложение» ) — так ли это? Похоже, вам нужно выполнить вызов ajax, чтобы получить последнее значение

Ответ №1:

Самый простой способ добиться этого — добавить новый data атрибут к элементу в вашем EditorFor , который отображает значение. Этот атрибут должен содержать начальное значение элемента управления. Затем в вашем JS, при нажатии кнопки «обновить», верните текущее значение к исходному, например:

 $("#button1").click(function(e) {
  $("#code").val(function() {
    return $(this).data('original-value');
  });
});

 #button1 {
  border: none;
  width: 50px;
  height: 50px;
}

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- @Html.EditorFor(model => model.Id, new { id="code", @class = "form-control", }) -->
<input type="text" id="code" data-original-value="foobar" value="foobar" />
<button id="button1" value="Refresh"><i class="fas fa-sync"></i> Refresh</button>