mirror of
https://github.com/bigskysoftware/htmx.git
synced 2025-09-28 21:41:40 +00:00
skip validation when novalidate or form submitted indirectly
This commit is contained in:
parent
5fd24a7096
commit
e01c7f77e4
17
src/htmx.js
17
src/htmx.js
@ -1506,7 +1506,7 @@ return (function () {
|
||||
return true;
|
||||
}
|
||||
|
||||
function processInputValue(processed, values, errors, elt) {
|
||||
function processInputValue(processed, values, errors, elt, validate) {
|
||||
if (elt == null || haveSeenNode(processed, elt)) {
|
||||
return;
|
||||
} else {
|
||||
@ -1544,12 +1544,14 @@ return (function () {
|
||||
values[name] = value;
|
||||
}
|
||||
}
|
||||
validateElement(elt, errors);
|
||||
if (validate) {
|
||||
validateElement(elt, errors);
|
||||
}
|
||||
}
|
||||
if (matches(elt, 'form')) {
|
||||
var inputs = elt.elements;
|
||||
forEach(inputs, function(input) {
|
||||
processInputValue(processed, values, errors, input);
|
||||
processInputValue(processed, values, errors, input, validate);
|
||||
});
|
||||
}
|
||||
}
|
||||
@ -1569,20 +1571,23 @@ return (function () {
|
||||
var values = {};
|
||||
var errors = [];
|
||||
|
||||
// only validate when form is directly submitted and novalidate is not set
|
||||
var validate = matches(elt, 'form') && elt.noValidate !== true;
|
||||
|
||||
// for a non-GET include the closest form
|
||||
if (verb !== 'get') {
|
||||
processInputValue(processed, values, errors, closest(elt, 'form'));
|
||||
processInputValue(processed, values, errors, closest(elt, 'form'), validate);
|
||||
}
|
||||
|
||||
// include the element itself
|
||||
processInputValue(processed, values, errors, elt);
|
||||
processInputValue(processed, values, errors, elt, validate);
|
||||
|
||||
// include any explicit includes
|
||||
var includes = getClosestAttributeValue(elt, "hx-include");
|
||||
if (includes) {
|
||||
var nodes = getDocument().querySelectorAll(includes);
|
||||
forEach(nodes, function(node) {
|
||||
processInputValue(processed, values, errors, node);
|
||||
processInputValue(processed, values, errors, node, validate);
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -26,6 +26,35 @@ describe("Core htmx client side validation tests", function(){
|
||||
form.textContent.should.equal("Clicked!");
|
||||
});
|
||||
|
||||
it('Novalidate skips form validation', function()
|
||||
{
|
||||
this.server.respondWith("POST", "/test", "Clicked!");
|
||||
|
||||
var form = make('<form hx-post="/test" hx-trigger="click" novalidate>' +
|
||||
'No Request' +
|
||||
'<input id="i1" name="i1" required>' +
|
||||
'</form>');
|
||||
form.textContent.should.equal("No Request");
|
||||
form.click();
|
||||
this.server.respond();
|
||||
form.textContent.should.equal("Clicked!");
|
||||
});
|
||||
|
||||
it('Validation skipped for indirect form submission', function()
|
||||
{
|
||||
this.server.respondWith("POST", "/test", "Clicked!");
|
||||
|
||||
var form = make('<form hx-post="/test" hx-trigger="click">' +
|
||||
'No Request' +
|
||||
'<input id="i1" name="i1" required>' +
|
||||
'<button id="button" hx-post="/test" hx-target="form"></button>' +
|
||||
'</form>');
|
||||
form.textContent.should.equal("No Request");
|
||||
byId("button").click();
|
||||
this.server.respond();
|
||||
form.textContent.should.equal("Clicked!");
|
||||
});
|
||||
|
||||
it('HTML5 pattern validation error prevents request', function()
|
||||
{
|
||||
this.server.respondWith("POST", "/test", "Clicked!");
|
||||
|
Loading…
x
Reference in New Issue
Block a user