Add icon before field error message

Add icon before field error message

frankliamfrankliam Posts: 1Questions: 1Answers: 0

Hi,
I'm using Editor with PHP, and I'm trying to add an icon before the error message.
I used to inject the icon directly in the backend but I'm tyiding things up.

I though I could use onFieldError inside formOptions as such:

formOptions: {
            main: {
                ...,
                onFieldError: function (editor, error) {
                    var fieldName = error.name;
                    var errorMsg = error.status;

                    var iconHtml = '<i class="bi bi-exclamation-circle-fill"></i> ';
                    var customErrorMsg = iconHtml + errorMsg;

                    editor.field(fieldName).error(customErrorMsg);
                }
            }
        }

but with this, I only get the icon on the first field error message: all the others just have the error message.

Doesn't onFieldError automatically apply to all errors?

Answers

  • allanallan Posts: 63,676Questions: 1Answers: 10,497 Site admin

    What I would suggest doing here is listening for postXhr and checking to see if there is a fieldErrors array on the JSON object, and if so, looping over it modifying the status string as needed.

    The current onFieldError doesn't work for anything other than the first field in error as I explicitly have a i === 0 index check before executing the callback. The idea there was the if the function changes focus (which is how I was expecting it to be used) then you only want that to happen for the first field, not all of them.

    Perhaps that needs to be changed. Certainly the docs need to mention this - apologies for that oversight. I'll do that just now.

    Allan

Sign In or Register to comment.