A guide on understanding tab-formatted text in a textarea using JavaScript (Vuejs)

Trying to decipher a text that has been copied into a Word table, the formatting is very confusing.

I am looking to extract the rows as objects in an array, with the columns serving as properties of each object. I would like to accomplish this using Vuejs (ES6) or JavaScript.

Here is a screenshot of the Word table with its columns: word screenshot

.code           
        Input   
        store   N
        load    cero
        store   sum 
    initWhile   Load    N
        sub cero
        jz  endWhile
        load    sum
        add N
        store   Sum
        load    n
        sub Uno
        Store   N
        jmp initWhile
    endWhile    load    sum
        output  
        halt    
.data           
    n       
    Cero        
    Sum     
    Uno     

    def uno 01

The data in the Word table seems to be structured around tabs, but at times information overlaps across different columns.

javascriptwebvue.js

Answer №1

All it took was this:

let rows = this.board.split("\n");

The issue was with the structure I was copying into the input field. You can find the full code on my GitHub page

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

In what way can an array be assigned to a new key within the same key along with additional objects?

My goal is to transform the existing key value into a new format within the same key. It may be difficult for me to explain clearly through words, but the following data will help clarify. The data is currently structured as follows: const sampelData = [{ ...

javascriptreactjsecmascript-6

Row in Internet Explorer 7

I have a function that reveals hidden rows in a table, which works perfectly in all tested browsers except for IE7. The function is written using Prototype.js. function showInactives(){ var row_list = $$('tr.inactive'); var ck =$('inactive_ ...

javascriptcssinternet-explorer-7

Element not chosen in Angular version 6

Recently delving into Angular 6, I've been working on setting up form validation within an Angular form. Validation has been successfully implemented, but there's a minor issue with the select box displaying an empty first value. Here is my code ...

javascriptangular

Removing a child component in Vue

I've written this code snippet: Vue.component('parent', { template: ` <div> <child v-for='(child, index) in children' :key='index' :childNumber="index+1" v-on:removeChild="removeChild" /> < ...

vue.jscomponents

Vue - Continue to fetch all items asynchronously within a for loop

I am facing a challenge where I have an array of data that needs to be fetched using a for loop. However, I want to fetch this data asynchronously to make multiple calls at the same time. Additionally, once all the data has been fetched, I need to perform ...

javascriptvue.jsaxiosfetch

Ways to expand the border horizontally using CSS animation from the middle

Currently, I am experimenting with CSS animation and I have a query regarding creating a vertical line that automatically grows in length when the page is loaded. I am interested in making the vertical line expand from the center in both upward and downwar ...

javascriptjqueryhtmlcsscss-animations

Is there a way to restrict the number of times I can utilize slideToggle function?

When I continuously click on a div element in an HTML website that triggers the .slideToggle() method, it will keep opening and closing for as many times as I click. The problem arises when I stop clicking, as the <div> continues to toggle open and c ...

javascriptjquery

Ways to insert HTML text into an external webpage's div element without using an iframe

Is it possible to generate HTML and SVG code based on the position of a Subscriber on a web page or within a specific div? I would like to provide some JavaScript code that can be inserted inside a particular div on the page. Using an iframe is not ideal ...

javascripthtmlajax

What is the best way to create a redirect in Nuxt.js using a component method instead of the fetch method?

I'm currently working with nuxtjs and I am trying to figure out how to redirect the user after they have logged in. I've been having trouble getting the redirect() method to work within my function: loginUser: function () { if (this.isValid ...

node.jsvue.jsvuejs2nuxt.js

What are some cookie serialization techniques in JavaScript and PHP?

I have a form with multiple select options that I want to save in a cookie for user convenience. The goal is to make the serialization of the cookie easily readable in both JavaScript and PHP, allowing me to set the form onLoad and filter search results ba ...

phpjavascriptserializationcookies

Is it possible to target elements within a UMAP iframe using CSS?

I have integrated a uMap map into my website. Here is the code: <iframe id="umapiframe" class="iframe-umap" width="100%" height="300px" frameborder="0" allowfullscreen src="//umap.openstreetmap.fr/f ...

javascriptcssgoogle-mapsiframeselector

Guide on transferring Context to the loader in React-Router-6

In my development setup, I am utilizing Context for managing the global loading state and React-router-6 for routing. My approach involves incorporating loader functionality in order to handle API requests for page loading. However, a challenge arises when ...

javascriptreactjsreact-router-domreact-context

Switching jQuery on various sections of a webpage

In my attempt to replicate the functionality of Facebook's Like button, I have encountered a challenge regarding where exactly to click in order to change the button state. When the button is not liked yet, users should be able to click anywhere on t ...

javascriptjquery

Scheduling tasks for jQuery/Javascript like a Cronjob

I'm currently working on a web application that predominantly uses PHP, however, I am incorporating jQuery/Javascript to retrieve Tweets from users' URLs at http://twitter.com/status/user_timeline/joebloggs.json?count=1&callback=. My aim is ...

phpjavascriptjquerytwittercron

Display a container using Fancybox

With just a click of a button, I want to reveal a hidden div in an elegant box. Here's the code snippet that actually works: $("#btnForm").fancybox({ content: $("#divForm").html() }); However, after doing some research, it appears that this may not ...

javascriptjqueryfancybox

Is there a way to use setTimeout in JavaScript to temporarily stop a map or loop over an array?

data.forEach((d, i) => { setTimeout(() => { drawCanvas(canvasRef, d); }, 1000 * i); }); I have implemented a loop on an array using forEach with a one-second delay. Now I am looking to incorporate a pause and resume f ...

javascriptreactjsarraysloopssettimeout

Iterate through JSON data and access values based on keys using a $.each loop

I have retrieved JSON data from the controller using AJAX and now I want to access this data. The data is in the form of a list of objects (array) with key-value pairs, so I am planning to use .each() function to go through all the data. The array looks li ...

javascriptjsonajax

The value of ng-model is consistently stored as a string, regardless of whether the input is a number or

<div> <input type="text" ng-model="test"/> </div> When a value is entered into the input field with the ng-model "test", it is always treated as a String type, even if it is a valid number. However, I am looking for a way to determine th ...

javascriptangularjs

Each time new scripts are loaded, the Angular 13 window.ng.ɵcompilerFacade gets swapped out for a fresh

New Update: After observing the behavior of loading components/modules in my application, I have noticed a conflict arising between window.ng.ɵcompilerFacade and v13 compliance format when switching between Angular versions. The issue occurs when loading ...

javascriptangularangular-directiveangular13zonejs

Using dropzone.js on multiple files in a single webpage

Is it feasible to incorporate multiple dropzone elements on one webpage instead of having numerous file uploads on a single dropzone element? It appears that dropzone fails to trigger after the selection dialog box when there are several elements, each wi ...

javascriptjquerydropzone.js