Inline validation not working as expected

Need Help
#1

in my theme I have `{% framework extras %}

my html is like

<form method="POST" action="http://app.oc-abc.test/product/challenge-discipline-le-10-20-30/pricing/edit" accept-charset="UTF-8" data-request="CampusProductDetail::onPostProductPricing" id="productDetailsForm" class="max-w-4xl mx-auto" data-request-validate="" data-request-flash="*" data-request-update="'layout\/product_summary':'#partialProductSummary'" data-request-files="">

<input aria-label="Price" class="form-control " value="0" id="price" name="price" autocomplete="off" placeholder="0.00" type="text">
<div data-validate-for="price"></div>

my AJAX handle is checking the price value like

$rules = [
    'price' => 'required|numeric|gt:0'
];
$validation = Validator::make(
    $data,
    $rules,
);

if ($validation->fails()) {
    throw new ValidationException($validation);
}

all seems to be normal. the validation exception is thrown
but I can’t see any inline validation error.

what am I missing there?

#2

This example works

title = "AJAX Validation"
url = "/ajax-validation"
layout = "default"
==
<?
function onDoSomething()
{
    $data = post();

    $rules = [
        'username' => 'required',
        'email' => 'required|email',
    ];

    $validation = Validator::make($data, $rules);

    if ($validation->fails()) {
        throw new ValidationException($validation);
    }

    // Check the username again
    $this->onCheckUsername();

    if (time() % 2) {
        Flash::warning('Jobs almost done...');
    }
    else {
        Flash::success('Jobs done!');
    }
}

function onCheckUsername()
{
    $usernameTaken = in_array(strtolower(trim(post('username'))), ['admin', 'jeff']);

    if ($usernameTaken) {
        throw new ValidationException(['username' => 'Username is taken!']);
    }
}
?>
==
<form
    data-request="onDoSomething"
    data-request-validate
    data-request-flash="*">

    <div>
        <label>Username</label>
        <input name="username" data-request="onCheckUsername" data-track-input data-attach-loading />
        <span data-validate-for="username"></span>
    </div>

    <div>
        <label>Email</label>
        <input name="email" />
        <span data-validate-for="email"></span>
    </div>

    <button
        type="submit"
        class="btn btn-primary"
        data-attach-loading>
        Submit
    </button>

    <div class="alert alert-danger" data-validate-error>
        <p data-message></p>
    </div>

</form>
#3

thanks @daft

weird I dont see any difference with my version.

and do you include {% framework extras %} ?