Очистить Rails удаленную форму после отправки usercript - PullRequest
Новая
       9

Очистить Rails удаленную форму после отправки usercript

0 голосов
/ 20 сентября 2019

Я изменяю форму POS (точка продажи), используя tampermonkey для загрузки пользовательского скрипта.До сих пор я добавил accesskey и remote-data к элементам, и это работает.Я пытаюсь заставить сканер штрих-кода работать на странице без взаимодействия.Ключ доступа фокусирует форму, а удаленные данные отправляют ее с помощью сообщения ajax.Это до сих пор прекрасно работает, за исключением того, что форма не ясно после отправки.Я нашел этот ответ:

Удаленная форма Clear Rails после отправки

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

$("#new_message").bind("ajax:beforeSend", function(event,xhr,status){
  $('#message_content').val('');
}

В моем случае форма #new_line_item под #scan-wrap.Есть два #new_line_item, и было бы хорошо применить к обоим.Один предназначен для штрих-кодов, а другой для ввода вручную (имеет автозаполнение).Это была моя попытка: 

    HTMLElement.prototype.findId = function(_id) {
        var childs = this.childNodes;

        for (var i = 0; i < childs.length; i++) {
            if(childs[i].nodeType == Node.ELEMENT_NODE) {
                if(childs[i].id == _id) {
                    return childs[i];
                }
            }
        }

        return null;
    }

    // Usage Example
    var parent = document.getElementById("scan-wrap");
    var form = parent.findId("new_line_item");
    parent.findId("new_line_item").setAttribute("data-remote", "true");
    form.findId("line_item_upc_code").setAttribute("accesskey", "b");
    form.bind("ajax:beforeSend", function(event,xhr,status){document.getElementById("line_item_upc_code").val('')});

form.bind - это не функция, это ошибка, которую я получаю, и, очевидно, она не работает.Если я понимаю, мне нужна функция, используемая для отправки туда?

Это форма: 

<div id="scan-wrap">
      <form class="simple_form form-inline" id="new_line_item" novalidate="novalidate" action="/sales/16291478/add_item" accept-charset="UTF-8" method="post" data-remote="true"><input name="utf8" type="hidden" value="✓"><input type="hidden" name="authenticity_token" value="tJHddPfCM5zkB5YFBYtC4zWp1DZSLDHcNKylmG0hVrrS7EhaDjh2N96m0dwprdU/TMAU78xNVZHstXmgm2P1Vw==">
          <input class="string optional form-control" id="line_item_upc_code" name="line_item[upc_code]" size="25" type="text" style="width: 100px;font-size: 10px;" placeholder="Scan a barcode" autofocus="" accesskey="b">
          <input class="numeric decimal optional" id="line_item_quantity" name="line_item[quantity]" step="any" type="number" value="1" style="width: 8ex;font-size: 10px;height:34px;">
          <input class="btn btn-default form-control" name="commit" type="submit" value="Scan UPC">
</form>    </div>

1 Ответ

1 голос
/ 20 сентября 2019

В этом коде: 

$("#new_message").bind("ajax:beforeSend", function(event,xhr,status){
  $('#message_content').val('');
}

"#new_message" заключено в объект JQuery с использованием $().В вашем коде: 

form.bind("ajax:beforeSend", function(event,xhr,status){document.getElementById("line_item_upc_code").val('')});

... вы не заключаете form в объект JQuery.Это означает, что form это просто капля HTML, и поэтому .bind не является функцией.Вы можете попробовать: 

$(form).bind("ajax:beforeSend", function(event,xhr,status){document.getElementById("line_item_upc_code").val('')});

И это может сработать, в зависимости от вашей версии JQuery.Как отмечено в документах :

Начиная с jQuery 3.0, .bind () устарел.Он был заменен методом .on () для присоединения обработчиков событий к документу начиная с jQuery 1.7, поэтому его использование уже не приветствуется.

Итак, вы можете сделать: 

$(form).on("ajax:beforeSend", function(event,xhr,status){document.getElementById("line_item_upc_code").val('')});
...