Reply To: I’m trying to optimize Editor in JavaScript.

[Markov]

Hi,

You can try this:

<template>
  <div>
    <smart-editor v-model="editorContent"></smart-editor>
    <button @click="validateEditor">Submit</button>
    <p v-if="errorMessage" style="color:red">{{ errorMessage }}</p>
  </div>
</template>

<script>
import "smart-webcomponents/source/styles/smart.default.css";
import "smart-webcomponents/source/modules/smart.editor.js";

export default {
  data() {
    return {
      editorContent: '',
      errorMessage: ''
    };
  },
  methods: {
    validateEditor() {
      //  Apply custom validation rules
      if (!this.editorContent || this.editorContent.trim() === '') {
        this.errorMessage = 'Editor content cannot be empty.';
        return;
      }

      // Example: Minimum length rule
      const textOnly = this.editorContent.replace(/<[^>]+>/g, '').trim();
      if (textOnly.length < 20) {
        this.errorMessage = 'Content must be at least 20 characters long.';
        return;
      }

      // Example: Prohibited word
      if (/forbiddenword/i.test(textOnly)) {
        this.errorMessage = 'Content contains forbidden words.';
        return;
      }

      this.errorMessage = '';
      alert('Validation passed! Submitting data...');
    
    }
  }
};
</script>

Best Regards,
Markov

Smart UI Team
https://www.htmlelements.com/