Develop Reference

Change the value of a text field javascript

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;

How to get value of another input field using javascript

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

getting an attribute-value in a class using javascript

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.

Getting the correct name of clicked input from a list JQUERY

I'm struggling to use jquery to identify the button i'm clicking.
I've a dynamically generated list categories along with a Remove button to delete it from the database.
My inputs are like this:
<input id="deletesector" class="deletesector" type="submit" name="deletesector-4" value="Remove"></input>
<input id="deletesector" class="deletesector" type="submit" name="deletesector-5" value="Remove"></input>
<input id="deletesector" class="deletesector" type="submit" name="deletesector-6" value="Remove"></input>
my script listens for a .deletesector click and then get the attr name. however, it returns the name of deletesector-4 no matter which of the 3 buttons is clicked.
How do I fix this so that if "deletesector-5" is clicked it identifies it as such.
$(".deletesector").click(function() {
//store the id
var name = $("input#deletesector").attr('name');
//create the post variable string
var dataString = 'serviceid='+ name;
alert (dataString);

Use this inside the anonymous function for the click-handler:
$(".deletesector").click(function(){
var name = this.name
});
The reason you always got the name of deleteselector4 is because that's the first (but not the only) element with the id of deleteselector, an id must be unique for HTML to be valid. With that in mind id selectors only ever look for one element when they search by id, and stop at that first element, assuming it's the only element with that id (as it should be).
Given that the id in your HTML is the same as the class, remove the id since it's doing nothing useful, and actively harming your HTML's validity.
References:
Element identifiers: the id and class attributes.

Use:
$(".deletesector").click(function(){
var name = $(this).attr('name');
// your stuff here
});
this in a jQuery event refers to the element that was clicked on.
Also, your duplicate ids will mess stuff up.
See this JSFiddle for a working example.

First of all, you have some duplicated ids.
Here is the fixed code:
<input id="deletesector-4" class="deletesector" type="submit" name="deletesector-4" value="Remove"></input>
<input id="deletesector-5" class="deletesector" type="submit" name="deletesector-5" value="Remove"></input>
<input id="deletesector-6" class="deletesector" type="submit" name="deletesector-6" value="Remove"></input>
Then you jQuery could be like this:
$(".deletesector").click(function(ev) {
// CHECK THIS $(ev.target) element, very useful!
elementClicked = $(ev.target);
var name = elementClicked.attr('name');
var dataString = 'serviceid='+ name;
alert (dataString);
});
Here is a JSFiddle that shows your example working.

How do you change the value of an HTML element with javascript?

I have this: <input type="button" value="hello"> I want to change the value with javascript so that it is value="goodbye". How do I do this?
Following #David's advice in the comments below here is the code I tried but could not get to work before posting this question:
var createBttn = document.getElementById('create');
createBttn.innerHTML = 'value="goodbye"';

First you need to get a reference to the object that you want to change the value on, then assign the value property of that element, like this:
Say your element had an id of "someButton":
var btn = document.getElementById('someButton');
btn.value = 'goodbye';