sohit
sohit

Reputation: 1

Jquery validate plugin validation with thymeleaf not working

Validation not working when I click submit button because of th:field, but if do not use it (th:field) validation working fine. So please help me out.

Html code

<input class="input-text full-width" type="text" th:name="houseNo" th:field="*{billingInfo.houseNo}" th:id="houseNo" placeholder="House No" />

jQuery code

$("#review").validate({

        rules: {
            houseNo: "required"
        },
        messages: {
            houseNo: $("#houseN").text()
        },
        submitHandler: function(form) {
            alert("submit here");
            form.submit();
        }
    });

Upvotes: 0

Views: 1167

Answers (1)

Metroids
Metroids

Reputation: 20487

th:field overwrites the name and value properties of the <input /> it is attached to. (And additionally, it's will generate the id if it has not already been chosen.

w/th:field

Therefore, you need to change your javascript to match what th:field is doing.

<input class="input-text full-width" type="text" name="billingInfo.houseNo" id="houseNo" placeholder="House No" />

goes with

$("#review").validate({
    rules: {
        "billingInfo.houseNo": "required"
    },
    messages: {
        "billingInfo.houseNo": $("#houseN").text()
    },
    submitHandler: function(form) {
        alert("submit here");
        form.submit();
    }
});

Upvotes: 1

Related Questions