Сбор и обработка данных, как только они введены

Question

Ищем ваше предложение о хорошем способе справиться со следующим.

Нужна форма быстрого ввода для приложения получения веб-формы сканирования.Это будет собирать штрих-коды, отсканированные с пакетов, один за другим.

сканы будут поступать с bluetooth-сканера в поле ввода.после сканирования сканер вставит CR.

. В этот момент я просто хочу захватить данные и передать их на контроллер для обработки, очистить поле и немедленно вернуть управление обратно на веб-страницу для следующего сканирования..

Самыми большими проблемами являются:

1. Скорость - скорость должна быть высокой, так как они выполняют сканирование в режиме реального времени.
2. Сохранение поля ввода, фокус всехвремя, чтобы при сканировании их не было в каком-либо другом поле на экране.Они начнутся в поле ввода, мне просто нужно убедиться, что они автоматически возвращаются к нему после каждого сканирования автоматически.

Есть какие-нибудь мысли о том, как вам лучше всего справиться?

Вот мой HTML:

<input type="text" 
   id="barcode" 
   name="barcode" 
   value="" 
   onchange="location.href='@Url.Action("scanned", "receiveScan")?barcode=' + $('#barcode').val()"><br>

И это действие контроллера:

 public ActionResult scanned(string barcode)
    {
        //code to process goes here
        return Ok();
    }

После этого он сбрасывает веб-страницу на пустую страницу.

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

У меня все работает, изменив контроллер на:

   public ActionResult scanned(string barcode)
{
    var test = barcode;
    //code to process goes here
  return  RedirectToAction("receiveScan", "home");

}

Но было отмечено, чтоперепостить всю страницу не очень хорошая идея.Я попробую одно из приведенных ниже решений, как только смогу вернуться к нему.

Спасибо за помощь, вот код, который сработал -

 $('#textArea1').val('Scans - ');
$(function () {
    $("#barcode").on("change", function (e) {
        // get the current value
        var barcode = $('#barcode').val();

        // if there's no text, ignore the event
        if (!barcode) {
            return;
        }
       // clear the textbox
        $("#barcode").val("");

       // var holdit = $('#textArea1').val();
        $('#textArea1').val($('#textArea1').val() +' '+ barcode);
         // post the data using AJAX
    $.post('@Url.Action("scanned", "receiveScan")?barcode=' + barcode);
    });
})

Answer 1

Вместо того, чтобы выполнять полную обратную передачу, вы должны использовать вызов AJAX, чтобы убедиться, что страница загружена не полностью.

Вот пример того, как вы могли бы сделать это (непроверенные, могут иметь опечатки):

<input type="text" id="barcode" name="barcode"/>

$(function() 
{
    $("#barcode").on("change", function (e)
    {
        // get the current value
        var barcode = $('#barcode').val();

        // if there's no text, ignore the event
        if (!barcode)
        {
            return;
        }

        // clear the textbox
        $("#barcode").val("");

        // post the data using AJAX
        $.post('@Url.Action("scanned", "receiveScan")?barcode=' + barcode);
});

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