score:1
You can pass the option text to your update function from your onchange function as:
this.options[this.selectedIndex].text
So you'd end up with:
var select = d3.select('body')
.append('select')
.on('change',function() { update(this.value, this.options[this.selectedIndex].text) }); // note: since you are setting value equal to the index, you can also use this.value instead of this.selectedIndex
function update(i, a) {
data.splice(i,a);
...
}
How this works: in your code you use d3 to append an HTML select
element (Select object) with several HTML option
elements (Option object) in it.
Then on the select
element, the onchange
function (which is a standard event of the select
element) then passes the select
element to its function handler, so in that function this
represents the actual select
element, and therefore this.value
(Select value property) corresponds to the value of the select
element (i.e. the value
of the currently selected option
in the select
element).
The options
property of the select
element, i.e. this.options
(Select options collection), gets you a list of all of the option
elements within that select
. Using the selectedIndex
property of the select
element, i.e. this.selectedIndex
(Select selectedIndex property), you can grab the currently selected option
element from the list as this.options[this.selectedIndex]
.
Since the this.options
collection is a list of Option elements (Option object), to get the actual text of that option
you can use .text
on it. And that's how you end up with this.options[this.selectedIndex].text
.
Source: stackoverflow.com
Related Query
- How to get access to the selected element?
- How to access the DOM element that correlates to a D3 SVG object?
- How do I get the width of an svg element using d3js?
- D3: get the bounding box of a selected element
- How to get value from the element using selection in d3
- How to get web element (id) from the element position in D3.js force graph
- How can I get access to the current selection inside a D3 callback?
- d3.js v4.9 Get the calculated width of selected element
- How to get the index of the data element in a histogram on mouseover?
- How to get the dimensions of a D3.js element before drawing it?
- How can I get the dom svg element from d3 node data?
- How to correctly access the transform of an SVG element during d3.transition
- How to get the position and width of a tspan element
- How to get the JSON path from element
- How can i get the key of an element in stack-layout in d3?
- How to get the current element height?
- How to get the selected index from a dropdown menu in d3
- D3.js: How to get the computed width and height for an arbitrary element?
- How to access the parentNode of a selection to raise an element?
- How can I get the D3.js axis ticks and positions as an array?
- MultiBar chart with nvd3 / d3 only shows labels for every other tick on the x-axis. How can I get them all to show up?
- In d3, how to get the interpolated line data from a SVG line?
- how to get dynamic value of input element with d3?
- How to get the outline of a stroke?
- How to get the total depth of an unknown JSON hierarchy?
- How can I get "call" to execute for each data element in D3?
- Get class of selected svg element in d3
- How to get coordinates of slices along the edge of a pie chart?
- how to get the type of a scale in D3?
- How to get the vertically-oriented tree using d3.js
More Query from same tag
- D3 Bar shows data only for first date
- Selecting nested data in D3
- How can I specify the D3 V4 micro library on CDN?
- Uncheck the Checkbox makes no difference
- Histogram with values from csv
- D3 sort an array of objects on 2 object properties
- Update second chart on mouseover
- Including Javascript Library to Wicket Panel
- Pulling data from a database for a C3js chart
- Choosing the data to display in d3
- Temporary upload a file to use it - javascript
- How do I make this Angular D3.JS Chart Style and add Links to each pie?
- d3js drag svg:g item move before drag
- Empty elements created, d3.js
- D3.js collapsable tree - visualise set number of levels
- grouped Bar chart using D3 grid issue and console errors
- D3 semantic zooming with Reusable Pattern
- How to call d3.svg.line() independently?
- Use HTML formatting in SVG for text alignment
- D3.js moving from tsv to json with nested array
- Adding y-axis to CrossFilter examples
- How to add superscript & subscript in text in D3
- D3 selective Zoom
- SVG <rect /> not displaying color on initial load, only after zoom in or out IE-11
- Custom tick size on axis (d3js)
- D3.js How do i put an href link into rect and output the text beside it?
- How to show directed graph using insight
- D3.js time scale quirk with "11 PM" values
- Crosshair / x value tooltip for linear scale
- Update Pattern for Multi-Line Chart with D3