Django - используя HTMX, какой символ размещается/вставляется при табуляции по ячейкам таблицы?
У меня есть таблица, а внутри таблицы находится форма. Каждая ячейка в таблице имеет тег input и отображает объект. Этот объект может быть изменен напрямую, потому что я использую htmx для обнаружения нажатия клавиш в каждой ячейке. Мое представление берет данные сообщения каждый раз, когда срабатывает htmx, и проверяет их. Если эти данные не равны одному из вариантов ввода, я не сохраняю объект. Кроме того, я изменяю границу ячейки на красный цвет. Это сработало, как и ожидалось. Далее я изменил код таким образом, чтобы пробелы удалялись из данных сообщения. Это также сработало, как и ожидалось.
шаблон
<form action="" method="post" class="form-group">
{% for student in student_list %}
<tr>
{% for g in grade_list %}
{% if g.student.id == student.id %}
<td>
<input type="text" hx-post="{% url 'gradebook:grade-change' g.pk %}" hx-swap="outerHTML" hx-trigger="keyup delay:1200ms" class="form-control score" title={{ g.score }} name="score" id="input-{{ forloop.counter0 }}" placeholder={{ g.score }} required>
</td>
{% endif %}
{% endfor %}
</tr>
{% endfor %}
</form>
view
def post(self, request, *args, **kwargs):
grade = self.get_object()
user = grade.user
ns = request.POST.get('score')
new_score = ns.upper()
print(new_score)
# remove whitespace and tabs
new_score = re.sub(r"[\n\t\s]*", "", new_score)
score_list = ["EXT", "APP", "DEV", "BEG", "I", "---"]
if new_score in score_list:
grade.score = new_score
grade.save()
grade_score = str(grade.score)
input_string = f'<input type="text" hx-post="{reverse("gradebook:grade-change", args=[grade.pk])}" hx-swap="outerHTML" hx-trigger="keyup delay:1200ms" class="form-control score" title="{ grade_score }" name="score" placeholder="{ grade.score }" required>'
else: # draw red border around the cell
input_string = f'<input type="text" hx-post="{reverse("gradebook:grade-change", args=[grade.pk])}" hx-swap="outerHTML" hx-trigger="keyup delay:1200ms" class="form-control score" border:solid rgb(255, 0, 0,.5);" title="{ grade.score }" name="score" placeholder="{ grade.score }" required>'
return HttpResponse(input_string)
Однако я заметил, что при использовании кнопки табуляции на клавиатуре для перемещения из ячейки в ячейку также срабатывает клавиша htmx. Я предположил, что это посылает \t в данные сообщения. Поэтому я добавил следующее в представление перед удалением пробельных символов, чтобы определить, была ли отправлена вкладка:
tab = False
if new_score.find("\t") != -1:
tab = True
Затем я изменил представление следующим образом:
else:
# if there was a tab, don't include the red border
if tab == True:
input_string = f'<input type="text" hx-post="{reverse("gradebook:grade-change", args=[grade.pk])}" hx-swap="outerHTML" hx-trigger="keyup delay:1200ms" class="form-control score" title="{ grade.score }" name="score" placeholder="{ grade.score }" required>'
else: # with no tab, draw red border around the cell
input_string = f'<input type="text" hx-post="{reverse("gradebook:grade-change", args=[grade.pk])}" hx-swap="outerHTML" hx-trigger="keyup delay:1200ms" class="form-control score" border:solid rgb(255, 0, 0,.5);" title="{ grade.score }" name="score" placeholder="{ grade.score }" required>'
return HttpResponse(input_string)
Однако это не работает. Перемещение из ячейки в ячейку с помощью клавиши табуляции всегда заканчивается tab == False и вокруг ячейки появляется красная рамка. Я не верю, что \t отображается. Если посмотреть журнал для print(new_score), похоже, что при использовании клавиши табуляции в таблице публикуются пробельные символы. Я проверил \t \n \s, но ни один из них не делает tab = True.
tab = False
if new_score.find("\t") != -1 or new_score.find("\n") != -1 or new_score.find("\s") != -1:
tab = True
Есть идеи, что делает клавиша tab в таблице, или какой символ/строка вызывается в htmx?