Is there a way in VueJS to extract the text from a p tag and save it into a variable?
Currently, the text is just displayed inside the p tag, but I want to store it in a variable for future use.
Here is the HTML code I am working with:
<b-form-input v-model="search" placeholder="Search by disease"></b-form-input>
<select v-model="selected">
<option v-for="result in filteredPeople(search)" :key="result.LONG_D" :value="{ id: result.LONG_D, text: result.ICD_C }">{{ result.LONG_D }}</option>
</select>
<p>
Value: {{selected.id}}
</p>
<b-button class="btn" variant="success" v-on:click="runAPI(search)">Search</b-button>
This is my JavaScript code:
export default {
data() {
return {
results: {},
search: "",
msg: null,
selected: ""
};
},
methods: {
runAPI: function(disease) {
axios
.get("http://localhost:9000/api/disease/" + disease)
.then(response => (this.results = response.data))
.catch(error => console.log(error));
console.log(this.results);
},
filteredPeople() {
if (this.searchQuery) {
return this.results.filter(item => {
return item.LONG_D.startsWith(this.searchQuery);
});
} else {
return this.results;
}
}
}