这里有一个非常基本和粗糙的方法来实现你所需要的。
有时我自己也会使用它进行快速验证,帮助客户避免遗漏任何重要内容。
我创建了相同的自定义post类型slug,因此css/js目标将与您的类似。
一旦你有了这个概念,无论你需要什么,都要改变它。将css和js代码移动到适当的文件中,添加相关注释,您就有很大的空间来做您需要的事情。
add_action(\'admin_footer\', \'bt_before_submit_validation\');
function bt_before_submit_validation () {
?>
<style>
.post-type-appointments .custom-error {
padding: 10px;
box-sizing: border-box;
display: block;
}
.post-type-appointments #publishing-action {
position: relative;
width: 100%;
}
.post-type-appointments #publishing-action .vbs-btn {
width: 100%;
height: 100%;
position: absolute;
z-index: 1;
top: 0;
left: 0;
}
</style>
<script>
($ => {
// add facade submit button
// This button will be used to trigger validation before submit
// (change "Validate and Publish") to what ever you want
$(\'.post-type-appointments #publishing-action [type="submit"]\').before(\'<button type="button" class="vbs-btn button button-primary">Validate and Publish</button>\');
// now that we have a button we can use it to start validating
$(document).on(\'click\', \'.post-type-appointments #publishing-action .vbs-btn\', e => {
// we will do a basic validation for title
const $this = $(e.currentTarget);
// remove all previous errors
$(\'.custom-error\').remove();
// will indicate if validation was successful
// by default we assume everything is good, once we encounter a problem we will change this to false
let isValid = true;
// get the elements
const $title = $(\'[name="post_title"]\');
// get the value
const titleVal = $title.val().trim();
// validate title field
if (!titleVal) {
isValid = false;
$title.after(\'<span class="custom-error notice notice-error">Title field cannot be empty</span>\');
} else if (titleVal.length < 10) {
isValid = false;
$title.after(\'<span class="custom-error notice notice-error">Title field must contain at least 10 characters.</span>\');
} // continue adding as many validations as needed
// validation faild, return
if (!isValid) return;
// everything is ok, lets continue
// trigger click on submit button
$this.next(\'[type="submit"]\').click();
// remove the facade button, this is optional
$this.remove();
});
})(jQuery);
</script>
<?php
}
如果出现问题,请确保检查css/js目标。
为了创建appointments
岗位类型