Hello I am trying to understand how setting values via the chrome console work and I had success until i tried it on this site : https://www.zalando.de/login/?view=register
It wont let me fill the fields via the chrome console anyone knows why ?
var firstname = "Teodor"
document.getElementById("rjqNeP Upa9lO").value = firstname
You are refering to the wrong element.
Try selecting the input element directly, not the wrapping div:
document.getElementById("text-xt7my").value = firstname
At the same time, you were using an ID selector trying to get a class:
<div class="rjqNeP Upa9lO">
<input id="text-xt7my" type="text" name="register.firstname" placeholder="Vorname" >
<div>
In case the id is generated dynamically, refer to the class, and traverse down the DOM to find the correct input field:
document.getElementsByClassName("rjqNeP Upa9lO")[0].childNodes[0].value = firstname
Simply select textbox by its ID = "text-1u2un"
document.getElementById("text-1u2un").value = firstname;
Related
I want to create input field like given below using java script.Please provide me appropriate solution.
<input type="text" name="package_location[]" class="form-control" >
Element is created but When I am posting form I am getting none of the values. I have used this code.
var parinput=document.createElement('input');
parinput.type="text";
parinput.name="package_location[]";
you can create input element but you have to append into body using jquery
var parinput=document.createElement('input');
$(parinput).attr("type","text");
$(parinput).attr("name","package_location[]");
$('body').append(parinput)
My java script code is right Only the error is that I have created input field name like package_location[] .And getting it as Package_location the difference of capital P and small p that is the gotcha.
The problem with your code is that you forgot to append the element to the DOM. Using pure JavaScript, simply use the element you made and append it to the body:
var parinput = document.createElement('input'); //Create element
parinput.type = "text"; //Add attribute "text"
parinput.name = "package_location[]"; //Add attribute "name"
document.getElementsByTagName("body")[0].appendChild(parinput) //Append to the first body element found
This solution works without JQuery.
How to find the value of text field using onblur() in next input field.
I tried:
function get_value() {
var inv_nrs;
inv_nrs = document.getElementsByTagName('text1').value;
alert(inv_nrs);
}
text1 is name of input which I am trying to get value.
text2 is name of input where onblur() is triggered.
Two problems:
To get elements by their name attribute, use document.getElementsByName(), not document.getElementsByTagName.
Since these functions return a collection, not a single element, you have to index them to get a specific element.
So the function should be:
function get_value() {
var inv_nrs;
inv_nrs = document.getElementsByName('text1')[0].value;
alert(inv_nrs);
}
Here's a simple snippet which illustrates a way to do this.
(You may wish to use alert in place of console.log)
document.getElementById("text2").onblur = function() {
console.log(document.getElementById("text1").value)
}
<input type="text" id="text1" value="123" />
<input type="text" id="text2" />
Are you looking for an element with id = "text1" or real name = "text1"?
At least if it's their id try getElementById("text1"), that returns one single element. If you talking about the name-attribute, take getElementByName("text1"), this may return more than one element (if there are more then one with the same name).
i think you want this???
function get_value()
{
var inv_nrs;
inv_nrs = document.getElementById('txt1').value;
document.getElementById('txt2').value=inv_nrs;
}
<input type="text" id="txt1" >
<input type="text" id="txt2" onblur="get_value()">
If you search with tagname then you need to insert a tagname:
document.getElementsByTagName('input')[whole_number].value which also
returns a live HTMLCollection
Eg. document.getElementsByTagName("input")[0].value; ,if this is the first textbox in your page.
You can get the value of an html element also on different ways:
document.getElementsByName('text1')[whole_number].value which also
returns a live NodeList
Eg. document.getElementsByName("searchTsxt")[0].value; if this is the
first textbox with name 'searchtext' in your page.
You can also get element by Id:
document.getElementById('IDHere').value to get the value of desired
box
You can also get it by way of Classname:
Use document.getElementsByClassName('class_name')[whole_number].value
which returns a Live HTMLCollection
Good luck
I have a written HTML form with some text fields on which I need to work with Javascript. I want to select them using the method getElementsByClassName because I don't know their exact number (so I can't assign ids one by one).
<form ...>
<input type = "text" name = "test1" class = "myClass">
<input type = "text" name = "test2" class = "myClass">
</form>
<script type = "text/javascript">
var fields = document.getElementsByClassName("myClass");
</script>
Using console.log(fields[0]) writes undefined, so I am not able to iterate into the node by using a for loop (it seems like there is no element into the variable "fields", even though console.log-ging it it shows an array-like structure (as it should be).
I already tried using the "form" object but the situation is the same.
Change to:
var fields = document.getElementsByClassName("myClass");
So the classname matches up with the html elements you used.
I don't know if this question has been asked here on SO, i just don't know the right word.
I have this input tag:
<input type = "text" class="inputbox holdout-7"></input>
How do I get the holdout's value of 7 from the class using javascript?
This is because I wanted to add custom attributes but when the page is rendered, my custom attribute is not displayed. Some advised me to put them in a class instead.
For example:
<input type = "text" class = "inputbox" holdout="7"></input>
when the page is rendered, the holdout is not included, therefore I cannot get the value.
var inputBox = document.querySelector(".inputbox"),
classname = inputBox.className,
regEx = /holdout-(\d+)/,
holdoutValue = classname.match(regEx)[1];
It will return you 7
To set that as attribute in your input box:
inputBox.setAttribute("data-holdout",holdoutValue);
it's recommended to use data-holdout instead of holdout.
I have a JS file CharacterSelection where a user can select an avatar and type their name into a textarea.
Now I want to set a text div in an html file to the contents of the textarea. I will use it to display the player's name at a specific location on the screen.
I know that I can set a div to a text, such as: <div id ="statSheetExitButton">Exit</div> will show "Exit" (style and location depending on css)
I'm wondering if there is any way to put a String variable in there, since I will not know what name the player enters.
I grab the textarea's contents using var name = $("#nameTextBox").val();
I'm thinking that saying <div id ="playerName">name</div> will display the text "name".
Is there a way to accomplish my goal?
$("#nameTextBox").change(function(){
$("#playerName").html($(this).val());
});
This will attach an event handler to the textbox so everytime the name changes the div is updated.
Here is a working example. http://jsfiddle.net/2NkTb/
Please note that for the onchange event you must tab out of textbox or the textbox must lose focus
var name = $("#nameTextBox").val();
$("#playerName").html(name);
Do this:
var name = $("#nameTextBox").val();
$('#playerName').text(name);
You could do something like this which will replace the html of the tag with your JavaScript string:
$('#playerName').html(myNameVar);
Other than that, I don't think you can directly inject JavaScript variables like you would in a template language.
Try:
$('#playerName').html($("#textbo").val());
var playerName = 'John Dow'
document.getElementById('playerName').innerHTML=playerName
You need to set the property innerHTML of you div element.
$("playerName").innerHTML = name;