JavaScript не работает, если я добавляю Thymeleaf th: field при попытке отключить / включить поля ввода

Question

У меня есть несколько полей ввода в моем коде, которые мне нужно включить или отключить в зависимости от того, какой флажок установлен.Он работал нормально, пока я не добавил часть th: field для хранения значения полей в объекте th :.Теперь мой JavaScript не работает, поэтому поля всегда остаются отключенными.

Это одно из полей в моем html-файле:

<div class="form-group form-inline form-xtra required">
    <label>Texto mensaje:</label>
    <div class="form-item">
        <textarea cols="200" name="seleccionExcel" class="user-form-control 
        input-md" th:field="*{mensaje}" id="textoExcel" disabled="disabled"> 
        </textarea>
    </div>
</div>

Это файл JavaScript:

$(function() {

$(".introducirManual").click(function(){
    $('input[name="seleccionManual"]').prop('disabled', false);
    $('textarea[name="seleccionManual"]').prop('disabled', false);  
    $('input[name="seleccionExcel"]').prop('disabled', true);
    $('input[name="seleccionExcel"]').val('');
    $('textarea[name="seleccionExcel"]').prop('disabled', true);
    $('textarea[name="seleccionExcel"]').val('');
});

$(".introducirExcel").click(function(){  
    $('input[name="seleccionExcel"]').prop('disabled', false);
    $('textarea[name="seleccionExcel"]').prop('disabled', false);
    $('input[name="seleccionManual"]').prop('disabled', true);
    $('input[name="seleccionManual"]').val('');
    $('textarea[name="seleccionManual"]').prop('disabled', true);
    $('textarea[name="seleccionManual"]').val('');
    $('input[id="numLibreta"]').val('');
});

});

Если я уберу

th: field = "* {mensaje}"

, скриптснова работает нормально.

Должен ли я изменить способ обращения к полю в моем файле JavaScript при использовании Thymeleaf?

Answer 1

Измените имя текстовой области, как показано ниже,

$('textarea[name="mensaje"]').prop('disabled', true);

Атрибут th: поле заменит атрибуты значение и имя во входном теге,

<textarea cols="200" name="seleccionExcel" class="user-form-control  input-md" th:field="*{mensaje}" id="textoExcel" disabled="disabled"> </textarea>

приведенная выше строка кода похожа на:

<textarea cols="200" name="mensaje" class="user-form-control  input-md" id="textoExcel" disabled="disabled"> </textarea>