Adding Substring to Input - javascript

I'm trying to add coordinates to a input text after trimming characters from each end of the string. But for some reason my trimming part isn't working. Can anyone help me out here? I'd really appreciate it.
Here's my code:
<input type="hidden" id="latlng" onload="getFinal()">
<script>
function getFinal(){
var input = document.getElementById('latlng').value;
consolelog(input);
var last = (input.length)-1;
var final = input.substring(1,last);
document.getElementById('final').value = final;
}
</script>
<input type='hidden' id='final'>
::: EDIT :::
I've tried simplifying things because the value that needs to be trimmed is in the rest of the code. But for some reason, when I use the code below, it still won't put the value in the text box.
var final = pos.substring(1,(pos.length)-1);
document.getElementById("final").value = final;
Now I'm getting the error: TypeError: Cannot set property 'value' of null at :4:44

OnLoad should not work for input. You better write as a simple javascript block
<input type="hidden" id="latlng" onload="getFinal()" />
<input type='hidden' id='final' />
<script>
var input = document.getElementById('latlng').value;
consolelog(input);
var last = (input.length)-1;
var final = input.substring(1,last);
document.getElementById('final').value = final;
</script>

Related

Trouble getting input value

I'm having trouble trying to log the value of a input.
So my script is showing below.
document.getElementById("news").innerHTML = '<input type="text" id="myText" value="Mickey">';
var x = document.getElementById("news").value;
console.log(x)
I expected it to log "Mickey" to the console. Instead it logs "undefined"
Can someone help me understand why and possibly help me with a solution to my problem. Thank you.
You're trying to get the value from wrong element. Try using the input Id and you'll get results.
var x = document.getElementById("myText").value;
You need to get the value from input id--^
document.getElementById("news").innerHTML = '<input type="text" id="myText" value="Mickey">';
var x = document.getElementById("myText").value;
console.log(x)
<div id="news">
</div>

object HTMLInputElement error while entering a integer value to label in javascript

script code
intext = document.getElementById("intext");
totalin = document.getElementById("totalin");
function myFunction()
{
var x = document.getElementById("totalin");
x.innerHTML = intext.toString();
}
in the above code am getting object HTMLInputElement in the label with "totalin" id and textbox of number type with id = intext
i am new to javascript and i saw many other answers on similar problems but either cudn't understand the answers or they didn't worked .
thanks in advance for help.
part of Html code is as follows if required
<label for="text">input the income in numericals</label>
<input type="number" name="text" id="intext">
Submit
<label id="totalin" for="totalin">Label:</label>
i would really appreciate any help i am really in need of solution.
You need to get the value from the element:
x.innerHTML = intext.value;
You're also missing a quote close:
<input type="number" name="text id="intext">
^ RIGHT THERE

How to concatenate a JS variable in an HTML script?

