I have this function getOrderNumber()
that I want to create a unique order number using the javascript getTime()
. I need then the function getOrderNumber()
to somehow assign a value to the html element. I tried a few iterations of what I have here which didn't work.
Any help would be appreciated.
<form action="/saocctest.cgi" method="post">
<!--get unique order number-->
<script>
function getOrderNumber() {
var d = new Date();
var n = d.getTime();
form.elements("orderNumber").value=n;
}
</script>
<input type="hidden" name="orderNumber">
I have this function getOrderNumber()
that I want to create a unique order number using the javascript getTime()
. I need then the function getOrderNumber()
to somehow assign a value to the html element. I tried a few iterations of what I have here which didn't work.
Any help would be appreciated.
<form action="https://www.someurl/saocctest.cgi" method="post">
<!--get unique order number-->
<script>
function getOrderNumber() {
var d = new Date();
var n = d.getTime();
form.elements("orderNumber").value=n;
}
</script>
<input type="hidden" name="orderNumber">
form
e from? Maybe this will help: w3schools./js/js_htmldom_html.asp
– OneHoopyFrood
Commented
Sep 15, 2016 at 21:36
Set Id name to your HTML form
<form id="myForm" action="https://www.someurl/saocctest.cgi" method="post">
And then assign the value using this in your function
document.getElementById("myForm").elements[0].value = 'hello';
Or else add id/class to your input and the assign using
document.getElementById('id'); // Using Id
document.getElementsByClassName('class')[0]; // Using class
It will work
Demo : https://jsbin./molagu/2/edit?html,js,output
JavaScript doesn't create global references of HTML page elements in this way. In modern browsers, if you've a element with specific identifier, you can directly get it from its id in the global object.
For example
<div id="my-id"></div>
JS
alert(this['my-id'])
Where this
, window
, if you're not in strict mode and if you're in a global scope.
Actually, if you want a cross-browser equivalent way to get the form
element,
document.getElementsByTagName('form')[0]
Every DOM element has methods like getElementsByTagName
, getElementsByClassName
, (these return a HTMLCollection
, looks like a array, but it's not) ...
The document
is the one object that contains the getElementById
method, which returns the first element with specific identifier.
Also, if you want to get your form elements, use the methods I quoted, or simply index the form reference with the 'name'
attribute of the specific child. It's cross-browser to use HTMLElement().getElementsByTagName
, etc.
Only input elements has the value
property. You can change the innerHTML
or innerText
instead (they're getters/setters);
I think this is what you're after
<form id="myForm" action="https://www.someurl/saocctest.cgi" method="post">
<script>
function getOrderNumber() {
var myForm = document.getElementById('myForm');
var d = new Date();
var n = d.getTime();
myForm.elements[0].value = n;
}
</script>
<input type="hidden" name="orderNumber">
Notice you could probably just give the input an id and change the value that way e.g.
<input type="hidden" name="orderNumber" id="myOrderNumber">
then
document.getElementById('myOrderNumber').value = n;
Also note when using document.getElementById("myForm").elements[0].value = 'hello';
as per other answers here that you are targeting the first element within the form, if you ever add another element above this then you will update the wrong item value.
Safest option as I've mentioned would be to place an id on the input itself then target that.