jQuery Validation Set По умолчанию не работает на laravel - PullRequest
0 голосов
/ 05 июня 2019

Я работаю над проектом laravel, где я загружаю файлы библиотеки

bootstrap.js

window._ = require('lodash');
window.moment = require('moment');

/**
 * We'll load jQuery and the Bootstrap jQuery plugin which provides support
 * for JavaScript based Bootstrap features such as modals and tabs. This
 * code may be modified to fit the specific needs of your application.
 */

try {
    window.Popper = require('popper.js').default;
    window.$ = window.jQuery = require('jquery');

    require('bootstrap');
    require('sweetalert2/dist/sweetalert2.all.min.js');

    require('jquery-validation/dist/jquery.validate.js');
    require('jquery-validation/dist/additional-methods.js');
    require('jquery-ui-dist/jquery-ui.min.js');
    require('datatables.net/js/jquery.dataTables.min.js');
    require('datatables.net-bs4/js/dataTables.bootstrap4.min.js');

} catch (e) {}




/**
 * We'll load the axios HTTP library which allows us to easily issue requests
 * to our Laravel back-end. This library automatically handles sending the
 * CSRF token as a header based on the value of the "XSRF" token cookie.
 */

window.axios = require('axios');

window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

/**
 * Next we will register the CSRF Token as a common header with Axios so that
 * all outgoing HTTP requests automatically have it attached. This is just
 * a simple convenience so we don't have to attach every token manually.
 */

let token = document.head.querySelector('meta[name="csrf-token"]');

if (token) {
    window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
} else {
    console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token');
}

/**
 * Echo exposes an expressive API for subscribing to channels and listening
 * for events that are broadcast by Laravel. Echo and event broadcasting
 * allows your team to easily build robust real-time web applications.
 */

// import Echo from 'laravel-echo'

// window.Pusher = require('pusher-js');

// window.Echo = new Echo({
//     broadcaster: 'pusher',
//     key: process.env.MIX_PUSHER_APP_KEY,
//     cluster: process.env.MIX_PUSHER_APP_CLUSTER,
//     encrypted: true
// });

app.js

require('./bootstrap');

require('./init');

require('./login');

init.js

jQuery.validator.setDefaults({
        errorElement: 'span',
        errorPlacement: function (error, element) {
            error.addClass('invalid-feedback');
            element.closest('.form-group').append(error);
        },
        highlight: function (element, errorClass, validClass) {
            $(element).addClass('is-invalid');
        },
        unhighlight: function (element, errorClass, validClass) {
            $(element).removeClass('is-invalid');
        }
    });

jQuery Validator работает нормально, но setDefaults не установлен.

package.json

"devDependencies": {
        "@fortawesome/fontawesome-free": "^5.8.2",
        "animate.css": "^3.7.0",
        "axios": "^0.19",
        "bootstrap": "^4.3.1",
        "cross-env": "^5.1",
        "datatables.net-bs4": "^1.10.19",
        "jquery": "^3.4.1",
        "jquery-ui-dist": "^1.12.1",
        "jquery-validation": "^1.19.0",
        "laravel-mix": "^4.0.7",
        "lodash": "^4.17.11",
        "moment": "^2.24.0",
        "popper.js": "^1.15.0",
        "resolve-url-loader": "^2.3.1",
        "sass": "^1.15.2",
        "sass-loader": "^7.1.0",
        "sweetalert2": "^8.11.6",
        "vue-template-compiler": "^2.6.10"
    }

Примечание: у меня есть другой проект WordPress, где коды работают нормально, а сообщение об ошибке соответствует точно так, как ожидалось.

Я скопировал ответ с

плагин проверки jQuery и Bootstrap 4

Фактический вывод enter image description here

Ожидаемый результат (из моего другого проекта WordPress)

enter image description here

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...