Is it possible to capture user input using a rich text editor such as Quill and save the data as a .json file by sending a POST request?

My website features a sophisticated text editor known as ngx-quill, where users can input their content. I am currently working on a project that requires me to generate a JSON file containing user input and then submit this JSON file.

I am seeking guidance on the process of creating a JSON file with the user input in ngx-quill.

Answer №1

I want to integrate Quill.js - a powerful Rich Text Editor - into my Laravel project.

However, Quill requires the following HTML structure:

<div id="editor"></div> || <div id="editor" name="body"></div>

Instead of the traditional:

<textarea id="editor" name="body"></textarea>

$post->body = $request->input('body');

This setup does not work as expected. How can I store the content from a div with the id of #editor into a database?

Thank you

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Fetching and displaying JSON objects in a Rails view

I have implemented a search functionality on my Rails application. The Search controller is responsible for fetching spaces based on a query in the model, and then returning them as JSON. In order to retrieve this data, I am utilizing $.getJSON within a vi ...

Managing database downtime with TypeORM

In the event that my MSSQL server experiences a crash and an app client makes a request to the API, the current behavior is for it to endlessly spin until Express times out the unanswered request. By enabling logging in TypeORM, I am able to observe the e ...

Converting a JSON array into a single concatenated string

Currently, I am parsing a JSON file that contains data about multiple users. { "SRM": [{ "title": "Firstname Surname", "image": "firstname", "subtitle":"the subtitle" }, { "title": "Firstname Surname", "image": "firstname", "s ...

Access the plugin object from a Vue.js 2 component using typescript

I devised a plugin object to handle the regular expressions used in my application in a more global manner. Here's an example of how it looks: import Vue from "vue"; Vue.prototype.$regex = { //isEmail function implementation goes here } ...

Sending a request to a JSON file using Ajax

I have 2 questions: 1. I am trying to run this file, but it is not giving any errors or showing results. Please help me identify the problem. 2. I added a dropdown menu in my HTML file, but I'm unsure how to use it to display a list of names. Any sugg ...

What is the best way to remove the underline from Angular Material input fields?

I am currently working with an input element in Angular Material: <md-input-container> <input type="text" mdInput placeholder=""> </md-input-container> While the input is focused, it displays an underline. Is there a way to hide or remo ...

Is the Kendo Spreadsheet supported in Angular 2?

We are interested in knowing if future releases of Angular2 will include Kendo Spreadsheet or the ability to export data to Excel for the grid. We currently use the Angular1 version and would like to upgrade, so having these features available in Angular2 ...

You appear to be missing a dependency on either "@angular/core" or "rxjs" when attempting to deploy your MEAN app on Heroku. This issue must be resolved

I encountered an issue while trying to deploy my MEAN-stack application on Heroku. My app was built mainly following this tutorial series. However, during the deployment process by pushing to GIT, I received the following error: <a href="/cdn-cgi/l/emai ...

The incorrect initial state is causing issues in the Zustand state management on the Next.js server side

While utilizing zustand as a global state manager, I encountered an issue where the persisted states were not being logged correctly in the server side of nextjs pages. The log would only show the default values (which are null) and not the updated state v ...

Is there a function in Zod similar to Yup's oneOf()?

If I wanted to restrict a property to specific values using Yup, it could be achieved with the code snippet below: prop: Yup.string().oneOf([5, 10, 15]) However, I haven't found a similar method in Zod. Nonetheless, I can still validate it by: const ...

Exploring the TypeScript Type System: Challenges with Arrays Generated and Constant Assertions

I am currently grappling with a core comprehension issue regarding TypeScript, which is highlighted in the code snippet below. I am seeking clarification on why a generated array does not function as expected and if there is a potential solution to this pr ...

What is the procedure for extracting data from a JSON encoded string in PHP?

I've been trying to get a value from JSON encode, but I can't seem to figure out what I'm doing wrong. Can someone please help me? I'm still new at this so please be patient :) Here's my PHP code: <?php $data = json_decode("do ...

Generating and displaying a JSON response

I am having trouble displaying a response on the screen using an AJAX request script with a post method and body value. Here is my code: $('#my-form').submit(function () { $.ajax({ url: 'https://apiurl.com/users', ...

Selecting options in combobox for each row in a table using Angular 2 programmatically

I am currently working on an Angular 2 application using TypeScript. In one of the tables within the application, there is a select control in one of the columns. The contents of this select control are bound to another string array. <table ngContr ...

Save and load parent-child associations with JsonConverter

My JSON structure consists of POCO classes with arrays of child-objects, like so: "Object": [ { "Name": "TestA", "ChildObjects": [ { "Name": "TestB" "ChildObjects": [ { ...

Utilizing TypeScript with Express.js req.params: A Comprehensive Guide

Having an issue with my express.js controller where I am unable to use req.params The error message being displayed is 'Property 'id' is missing in type 'ParamsDictionary' but required in type 'IParam'.' I need a w ...

Rendering in Angular 2 is exclusively done through the use of arrow functions

Is Angular 2 only rendering using arrow functions, or am I missing something? this.service.getData(o).subscribe(res => { this.data = res.data this.view = res.view }); It actually renders my component, but this.service.getData(o).subscribe(functi ...

Ways to display "No records" message when the filter in the material table in Angular returns no results

How can I implement a "No Records Message" for when the current table is displaying empty data? Check out this link for examples of material tables in AngularJS: https://material.angular.io/components/table/examples ...

Node.js/Hapijs - Verify every property and value in JSON object payload without explicitly naming the properties

One of the challenges I'm facing with my API is handling POST-sent payload input that needs to be passed on to another application for processing. The input is always in JSON format, and the values must strictly be numeric. With hundreds of different ...

Experience the convenience of lazy-loading in Angular Ivy: The InjectionToken ng-select-selection-model provider is not available

Issue Description I have integrated angular's IVY compiler and lazy-loading feature according to the tutorial found here: However, when I attempt to lazy-load a module and add an instance of a component to my application, the ng-select element is not ...