Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 6 years ago.
Improve this question
I need to make a function that accepts a user input in the form of a string, then when a button is hit returns it reversed. so far I have the function to reverse it, the button and user input field. However i'm struggling to get it to pass the information back and forth.
Html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>String reverser</title>
<!-- imports script containing function-->
<script type="text/javascript" src="problem23.js"></script>
</head>
<body>
<form>
<!--defines user input field-->
<input title="userinput" type="text" id="inputValueId" name="inputId"/>
<!--defines button which calls on the reverse function in javascript file-->
<button name="reverseButton" type="submit" id="btn1" onclick="reverse()">Click me!</button>
</form>
</body>
</html>
function reserve(conversionHolder){
//picks up value
var userInput= document.getelementById("inputValueId").value;
//converts value
var conversionHolder= userInput.split('').reverse().join('');
//passes value outside of function?
return conversionHolder;
}//end reverse
//sets userinput field to the reversed string
document.getElementById('inputValueId').value = reverse(conversionHolder);
It should be like this:
function reserve(){
//picks up value
var userInput= document.getElementById("inputValueId").value;
//convert and sets value
document.getElementById('inputValueId').value = userInput.split('').reverse().join('');
}//end reverse
Mantain your html as it is. Change only the js part to the above.
Don't pass the parameter, it will give you and undefined value and you don't need it.
document.getElementById('inputValueId').value = reserve();
or if you correct the mistyp
document.getElementById('inputValueId').value = reverse();
that should be enough.
Related
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 5 years ago.
Improve this question
I think I'm missing something stupidly simple but can't figure out why this isn't working. I'm trying to use 4 values from 4 text inputs and activate an alert when the values = the string value stated.
<div id="AnswersFriends">
<input type="text" align="center" id="TextFriend1" oninput="checkchange">
<input type="text" align="center" id="TextFriend2" oninput="checkchange">
<input type="text" align="center" id="TextFriend3" oninput="checkchange">
<input type="text" align="center" id="TextFriend4" oninput="checkchange">
</div>
<script type="text/javascript">
function checkchange(){
var Ans1 = document.getElementsByID('TextFriend1').value;
var Ans2 = document.getElementsByID('TextFriend2').value;
var Ans3 = document.getElementsByID('TextFriend3').value;
var Ans4 = document.getElementsByID('TextFriend4').value;
if(Ans1=="Joe" && Ans2=="Joe" && Ans3=="Hugo" && Ans4=="Nathan") {
alert("WellDone");
}
}
</script>
change this:
oninput="checkchange"
to this for all the input tags:
oninput="checkchange()"
Also, change this:
document.getElementsByID('TextFriend1').value;
to this:
document.getElementById('TextFriend1').value;
then, do the same for the other getElementById() methods.
To call a function you have to put () after its name
There is no function called getElementsByID, it is getElementById (with a singular element and a lower-case d on the end).
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 6 years ago.
Improve this question
I'm watching a basic tutorial series on javascript and have been stuck on this super simple script for like close to 30 minutes now. I used an html validator and it all checks out with no errors. However, the code is still not behaving how it should according to the video.
When you type "click me" its supposed to show a dialog box saying 'please enter a real value into the box'. And when you enter a value in the field, it's supposed to substitute the title for whatever you entered.
Sorry for the simple nooby question
EDIT AGAIN: Thanks Arby. That got it working.
<!DOCTYPE html>
<html>
<head>
<title>JavaScript Example</title>
<script type="text/javscript">
function substitute () {
var myValue = document.getElementById(myTextBox).value;
if (myValue.length == 0){
alert('Please enter a real value in the text box!');
return;
}
var myTitle = document.getElementById('title');
MyTitle.innerHTML = myValue;
}
</script>
</head>
<body>
<h1 id="title">JavaScript Example</h1>
<input type="text" id="myTextBox" />
<input type="submit" value="Click Me" onclick="substitute()" />
</body>
</html>
I found some issues with your code, just simple stuff that every beginner goes through (I did), I'll bullet them off:
MyTitle isn't myTitle, JavaScript variables are case-sensetive.
You should stay away from the onclick attribute; he's a bad influence. The point, inline JS is generally not a good idea.
So I added an event listener event instead: [...].addEventListener("click", callback);
Your DOM request to the input box used an undefined variable/object/etc. called myTextBox, instead of a string "myTextBox".
Anyway, I made a JSFiddle for the code, so I could test it, so here is the link to the code with the edits I explained above: https://jsfiddle.net/Lktzw0Lh/
A slightly different approach - since you list jQuery in the tags for this - i have rejigged the code to take advantage of it. I put an onclick event handler on the button which, when clicked gets the value of the textbox and if it is empty - gives the alert. If it is not empty - it swaps the h1 text for the entered text and clears the text input and gives it focus so that you can re-enter new content.
Note that the click handler is in the javascript section and not inline js and also that with jquery - you can chain together commands that affect the same element.
$(document).ready(function(){
$('#testButton').click(function(){
var myValue = $('#myTextBox').val();
if (myValue == ''){
alert('Please enter a real value in the text box!');$('#myTextBox').focus()
}else{
$('#title').text(myValue);$('#myTextBox').val('').focus()
}
})
})
<!DOCTYPE html>
<html>
<head>
<title>JavaScript Example</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
<h1 id="title">JavaScript Example</h1>
<input type="text" id="myTextBox" />
<button id="testButton" type="button">Click Me</button>
</body>
</html>
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 6 years ago.
Improve this question
<!DOCTYPE html>
<html>
<body>
<h1>Change an HTML element</h1>
<p id="msg">Now you see me.</p>
<button type="button"
onclick="document.getElementById('msg').innerHTML = 'Gone!'">
Click Me!</button>
<button type="button"
onclick="document.getElementById('msg').innerHTML = 'Back again!'">
Bring me back!</button>
</body>
</html>
Can someone explain what this does?
When you click on the first button it fires an onclick event attribute. You've told the event to find an element by the ID of 'msg'. Which is the <p> tag above.
It finds it and then replaces the innerHTML value of "Now you see me" with the string 'Gone!'. Pretty much the same thing happens with the second button.
You can learn more about it at the web address below.
http://www.w3schools.com/tags/ev_onclick.asp
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 6 years ago.
Improve this question
I am trying to clone a div without its value. Everything I've tried so far copies the value as well.
Here is my jQuery function
$('#add_more').click(function(){
$('#div_to_clone).clone().insertBefore('#add_more').find('input').val('');
});
This seems to be working fine for me:
$('#add_more').click(function() {
$('#div_to_clone').clone().insertBefore('#add_more').find('input').val('');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="div_to_clone">
<input type="text" />
</div>
Add more
Well, I recommend you changing your id to a class since the value of id attribute should be unique throughout the page. You might be getting the issue in some browser due to duplicate id.
$('#add_more').click(function() {
$('.div_to_clone:first').clone().insertBefore('#add_more').find('input').val('');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="div_to_clone">
<input type="text" />
</div>
Add more
Assuming that your html code is similar to this.
<div class="ContainerDiv">
<div id=ClonethisDiv><input class="InputTxtBox" type="text" /></div>
</div>
clone
Now,
$("body").on("click", "a", function() {
$("#ClonethisDiv").clone().appendTo(".ContainerDiv").find(".InputTxtBox").val("");
});
Hence on click, anchor tag u will able to get a copy of Div with Id='ClonethisDiv' and appended to the container Div.
Here while cloning(copy) input element with a class '.InputTxtBox', will be emptied and get copied. No worry! TextBox Values which already appended to container Div doesnot change.
Hope this will help you.
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
How to get an text field text in to an array? Is it possible to get a text from text field and put it in to character array to select each Alphabet and use it in different places?
Like I have a words
Computer
<input type="text" name="name" />
I need it like in different Block Like Name Speel
[C] [o] [m] [p] [u] [t] [e] [r]
Any help appreciated.
What you might want is the following JavaScript:
"Computer".split("")
I think that the main problem is this part: "select each Alphabet and use it in Different Places Like..." so the solution is to use .charAt() function.
<!DOCTYPE html>
<html>
<body>
<p>Click the button to display.</p>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
var str = "How are you doing today?";
var res = str.charAt(0);
document.getElementById("demo").innerHTML = res;
}
</script>
</body>
</html>