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 9 years ago.
Improve this question
In my code (HTML and JS), I have a form with two fields; field A and field B. I want to write the JS code that will get the data from field A and use it to set the default value for field B. Can someone help me do that?
If you decompose the problem into smaller pieces, there appear to be three components:
Get value from Field A
Set value of Field B
Trigger the event
Let's start with the first one...
There are lots of ways to reference an element. Let's assume for a moment that your element has an id:
<input type="text" id="fieldA" />
Given that, we can get its value:
var valueOfFieldA = document.getElementById('fieldA').value;
Now that we have the value, let's move on to the second component...
Similar to above, all we have to do is reference the element. Once we have that, we can set its .value property just as easily as we can read it. Let's assume another id in the markup:
<input type="text" id="fieldB" />
Given that, we can set its value:
document.getElementById('fieldB').value = valueOfFieldA;
Finally, we want to trigger this. Should it be when a button is pressed? When something else happens? For now I'm going to assume it should be when the value of Field A changes, so let's attach the code to the event handler for the change event of Field A:
document.getElementById('fieldA').onchange = function () {
var valueOfFieldA = document.getElementById('fieldA').value;
document.getElementById('fieldB').value = valueOfFieldA;
};
Assuming that the elements exist at the time this code runs and that it's able to find them by their id properties, this final result should assign a function to the change event of Field A such that whenever its value changes the value is then set to Field B.
Related
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 5 months ago.
Improve this question
I have a combobox like this
after that, I have a checkbox. If the checkbox is checked, I want to copy the value of the combobox to an input of text. I write a jQuery code like this to get the value, then I set the value of combobox to an input of text
i check console to see the result.
I get the value if I check the log. But the value can't set into input text.
But, if I make a little change in jQuery to get the key of combobox, the key can be set in the input text.
Then,in the input text I can get the key of combobox
I need help for this.
Your code should work. Please provide the HTML (not the templating code)
Simplified:
$("#customCheck1").on("click", function() {
const text = this.checked ? $("#province option:selected").text() : "";
$("#current_province").val(text);
});`
assuming unique IDs
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")
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 5 years ago.
Improve this question
I am new to Javascript.So please excuse me if I am asking anything silly. I have a sample Shiny application Statistics Dashboard which can be used to find some basic statistical measures such as Mean, Median etc. for any metric. Users have to upload a csv file based on which the dashboard selects all the numeric variables within the file and provides an option to select any numeric variable to analyze as a dropdown. I want to add a javascript code in the application which will capture the updated measures (e.g. mean) after a user has selected a particular dimension from the dropdown. For example, suppose the default selected dimension in the dropdown window is "sales" and the corresponding mean is 325. If I select another dimension (suppose) "profit" then the mean changes to 37. Now I want to add a javascript/jquery code which will capture the mean value of 37 when I select "profit" (from "sales") from the dropdown. I have tried the .change event to check for the change in the dropdown selection and when there is a change, capture the mean value inside the h3 tag. However, I am getting the previous mean value instead of the updated one i.e. I am getting 325 instead of 37 when I select "profit" (from "sales"). Hope I am clear on this.
Am I using the wrong event? How can I capture anything after a certain action occurs and the values are updated?
Feel free to let me know if you need any more details on my query. Looking forward to the help from the community.
I think this is Exactly what you are looking for
Here is a code which will detect any changes in a certain element.
HTML:
<input type="text" id="Profit"></input>
<h3 id="MeanLabel">100</h3>
Javascript/Jquery:
$(document).ready(function() {
$("#Profit").on("change", function()
{
$("#MeanLabel").text(this.value);
});
initialValue = $("#MeanLabel").text();
CheckChanges();
})
function CheckChanges()
{
if($("#MeanLabel").text() != initialValue)
{
//The Label Changes!
initialValue = $("#MeanLabel").text();
alert("New Label is: " + initialValue)
}
setTimeout(CheckChanges, 200)
}
This is the working sample.
https://jsfiddle.net/h68nxu4h/
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 8 years ago.
Improve this question
i am new to html and php. i am trying to calculate difference between two dates. although i have managed to make a JS function for calculation the difference. but it need two date variables to calculate the difference.
i have use <input type="date"> to make an input of date from user. but now the problem i am facing is that how can i store the vale in the textbox(the date in it) into a variable ?
is there any $_POST method to get the date stored into a variable ?
Use an event Javascript and pass the new value parameter.
HTML:
<input type="date" name="dateOne" value="" onChange="setDate(this.value);"/>
Javascript:
var date;
function setDate(val) {
date = val;
}
Edit (based on comment)
For set the variable into a form, create an input type hidden (or other).
<input id="jsValue" type="hidden" name="jsValue" value="" />
In Javascript put the value into your input
document.getElementById("jsValue").value = yourVariable;
To see a result in your web page, create a span tag (or other)
<span id="seeYourVariable"></span>
In Javascript use the property innerHtml to put your variable into the tag
document.getElementById("seeYourVariable").innerHTML = yourVariable;
Use a hidden field to store the value of the variable and you will get the value using $_POST.
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 8 years ago.
Improve this question
This is my problem:
We have 5 input fields with the same class name, for example class="inputfield". By default, when the page is loaded, you only see the first. Next to the field you have a button to show the second field. When you click on it, the function showNext() is used and you will see the second field with next to it again a button to show the 3rd field etc...
What do I want to do? I have to get the last visible input field with class="inputfield".
I've already found the function last() and :visible, but when I click on the button to show the next input field, the first is still the last because I don't know how to refresh my code.
What I want to do is, every time the function showNext is called, I need to run my code so I alway have the last visible input field. I can't add code in showNext() so I need a listener and my own code to select the last visible input field.
With my code I want to add a value in the input field when the user clicks on another button that I will display. But I always need to add it to the last visible input field, that's why I need to know what the last visible field is...
Extra info:
The non visible fields are already in the code with display:none.
What I tried is:
when I only use the $(".inputfield").last() I get the last field, but the invisible one...
with $(".inputfield:visible") it's always the first that is "selected". Even if the second is now visible
Is this possible?
Printscreen of my problem:
I select it with
$(".inputfield:visible").last().css("border", "2px solid #990000");
Edit:
I think I found a way around for my problem so I always have the last visible field. Tnx for the help.
To get the last element with classname 'inputfield':
var inputs = document.getElementsByClassName('inputfield');
var lastInput = inputs[inputs.length - 1];
To get the last visible element with classname 'inputfield', it's easier to use jQuery:
var inputs = $('.inputfield:visible').last();
Your question isin't that clear, but from what I understand, you are trying to access the last element that was visible after showNext is called.
Knowing that the last visible input is the input that precedes the currenlty visible one, you could use that logic to know what was the last visible input once showNext is called.
However, you can also simply retrieve the currently visible element before calling on showNext.
var $lastVisible = $('.inputfield:visible').last();
showNext();
Note that you can also use the same logic to get the last field that was made visible after showNext was called if you inverse the statements.