How do I check if an id is 'active'? [closed] - javascript

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 1 year ago.
Improve this question
I have buttons that change color when selected or when "active". Each button holds information to do calculations but when one of the buttons is pressed I need to make a box that holds one of the outputs null. I believe the easiest way to do it would be to place this in my calculations code:
if "button id" is "active"
set value to null
I do not know how to translate that english into javascript.
The ids are what I am giving the CSS ".active" attribute to. Fairly new to the stack overflow thing so if this does not make sense or more information is needed please let me know.
Thanks!

function myfunc(reed) {
if (reed.classList.contains("active")) {
document.getElementById("demon").innerHTML = "Yes I contain .active";
} else {
document.getElementById("demon").innerHTML = "No, sorry not having .active";
}
}
<button class="notactive" onclick="myfunc(this)">Not active</button>
<button class="Iam active" onclick="myfunc(this)">I am active</button>
<span id="demon"></span>

Related

disabling the button. when cells in the schedule are unchecked [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 1 year ago.
Improve this question
How to disable the save button when all checkboxes are unchecked, and if at least one hour selected in the schedule will be, the save button becomes active?
Please help.
My code:
https://stackblitz.com/edit/angular-ivy-slrmqc?fbclid=IwAR3mZbHjz8TkLUZJI1kd7gsMnaPikdS0eyGzdF17RPYJ70jyHhXMOzW8x3w&file=src%2Fapp%2Fapp.component.ts
You can add checkIsAllUnchecked method
checkIsAllUnchecked() {
this.isAllUnchecked = this.arr.every((row) =>
row.items.every((col) => col === 0)
);
}
and call it in ngOnInit, click and toggleRow methods
and add the check to the Save button
<button [disabled]="isAllUnchecked" (click)="save()">Save</button>

Using a class name for a JavaScript 'if event.target' [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 2 years ago.
Improve this question
Is it possible to use a JavaScript document.getElementsByClassName variable in an if statement with event.target?
I want to achieve something like this:
var signInModals = document.getElementsByClassName("signInModal");
if (event.target == signInModals) {
alert("It worked!");
}
Thank you!
You are trying to compare an HTML collection to an element. That is never going to work. You would need to loop over the HTML Collection and check each one.
Seems like you are trying to see if an element has a class so just check for the class.
if(evt.target.classList.contains("signInModal"))
other option is to check to see if it is a parent (depending on what evt is)
if(evt.target.closest(".signInModal"))
Well, event is a reference to the Object itself, not its value. So you are saying is this Object that is clicked this Object that I got from the class name. The answer will always be false. So to answer your question yes it is, but it does not make sense to do that, you probably want to check if a property matches.
For example: when this button is clicked change the button color to the same color has this Html object, and then you can use the if statement to say if (button color == html object color) alert("It worked")

HTML - Calling Javascript Function with variable? [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
So I am trying to do a button and if you click on it then it calls a function called order(). So, If I'm trying to do something like this order("+<script>blablabla</script>+") then it shows me a error if I type into something between the "+HERE+" Why that? Is there any way around it?
You could always do something like this. Maybe change the divs around a bit and add a rounding system. This gives you a live update on the costs when selecting how many keys.
https://jsfiddle.net/8hube9ua/
Throw this under your select,
<span data-val="1.85">1.85</span> <!--How much each key is-->
then throw this into the script.
<script>
$('#suiface').change(function(){
var span = $(this).next('span');
span.text(span.data('val') * parseInt(this.value,10)) //multiplies the cost by the option selected
})
</script>
I'm not sure to understand, but why don't you write something like this ?
<button onclick="order()">Blablabla</button>

Increase time for search in a select element HTML [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
Anyone of you knows if there is a way to increase the time before that a search starting when the user is trying to select an element from a select list by typing the name of the element, in HTML.
For example: I have a list of 100 elements, and the user wants to find the element "Adam Smith" but he is very slow and he can not type very fast in order to select the element Adam smith. Do you know if there is a way to help the user in this use case.
I can use a different component instead of the normal select in HTML, but I am working with a legacy system and I cannot change the source code too much. Anyway also JS solutions are well accepted
I think is a perfect use case for the debounce method of Lodash.
Here is a little example where the time the function will wait until fire is 500:
function doSearch () {
$('#output').html('searched: ' + $('#search').val())
}
$('#search').on('input', _.debounce(doSearch, 500));
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.1/lodash.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type=text id=search />
<p id=output></p>
function doSearch () {
console.log('do search')
}
$('#search').on('input', _.debounce(doSearch, 500));
To debug and find which functions are called when a user starts typing, you can add some JavaScript at the very end on the HTML output that adds (or overrides) the original behavior.
This may help tracking down the problem and find out where that timer value is set:
document.getElementById('thatInputElement').onKeyUp = function(event)
{
console.log(event);
};
You can also achieve this directly from the dev-tools web-console in your browser, without tampering with the source-code.

Javascript: How to change a button to another button? [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
If I wanted to take a button and change it to when clicked to another button using javascript, how would I write this in code?
This is all I have so far but its invalid :/
var change = document.getElementById("fire") === document.getElementById("water");
The HTML:
<button onclick="myFunction()" id="fire">fire</button>
<button id="water" style="visibility:hidden">water</button>
JS:
function myFunction()
{
document.getElementById("fire").style.visibility = 'hidden';
document.getElementById("water").style.visibility = 'visible';
}
you should make two buttons.
Make button A visible initially, button B hidden.
When button A is clicked, hide button A and make button B visible.
This can all be done with CSS. Checkout some jQuery tutorials.

Categories