Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Closed 9 years ago.
Improve this question
Let's say I have an input field like this:
<input type="text" id="input" value="This is my value">
How can I get the attribute value? In jQuery, I can easily get it with:
$('#input').val() //-> This is my value
How do I do so using pure JavaScript?
You can get the value by targeting the ID.
Where inputID is the ID of your input or textarea:
document.getElementById('inputID').value;
You can also do it by targeting the name attribute.
Where inputID is the Name of your input or textarea:
document.getElementsByName('inputID')[0].value;
The element must have an ID
<input type="text" id="text-field-id" value="A test!">
And then you do this:
var value = document.getElementById('text-field-id').value;
You can use getElementById() , to get value use value property
<input type-"text" id="text" />
var text=document.getElementById('text').value;
Fiddle Demo
Try this
document.getElementById("input-id").value
Yes you are right, everything that is written in jQuery can be written in pure Javascript
var value = document.querySelector('#yourInput').value;
You can use this :
<input type="hidden" id="yourID" name="msg" value="" style="display:none"/>
var Msg="abc";
document.getElementById('yourID').value = Msg;
Related
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 12 months ago.
Improve this question
I have an html page that requires getting the value of an input when a button is pressed so it can be used as a variable in a link. For example, my website would detect "word" being written in the input and would redirect to the link "google.com/word" when the button is clicked. Thanks for any help in advance!
HTML Code:
<td><input value="Input text Here..."></input></td>
<td>Click this Button</button></td>
There is not way to get input value only using HTML... give your button an onclick attribute:
<td>
<a href='https://example.com/test/VALUEFROMINPUTHERE'>
<button id="click" onclick="click()">Click this Button</button>
</a>
</td>
and your input an ID:
<td>
<input value="Input text Here..." id="input">
</td>
and add JS:
function click() {
let val = document.getElementById("input").value
window.location.href = "https://www.google.com/search?q=" + val
}
All I'm doing here is geting the input's value, and changing the window's href to the wanted word, also making sure the word is being searched in google by adding the "https://www.google.com/search?q=" before adding the value of the input.
In this code, when the a tag is clicked, it triggers a JS function that grabs the value of the input with the id "value" and opens thee link with by concatenating it's value to the end of the URL with the window.open() function.
<input type="text" placeholder="Enter Text" id="value" />
Click Me
<script>
function openLink() {
let value = document.getElementById("value").value
window.open(`https://www.example.com/${value}`)
}
</script>
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
So i'm trying to make damage calculator, where user writes the following variables: Level, military rank, strength and weapon level. But the problem seems i can't to send variables to javascript and the document write doesn't send anything out. Can you check the code and help me?
Regards
<form id="form">
Your level:<input type="number" name="level"><br>
Your strength: <input type="number" name="str"><br>
Your military rank: <input type="number" name="mr"> <br>
Your weapon(no weapon=0) <input type="number" name="wep"><br>
<input type="submit" value="Submit">`
</form>
<script type="text/javascript">
var level = document.getElementById('level').id;
var str = document.getElementById('str').id;
var mr = document.getElementById('mr').id;
var wep = document.getElementById('wep').id;
hit = ((level*4)+str)*(1+(mr/20))*(1+(wep/10));
document.write(hit);
You don't want to get the id of the element:
document.getElementById('level').id
You want to get it's value:
document.getElementById('level').value
Also, in order to use getElementById, your element needs to have an id:
<input type="number" name="level" id="level">
Alternatively, without changing the markup, you can use getElementsByName and grab the first element in the returned collection:
document.getElementsByName('level')[0].value
Your problem is that you are referencing your tag's id, when you never gave it one:
Your level:<input type="number" name="level"><br>
Should have:
Your level:<input type="number" name="level" id="level"><br>
Your JS aslo is not asking for the value. Just the object itelf. It should be:
var level = document.getElementById('level').value
Then you're script will work.
You are using getElementById but have not defined any Id values.
With the current html markup you can use getElementsByName() instead. The method returns an array of matched elements.
forexample,
var str = document.getElementsByName('str')[0].value;
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
I have a form and it has several fields. There is an ID field which is generated from another form. Now i want to prevent users to change that field value.
How do i do this? DO i need any javascript or anything else?
You can use disabled on the field:
<input type='text' disabled />
Or readonly
<input type='text' readonly />
<input type="text" name="NAME-OF-FIELD" value="VALUE-NOT-TO-CHANE" disabled="disabled" />
or you could use
<input type="text" name="NAME-OF-FIELD" value="VALUE-NOT-TO-CHANE" readonly />
or if you need to hide it
< input type="hidden" name="NAME-OF-FIELD" value="VALUE-NOT-TO-CHANE" />
You will still have access to it when you submit the form.
If you can change the HTML, I'd suggest making the input hidden with type="hidden".
If you can't, apply the CSS style display:hidden to it.
Or did you want to leave it visible?
You have to disable the field:
<input type="text" disabled="disabled" />
Or set it readonly
<input type="text" readonly="readonly" />
A readonly element not editable, but gets sent when the form submits. a disabled element isn't editable and isn't sent on submit.Readonly elements can be focused while disabled elements can't.
<input type="text" readonly />
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
I'm just wondering if anyone can point me in the right direction on how to create a dynamic list on a webpage based on user entry without refreshing the page each time.
For instance, a user would:
type a word into a textbox
click a button
the word would show up somewhere else on the page
the word would be erased from the textbox
Any new word typed would automatically be written underneath any previously entered words.
<div id="target"><div>
<input type="text" id="newInput" />
<input type="button" id="saveInput" />
<script>
// when button is pressed:
$('#saveInput').on('click', function(){
// check if something is there
if( $('#newInput').val().length !==0){
$('#target').append('<div>'+ $('#newInput').val()+'</div>'); //append to a target
$('#newInput').val(''); // empty input
$('#newInput').focus() // for bonuspoint, place cursor back in input
}
});
</script>
If you want each new entry as first listitem, use prepend() instead of append()
Here's an working example:
Html:
<input type="text" id="txtWord"/>
<input type="button" id="btnAddWord" value="Add new word" />
<ul id="words">
</ul>
Script:
$(document).ready(function(){
$('#btnAddWord').bind('click', function(){
if( $('#txtWord').val() !== ""){
$('#words').append('<li>'+ $('#txtWord').val()+'</li>');
$('#txtWord').val('');
}
});
});
Example
http://jsfiddle.net/AfNgH/
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
<form action="javascript:message();">
<input type="text" id="#msg" value='test'>
</form>
This is a simple form I made. Now when I call my JS function using this code it works (only one input can be accessed though):
function message() {
alert($('input').val());
}
But using this code doesn't work (alerts Undefined):
function message() {
alert($('#msg').val());
}
I have really no clue what to do and I have been looking for hours...
The value of the id attribute shouldn't start with a #:
<form action="javascript:message();">
<input type="text" id="msg" value='test'>
</form>
Here's the fiddle: http://jsfiddle.net/XrJjU/
If, for whatever reason, there is a # in the id, you'll have to escape it in your selector:
$('#\\#msg').val();
Here's the fiddle: http://jsfiddle.net/7P5ER/