Can I do something like this?
var counter = SomeJSFunctionThatReturnsAvalue();
<tr><td> <input type="file" name="file-upload"+"_counter" id="file-upload" /></tr></td>
Can I do that? I need to append an underscore and an incremented number to the name.
Also, an off-topic question - that function above returns the value of an input type, for example:
<input type="hidden" name="hidden-input-type" value="2" />
Is the value "2" a number that I can use for math operations? If not, how can I make it one?
Here you go fella.
<head>
<script>
function test($count) {
document.getElementById("test1").setAttribute("name","file-upload_" + $count);
}
</script>
</head>
<body>
<p>some content</p>
<input id="test1" type="file" name="file-upload" id="file-upload" value="2"/>
<p>some other content</p>
<script>test(1);</script>
</body>
Your SomeJSFunctionThatReturnsAvalue(); would pass it to test() function.
to get the value of "2" from your second question for use in a math function, just do:
var value = document.getElementById("test1").getAttribute("value");
document.write(parseInt(value, 10) + 3);
which returns 5.
To append the return value of your function to the name of the input tag, you can assign it to the name attribute of the input.
var counter = SomeJSFunctionThatReturnsAvalue();
var fileUpload = document.getElementById('file-upload');
fileUpload.name = fileUpload.name + "_" + counter;
You can get the type of a variable by using "typeof"
typeof myValue; // "string"
You can change this to an integer by using the parseInt() function.
var intValue = parseInt(myValue, 10);
You can change the name using .setAttribute("name", theNameUwantToChangeTo);:
function changeName(number){
var ele = document.getElementById("file-upload");
ele.setAttribute("name", b.getAttribute("name")+ "_" + number);
}
changeName(number);
To get the value, just .value:
function getV(){
return document.getElementById("file-upload").value;
}
var number = getV();
In case it does not return int, use parseInt()
function getV(){
return parseInt(document.getElementById("file-upload").value);
}
var number = getV();
Maybe you would benefit from looking into Angular.js or Ember.js if you are trying to do things like this. They can do data binding so that you can make readable and dynamic code just like what you are trying to create in your question.
If not that^ then this:
I saw you mentioned in a comment that you are dynamically creating the list. That is where you should be assigning the correct name with the counter (assuming there's no desire for counter to change dynamically. If there is a dynamic change then tell us what events are doing the change) Could you show us the code that is doing that please?

How to copy and output text from another textbox with Javascript?

<input type="hidden" id="prevTicketNo" value="6"/>
<script>
var ticketNo = document.getElementById(prevTicketNo).value +1;
document.getElementById('currentTicketNo').value = ticketNo;
</script>
<input id="currentTicketNo" value=""/>
What I am trying to do:
The prevTicketNo is a value captured from somewhere else. I need that to load as a hidden field so I used type="hidden". Once the value in this textbox is loaded, I need to +1 so that the number increases for my current ticket.
Is the right approach?
You must change the value of the first input to integer.
var ticketNo =parseInt((document.getElementById('prevTicketNo').value),10)+1;
document.getElementById('currentTicketNo').value = ticketNo;
JSBin
Javascript:
var hiddenVal = document.getElementById("prevTicketNo");
var newTicketNo = Number(hiddenVal.value) + 1;
alert(newTicketNo);
HTML:
<input type="hidden" id="prevTicketNo" value="6"/>
If you can get the previous ticket number and output it into a hidden field (obviously via some kind of server side script), why can't you just output it directly into your text input?
eg. In PHP write this:
<input id="currentTicketNo" value="<?php echo $prevTicketNo + 1; ?>" />

Expanding HTML forms using Javascript

I have a simple HTML form that asks a user to input their name, SKU, quantity, and comments. This is for a simple inventory request system.
<html>
<body>
<form id="myForm" method="post">
<input type="submit">
<br>Name: <input type="text" name="form[name]">
<br>SKU: <input type="text" name="form[SKU1]">
<br>Quantity: <input type="text" name="form[quantity1]">
<br>Comment: <input type="text" name="form[comment1]">
</form>
Add item
<script>
var num = 2; //The first option to be added is number 2
function addOption() {
var theForm = document.getElementById("myForm");
var newOption = document.createElement("input");
newOption.name = "form[SKU"+num+"]"; // form[varX]
newOption.type = "text";
theForm.appendChild(newOption); //How can I add a newline here?
optionNumber++;
}
</script>
</body>
</html>
Currently I can only get it working where it will add a single form value. I would like to recreate the entire myForm except for the name field with a single click.
Your post is very old, so presumably you've found an answer by now. However, there are some things amiss with your code.
In the JavaScript code you have
var num = 2;
This is the number that is incremented to keep track of how many "line-items" you will have on the form. In the function addOption(), though, instead of incrementing num you have
optionNumber++;
You never use optionNumber anywhere else. Your code works once, when you add the first item, but since you increment the wrong variable, you are effectively always adding option 2.
Oh, and adding the newline: you need to append a <br> element.

Categories

Resources