I cannot focus on how to download and implement these frameworks in your project because these are all in CKEditor documentation!!!

Introduction

CKEditor is a popular web-based text editor that provides a rich set of features for creating and editing content on websites. It's often used in web development to allow users to input and format text in a WYSIWYG (What You See Is What You Get) manner. Here are some key points about CKEditor:

1. Features: CKEditor offers a wide range of features, including text formatting, image embedding, table creation, and more. It can be customized to fit the specific needs of a website or application.

2. Open Source: CKEditor is an open-source project, which means it's freely available for developers to use and modify. It is released under the GPL and commercial licenses.

3. Integration: It can be easily integrated into various web development frameworks and content management systems (CMS) like WordPress, Drupal, and more.

4. Customization: CKEditor can be customized to match the design and functionality requirements of a specific project. Developers can add or remove plugins and configure settings as needed.

5. Accessibility: It's designed with accessibility in mind, making it compliant with WCAG and Section 508 standards to ensure that people with disabilities can use it effectively.

6. Browser Compatibility: CKEditor is compatible with major web browsers, ensuring a consistent experience for users.

Community and Support: There is an active CKEditor community and documentation available, making it easier to get help and find resources for using and customizing CKEditor.

ISSUE EXPLANATION

I will faced an issue while I'm getting the data from the text to update the database even though I will get a correct response but I cannot get the data

When using CKEditor with text areas, you typically don't directly get the content from text areas using standard JavaScript or jQuery. CKEditor replaces the text areas with its own editor instances, and to get the content from CKEditor text areas, you should use CKEditor's APIs.

If you try to get the content of CKEditor text areas with standard jQuery methods like val(), it might not work correctly because CKEditor doesn't store the content directly in the <textarea>. Instead, it manipulates the content in its own internal structure.

So, when you use CKEditor, you should get the content from CKEditor instances using CKEditor's methods. Here's how you can do it:

Include CKEdit/or in your HTML page:

<script src="path-to-ckeditor/ckeditor.js"></script>

Initialize CKEditor for your text areas:

CKEDITOR.replace('dlsiteaboutTextarea', {
    // CKEditor configuration options can be added here
});

// Repeat this for other text areas as well

To get the content from CKEditor text areas in your JavaScript, use CKEditor's getData() method:

var dlsiteabout = CKEDITOR.instances.dlsiteaboutTextarea.getData();
var dlsiteterms = CKEDITOR.instances.dlsitetermsTextarea.getData();
// Repeat for other text areas

when using CKEditor, use CKEditor's API methods to interact with the content of CKEditor instances.

Example:

Update your HTML form to include the "Job" text area with a unique ID:

  <div class="col-6">
            <div class="card_form">
                <div class="form-group">
                    <label for="dlsitecmsjobTextarea">Job</label>
                    <textarea name="dlsitecmsjob" class="ckeditor" id="dlsitecmsjobTextarea" cols="80" rows="10">
                        <?php echo $dlsitecmsjob; ?>
                    </textarea>
                </div>
            </div>
        </div>

Update your JavaScript (jQuery) code to handle the CKEditor instance for the "Job" text area and submit the form data using AJAX:

$(document).ready(function () {
    // Initialize CKEditor for the "Job" text area
    CKEDITOR.replace('jobTextarea');

    $("#submitBtn").click(function (e) {
        e.preventDefault();
        // Get CKEditor content for the "Job" text area
        var dlsitecmsjob = CKEDITOR.instances.jobTextarea.getData();

        // Create an object with the updated "Job" content
        var formData = {
            dlsitecmsjob: dlsitecmsjob,
        };

        $.ajax({
            type: "POST",
            url: "PHP/cms_ajax.php",
            data: formData,
            success: function (data) {
                if (data === '1') {
                    location.reload();
                } else {
                    alert("0");
                }
            },
            error: function (xhr, status, error) {
                console.log("AJAX error: " + error);
            },
        });
    });
});

CONCLUSION

This approach ensures that you correctly retrieve the content from CKEditor text areas. If you attempt to get the content of CKEditor text areas with standard val() or similar methods, you might encounter issues. So, in summary, when using CKEditor, use CKEditor's API methods to interact with the content of CKEditor instances.

---

I hope this guide helps you become a master of JavaScript's ckeditor. Happy coding!