Increasing the contents of a JavaScript array within a conditional statement

I find myself in a predicament where I need to dynamically add elements to a multidimensional array depending on a specific condition. This means that the type of element to be added will vary based on the condition.

if(type == 'text-box'){
     var title = jQuery("#textbox-title-"+id).val();
     var desc = jQuery("#textbox-desc-"+id).val();
     eleDetails[id]['content'] = {title:title, content:desc};
}
else if(type == 'image-box'){
     var title = jQuery("#imagebox-title-"+id).val();
     var imgurl = jQuery("#imagebox-url-"+id).val();
     var desc = jQuery("#imagebox-desc-"+id).val();
     eleDetails[id]['content'] = {title:title, imgurl:imgurl, content:desc};
}

Can anyone suggest an efficient way to achieve this task?

javascriptarrays

Answer №1

Here is a snippet of code:

 var elementDetails = {};

and within your iteration:

 var titleContent = jQuery("#textbox-title-"+id).val();
 var descriptionContent = jQuery("#textbox-desc-"+id).val();

 // ensure that elementDetails[id] is initialized
 if (!elementDetails[id]) {elementDetails[id] = {};}

 if(type == 'text-box'){
     elementDetails[id]['content'] = {title:titleContent, content:descriptionContent};
 }
 else if(type == 'image-box'){
     var imageURL = jQuery("#imagebox-url-"+id).val();
     elementDetails[id]['content'] = {title:titleContent, imgurl:imageURL, content:descriptionContent};
 }

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

Incorrect scope value detected in Angular controller

I recently started learning Angular 1, and I've encountered an issue with my code: var app = angular.module("Football", []); app.factory("competitions", ['$http', function($http) { return $http.get("json/competitions.json") .success(fu ...

javascriptangularjsangularjs-factory

Enhancing React Functionality: Increasing React State Following an If Statement

Whenever I click on the start/stop button, it triggers the handlePlay function. This function then proceeds to initiate the playBeat function. In an ideal scenario, the play beat function should continuously display 1222122212221222... until I press the st ...

javascriptreactjsreact-hooksreact-functional-component

Tips on showcasing information twice in a row from a database

When attempting to create a shopping cart using PHP, I have encountered an issue where the product ID is added to a session array multiple times. However, when running a query to display the information, it only shows the product ID once instead of the exp ...

phpmysqlsqlarrayspdo

Sending JSON data from a PHP array

I am struggling with this code snippet function retrieve_table_data() { $data = $this->penilaian_model->get_data_tbl(); foreach ($data as $key => $value) { $date_in = $value->date_in; $nmloket = $value->nama; ...

phparraysjson

Tips on customizing the appearance of the dropdown calendar for the ngx-daterangepicker-material package

Is there a way to customize the top, left, and width styling of the calendar? I'm struggling to find the right approach. I've been working with this date range picker. Despite trying to add classes and styles, I can't seem to update the app ...

javascriptcssangulartypescriptangular-material

Experimenting with a custom AngularJS filter designed to extract numerical values from a chunk of text

I am working on creating a unique filter that can extract numbers from text input into a text box. For example: User enters: The cat went to 4 stores and bought 3 bags of cat litter for 1 dollar. The desired output would be: [4, 3, 1] This filter works ...

javascriptangularjs

Activate an action only upon closing the page

I am looking for a solution in my vue.js app to execute a function only when the user closes the application. I have tried registering an event listener for beforeunload, but it causes the function to also trigger on page reloads, which is not ideal. Is t ...

javascriptvue.jsaddeventlisteneronbeforeunload

Stop automatic selection of the last value in ng-options using AngularJS

I'm facing an issue related to AngularJS. The problem I'm encountering is that... In my code, there are two select elements. Whenever I choose an option from the first select, an Ajax call is made using ng-change to populate the second select ba ...

javascriptangularjsangularjs-ng-options

Code Wizard

I am currently working on a project to develop an HTML editor. How it Needs to Function Elements Inside: Text Area - Used for typing HTML as text Iframe - Displays the typed HTML as real [renders string HTML to UI] Various Buttons Functionality: When ...

javascriptjqueryhtmlregexeditor

Troubleshooting problem: Unable to restrict table selections - issue with Material UI table in React

I seem to be overlooking the simple solution here. Currently, I have a ternary on my table. If the length of the selected array is greater than a certain number, a table with disabled checkboxes is rendered. I also implement a different handleClick functio ...

javascriptreactjsmaterial-ui

Changes made in Vuex will not be saved until they are manually committed using developer tools

One of the modules in my Vuex store is called login.js and it looks like this: import axios from "axios"; import router from "@/router"; axios.defaults.baseURL = process.env.VUE_APP_API_ENDPOINT; const state = { access_token: localStorage.getItem("acc ...

javascriptvue.jsvuejs2vuexvuex-modules

Is there a way to detect esbuild's build errors and execute a script in response?

Does anyone know how to handle esbuild's build error and trigger a script afterward? I'm integrating it into my workflow with npm, VSCode, and pure JavaScript. I've searched everywhere but haven't found any information on this specific ...

javascriptnode.jsnpmesbuild

Adjust dimensions of an image retrieved from a URL

Is there a way to adjust the size of the image displayed here?: var picture = new Image(); picture.src = 'http://www.example.com/images/logo.png'; picture.width = 200; //trying to change the width of the image $('canvas').css({ ...

javascriptjqueryhtmlcss

Discovering the position of an element within an array and leveraging that position to retrieve a corresponding value from a separate array

const STATE = ["TEXAS","CALIFORNIA","FLORIDA","NEW YORK"] const STATE_CODE = ["TX","CA","FL","NY"] With two arrays provided, the first array is displayed in a dropdown menu. The challenge is to retrieve the corresponding state code from the second array ...

javascriptarraysangularjstypescript

JavaScript and CSS tabs with smooth transition effect

I want to create tabs that smoothly fade between each other when switching. The code I have works, but there's a slight issue. When transitioning from one tab to the previous one, there is a momentary glitch where the last tab briefly changes state be ...

javascripthtmlcss

React callbacks involve the interaction between three different components

Currently, I am working with 3 distinct components: -The friendsPage component contains a list of friends and invitations to friends -The friendComponent displays detailed information about a friend along with possible actions (which are handled in the t ...

javascriptreactjscallback

The replacer argument of the JSON.stringify method doesn't seem to work properly when dealing with nested objects

My dilemma is sending a simplified version of an object to the server. { "fullName": "Don Corleone", "actor": { "actorId": 2, "name": "Marlon", "surname": "Brando", "description": "Marlon Brando is widely considered the greatest movie actor of a ...

javascripttypescript

Converting Excel VBA code to Javascript for use in Google Sheets: A step-by-step guide

Hello everyone, I am looking to convert a VBA code that I wrote into javascript and integrate it into Google Sheets. Does anyone have any suggestions on how I can accomplish this task? The VBA code in question is as follows: Sub Influencers_automacao() ...

javascriptexcelvba

A guide to populating a table with JSON data that includes empty cells in AngularJS

I'm dealing with JSON data that includes employee names and salaries over multiple days (1-5). My goal is to display this information in an HTML table using AngularJS, mimicking the layout of the required table below. JSON Data: [{ name: "Jo ...

javascriptangularjsjson

What is the best way to eliminate the border on Material UI's DatePicker component?

Check out this code snippet for implementing a datepicker component: import React, { Fragment, useState } from "react"; import { KeyboardDatePicker, MuiPickersUtilsProvider } from "@material-ui/pickers"; import DateFnsUtils from &qu ...

javascriptreactjsdatepickermaterial-ui