1,112 questions
-1
votes
1
answer
43
views
Enforce format of data-attribute in vuejs, especially arrays
Is there a way to enforce the format of data-attributes?
Considering the following situation, the returned value is often a string – not an array. splitting is not always desirable, for instance, if ...
- 1,662
0
votes
2
answers
176
views
Is it possible to change the text content displayed in an SVG image by setting specific data-* attributes in the html <svg> tag?
For example, to render the variously changing datetimes of a yearly-repeating event that lasts several days, having a re-usable single svg image that can take a data-datetime="yyyy-mm-dd" ...
- 945
0
votes
1
answer
872
views
How to create a 'dynamic` data-attribute, a HTML element with a unique id, in Astro and pass the variables from server to client
In my Astro app I need to pass a variable from the server (frontmatter) to the client.
Like the documentation describe there are two options.
use data-attribute
use defineVars
As far as I can see ...
- 4,888
1
vote
1
answer
57
views
How to add data-autoload, data-origin and data-callback script tags in Angular typescript
I want to add my script in angular application which contains 'data-autoload, data-origin and data-callback' keys. I tried with _renderer2.createElement('script') method but it is throwing error.
...
1
vote
1
answer
80
views
in Firefox querySelector with attribute while finding path in svg gives error
My code is working well in Chrome but not in Firefox.
When I search path element using querySelector with attribute Firefox gives an error that path is not found.
defs.appendChild(svgGradient);
const ...
0
votes
1
answer
278
views
How do I get multiple data-attributes from a single option select assigned to different javascript variables?
I am trying to assign 2 different javascript variable values from multiple data-attributions in a dropdown menu. One value is working just fine, the other keeps returning null. Any suggestions would ...
- 11
-2
votes
1
answer
159
views
Can non data- attributes on custom elements become standard attributes?
In this article the author suggests using data- attributes in the design of a syntax highlighting web component.
The reason given is:
Technically speaking, the browser would let us write the ...
- 48.2k
0
votes
1
answer
91
views
Jquery DataTable update `data-sort` attribute at runtime not affecting sort
I have a datatable which has checkboxes in first td
some are coming checked while some are unchecked from database
by default it is not sorting checked/unchecked, so I also added data-sort attribute
...
- 1,492
0
votes
0
answers
44
views
jQuery data-attribute to object with stringify reversing on newer versions
When retrieving the data-attribute on a HTML element I have run into a problem using jQuery.
I wish to manipulate the attributes and some elements have more data-attributes than others.
Using jquery-1....
- 97
1
vote
1
answer
49
views
how to remove a tr where td has a certain data-attr value
I am trying to remove a tr from DOM after ajax success where td of this tr has a certain data-value value
This is the html:
<tr>
<td data-value="1">First</td>
</tr&...
- 1,871
3
votes
1
answer
931
views
Does React's type declarations e.g. React.HTMLAttribute<HTMLButtonElement> support the usage of custom data attributes out of the box?
I'm trying to create an object that can be spread into a React Component and this object has to include an HTML Custom Data Attribute.
import { HTMLAttributes } from 'react'
interface FooProps ...
- 3,757
0
votes
1
answer
55
views
How to display some CSS content for div[data-attr="false"]:first-ot-type?
Is is possible to display "HEADER FOR OLD DATA" only for the very first row of OLD data and not repeating it for each (in the same way blue border is not repeated)?
Considering (1) has been ...
- 2,965
0
votes
1
answer
98
views
On hover get img src specified in a `data` attribute, then add an img + path to another div
I have a javascript cursor, which does quite a few different things (hence a few different blocks of similar looking code), where on hover it will add classes to the cursor divs so it can be ...
- 1,677
0
votes
5
answers
348
views
Function to find out children of multiple HTML elements and use as custom attribute
So I have the following structure with multiple <div> elements where I want to display the children inside each of it in a data attribute (data-children). Instead of manually changing the ...
-1
votes
1
answer
50
views
jQuery filtering divs based on multiple data attributes
I have multiple divs on a page, each with the following data attributes: data-one, data-two, data-three, data-four & data-five. The following code is creating a filterList array like so: ['one-...
- 89
0
votes
2
answers
60
views
How to compute the total amount of all selected options' custom "data-price"-attribute values?
I'm trying to get values from the options of my select-element. It is possible to select any option, and each option features some custom data-* attribute like e.g. ...
<option value="1" ...
- 343
2
votes
0
answers
1k
views
React-Select: Add custom data attribute to Input
I use ReactJS v18.2 with react-select v5.7.
I want to add a custom attribute (e.g. data-test) to the input element of my <Select/> component, I could not find something like this in the docs.
...
- 170
1
vote
1
answer
459
views
Plotly Heatmap texttemplate not working with customdata
I am trying to use custom data in the texttemplate of a Heatmap in Plotly, but it does not seem to work. I am using Python 3.10.12 and Plotly 5.15.0. Below there is a MWE:
import plotly.express as px
...
- 3,245
1
vote
3
answers
1k
views
Is there a way to add a blank data attribute to an element using JavaScript?
I want to create an element like the following with JavaScript:
<div data-boolean-attribute></div>
Passing null or undefined to setAttribute() or the dataset property results in a value ...
0
votes
1
answer
52
views
jQuery get data-id from selector onchange
Is it possible to get the data attribute value during an on change event?
jQuery(document).ready(function($) {
$('.mystatus').on("change", function() {
var value = this.value;
...
- 1,946
0
votes
1
answer
834
views
Save custom form data in shopify customer table
I have pet website developed in shopify and I have requirement that create custom form in shopify and store custom form data in shopify default customer table. As shopify do not provide database ...
- 289
5
votes
1
answer
3k
views
How TypeScript handles `data-*` attributes in JSX?
Consider this:
import type { JSX } from 'react';
const MyComponent = (): JSX.Element => (
<div data-attr="bar">Foo</div>
);
This does not give any TypeScript error which ...
- 79
0
votes
1
answer
87
views
need to set a data-* with no value with vanilla js
i'm creating a list of links dinamically from the sections i have:
$sections.forEach(({ id, firstElementChild: { textContent } }) => {
const link = document.createElement('a');
link....
- 23
1
vote
2
answers
90
views
Streamline js into something dynamic instead of repetitive for onclick item show
I found a lightweight lightbox code example, however, it relies on IDs and I intend to use it on 20+ items, I'd rather not have 20 hard-coded js lines to refer to something I know can be dynamic, I'm ...
4
votes
1
answer
320
views
Can't pass array to HTML data attribute for Bootstrap tooltips
I'm using version 5.2 of Bootstrap. I'm trying to use the fallbackPlacements option of the Tooltips plugin. The problem is that fallbackPlacement takes an array, but doesn't seem to accept one through ...
- 6,576
-1
votes
1
answer
76
views
Reading HTML data Attributes values with javascript [duplicate]
My Problem with this code is that i want to get the values of my data-Attributes and to know if it worked i use the alert function to see if it gets it. Now comes the Problem, each time i call a ...
0
votes
1
answer
706
views
How to convert custom dataset json file to yolov8 text file format in python
I pulled the class names and x,y points I needed from the json file and created a csv file. This csv file contains rows for multiple regions for each image. For example, while there are 5 regions for ...
- 1
0
votes
0
answers
49
views
HTML in a data-attr tag
I want to put a link in my Tooltip Text, like for example:
<div tooltip="Look at following: <a href='https://google.com/' target='_blank'>Website</a>" flow="right"&...
0
votes
1
answer
87
views
Show/hide divs according to multiple data values
This has been driving me crazy. Couldn´t get a definitive answer from chatgpt nor reddit.
Maybe stackoverflow has someone who is willing to help me out or give guidance.
Description:
When button is ...
- 67
0
votes
1
answer
79
views
jQuery filtering content using multiple data attributes stored in an array
I have been struggling to get round an issue with filtering multiple data attributes that I have stored in an array.
I have 2 different filter types (filter topic and filter content type) topics being ...
0
votes
0
answers
74
views
Show Div if any Selected options in Multi Select equal or are more than custom Data Attribute
I have a script that shows a Div (incorporating a checkbox) that shows if a data-attribute select dropdown selection is more than 18 (for age verification for that option). The problem is if you ...
- 163
-1
votes
4
answers
337
views
JavaScript: How can I set src in the JavaScript code based on data attributes in the HTML code?
I want to use 6 of these Before/After Audio Players on my website: https://github.com/mattbartley/AB-Audio-Player
However, the sources of the audio files are set in the JavaScript code. So when I ...
- 3
0
votes
2
answers
272
views
How to add numbers following a condition in JavaScript
I have a list of articles with different categories (ex: aaa, bbb, ccc). I want to display the sum of the data-prices for each category
For example, I should have 3.20 for aaa, 10.20 for bbb, and 11....
- 3
0
votes
0
answers
36
views
Citation Generator functionality of tabs doesn't work as desired
Current Issues:
1-By Default the First Main Tab with data-tab="1" and First Sub Tab with the data-tab="1" and the Inputs related to First Sub Tab with the data-tab="1" ...
- 31
0
votes
1
answer
233
views
Bootstrap Collapse element on a scroll event
I am developing an Angular application and am using Bootstrap 5.2.
I am using the Collapse component on a card and it works perfectly using the data attributes.
However, I want to trigger the collapse ...
0
votes
1
answer
46
views
Changing div on onchange event of dropdownlistfor
As you can see I am using data attributes to load the div DataSet_Data with a partial view returned from that url.action.
It loads on page load correctly hitting the data-url and loads the correct ...
- 17
0
votes
0
answers
74
views
JS: Using dataset vs using (adhoc) properties
I need to store data (a string) on a certain HTML node.
This can be done via the dataset object
document.body.dataset.foo = 'bar';
Given the nature of JS however, node instances are also (just) ...
- 411
0
votes
1
answer
754
views
Custom Data Attributes HTML Nesting issues + Data Collection using GTM and GA4
I'm developing custom event tracking on my website using Custom Data Attributes (data-*) in the HTML code. The data collected should be sent to Google Analytics using Google Tag Manager (that enables ...
- 13
-1
votes
1
answer
51
views
HTML data-attribute html element can't design directly
I've write some HTML data-attribute code and added HTML tag inside. But I can't design them without adding any class name.
For example; this is my data-attribute;
<div data-box="<h1 class='...
0
votes
1
answer
127
views
HTML data-attribute not accepting child html class and other attribute
when I working with data attribute, it's accept regular html tag. But not accepting child classes. For example, look at my first code;
<p>Lorem ipsum <a href="#" class="mi-...
1
vote
3
answers
3k
views
How to check the order of elements based on data attributes in Cypress
Let say I have a parent div with the id of "container" and it has four children with specific data attribute named data-test. How do I check if each child is in the right order? Let's say ...
- 1,167
-2
votes
1
answer
120
views
Html data attribute array of hash format [closed]
Which format do you recommand for passing an array of hash in a Html data attribute.
For instance:
<button data-products="[{
id='1',
name='A Product Name',
...
- 1,191
0
votes
2
answers
652
views
Javascript: manipulate data inside data attributes in HTML
I have a html/js code that takes data from a json and render it to html table. It has been working fine for a while. Recently the number of items being handled has greatly increased and can't afford ...
- 69
0
votes
1
answer
109
views
haskell sorting list of custom datatypes based on common atributes without usingf modules
Im trying to order a list of a custom datatype with different size of atributes to validate if the datatype format is true but I don't know how to manipulate it by using quick sort.
The datatype:
data ...
0
votes
1
answer
851
views
Data-attribute in Angular component
I understand that I can add a data-attribute to an element within my component like this:
<div [attr.data-my]="myDataValue">
But how can I add a data-attribute to the component itself?...
- 195
2
votes
1
answer
541
views
Razor Page - String with whitespace from C# code is shortened when stored in html data attribute
I am working on Razor Page (.NET Core 6) and trying to store data in html data attribute. The problem is that: if the data is the string from C# code and it has whitespace, the string will be split by ...
- 455
1
vote
2
answers
1k
views
Change div HTML content with attribute from button on click
I have some data attributes on buttons that I need to send as content to a div when those buttons are clicked. A part of my code until now is this:
function getDiscount() {
var buttons = ...
- 59
0
votes
1
answer
576
views
How to execute a javascript function for every element in a list with Freemarker in Kotlin Ktor?
I'm calling an api with Kotlin and Ktor to get a book in return as json response. From this response I want to load the book cover in my frontend Freimarker .ftl file. I'm doing this call in ...
- 472
1
vote
2
answers
3k
views
Set data-* attributes of a div element in Vue.js
How can I set data-* attributes of a div dynamically via an array or object in Vue.js?
I found out that it is possible to set attributes dynamically via the data attributes or via calculated ...
- 117
0
votes
1
answer
59
views
Change format of array generated through WooCommerce
I am generating an array of woocommerce attributes with the following code:
$customAttributes = array();
$attributes = $product->get_attributes();
foreach($attributes as $attr=>$...
- 11