I'm trying to get a variable value from a number input without success.
HTML:
<input type="number" min="0" max="5" name="quantity" id="quantity" class="quantity" value="1" />
<div class="selectedvalue"></div>
SCRIPT:
$().ready(function() {
var quantity = $('input[type=number][name=quantity]').val();
$(".selectedvalue").html(quantity);
});
JSFIDDLE
I only can get the attribute value (1)in the number input but not the actual selected value.
Check the example inside W3schools.
In your example, you use the value 1, and always show the value 1, because your set inside the tag.
You does not need jQuery for get this.
The type from your input is number, and add the id from your number for get the value by Id with document.getElementById("yourIdFromInput").value;
<!DOCTYPE html>
<html>
<body>
Number: <input type="number" id="myNumber" value="2">
<p>Click the button to display the number of the number field.</p>
<button onclick="myFunction()">Try it</button>
<p><strong>Note:</strong> input elements with type="number" are not supported in IE 9 and earlier versions.</p>
<p id="demo"></p>
<script>
function myFunction() {
var x = document.getElementById("myNumber").value;
document.getElementById("demo").innerHTML = x;
}
</script>
</body>
</html>
The <p> with innerHTML will show inside html the value with this script.
Reference:
all Explication about that here
Code W3schools.
Related
I want to inspect the textboxes as well as button,Please help me.I want to use sendkeys function for textbox.
HTML Code :
<!DOCTYPE html>
<html>
<body>
<h2>HTML Forms</h2>
<form action="/action_page.php">
First name:
<br>
<input type="text" id="username">
<br> Last name:
<br>
<input type="text" id="username">
<br>
<br>
<input type="submit" value="Submit">
</form>
<p>If you click the "Submit" button, the form-data will be sent to a page called "/action_page.php".</p>
To send character sequence to the First name and Last name field you can use the following solution:
First name:
CssSelector:
form[action='/action_page.php'] input:nth-of-type(1)
XPath:
//form[#action='/action_page.php']//following::input[1]
Last name:
CssSelector:
form[action='/action_page.php'] input:nth-of-type(2)
XPath:
//form[#action='/action_page.php']//following::input[2]
I want to write timestamp generated by java script to a hidden form input field.The following code writes the timestamp to a paragraph(p element) but does not write to the input element.
It writes to one element but fails to do so to another element.
Can anybody throw light on this behaviour of the script?
<!DOCTYPE html>
<html>
<body>
<p id="demo">pkj</p>
<input id="ts" type="time" name="ts"></input>
<script>
var oD = new Date();
document.getElementById("ts").innerHTML = oD.getTime();//**FAILS**
document.getElementById("demo").innerHTML = oD.getTime();//**SUCCEEDS**
</script>
As per your advice I changed the input element's attribute from "innerHTML" to "**
"value" as shown in code below.It is working fine now.
The issue is SOLVED.
thanks
Jayk
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p id="demo" > </p>
<input id="ts" type="time" name="ts" value=""></input>
<script>
var oD = new Date();
document.getElementById("ts").value = oD.getTime();//**SUCCEEDS**
document.getElementById("demo").innerHTML = oD.getTime();//**SUCCEEDS**
var t=document.getElementById("demo").innerHTML
</script>
</body>
</html>
<input> by definition is an empty element, meaning there is no innerHTML, it has no permitted content. And there is no need for a closing tag (</input>).
https://developer.mozilla.org/en/docs/Web/HTML/Element/Input
You can change the property "value", a sort of default input by
document.getElementById("ts").value = oD.getTime();
Or you could add a label like
<label id="label">xyz</label><input id="ts" type="time" name="ts">
and change it with
document.getElementById("label").innerHTML = oD.getTime();
I am using Polymer for a short time and now i want to get the value of a paper input. I don't know how can I do this.
This is not working:
this.form.password
I want to get the Value of this field:
<paper-input label="Password" type="password" id="password" name="password" size="25" value=""></paper-input>
I also want get the Input for submitting of the e-mail input:
<paper-input label="Login" id="email" name="email" size="25" value=""></paper-input>
For submitting I am using:
<paper-button raised value="Login" type="submit" onclick="formhash(this.form, this.form.password);">Login</paper-button>
With normal input fields is this working.
You can use document.querySelector('#password').value to get the value of paper-input with id password in the formhash() function call or inside the function definition.
You can also use polymer's Automatic node finding to get value of an element using its id. In which keep the form/input in custom-element and use this.$.password.value to get the value of an element with id password. Like this
<!-- create a custom component my-form -->
<dom-module id="my-form">
<template>
<form is="iron-form" id="form" method="post">
<paper-input name="name" label="name" id="name"></paper-input>
<paper-button raised on-click="submitForm">Submit</paper-button>
</form>
</template>
<script type="text/javascript">
Polymer({
is: "my-form",
submitForm: function() {
alert(this.$.name.value);
if(this.$.name.value != "") // whatever input check
this.$.form.submit();
}
})
</script>
</dom-module>
<my-form></my-form> <!-- use custom-component my-form -->
If you don't want to use <form> you can also simply store the paper-input values in instance variables and use them later wherever you want.
All you have to do is store the input inside a value like this:
<paper-input label="Password" type="password" id="password" name="password" size="25" value="{{valueNameToStore}}"></paper-input>
And later access it like this:
var myPassword = this.valueNameToStore;
Using <form is="iron-form"> allows you to use <paper-input> and other input elements in forms https://elements.polymer-project.org/elements/iron-form
<form is="iron-form" id="form" method="post" action="/form/handler">
<paper-input name="name" label="name"></paper-input>
<input name="address">
...
<paper-button raised onclick="submitForm()">Submit</paper-button>
</form>
function submitForm() {
document.getElementById('form').submit();
}
or, sometimes you can try this.$.password.value to get the value for password.
Question:--
I am using following HTML code showing error message using tool tip whenever length of Textbook equal to zero,
but i couldn't set my defined message inside tool tip.
<body class="claro">
<form action="">
Enter Name:--
<input type="text" name="firstname" data-dojo-props="" data-dojo-type="dijit.form.TextBox"
trim="true" id="firstname" propercase="true">
<button id="button4" data-dojo-type="dijit.form.Button" type="button">Submit
<script type="dojo/method" event="onClick" args="newValue">
alert("Value selected is: "+newValue);
var firstNameId=dijit.byId("firstname").value;
alert('firstNameId.length:----'+firstNameId.length);
if(firstNameId.length==0)
{
var textBox = dijit.byId("firstname");
dijit.showTooltip(
textBox.get("invalidMessage"),
textBox.domNode,
textBox.get("justMessage"),
!textBox.isLeftToRight()
);
}
else
{
alert('wrong');
);
}
<br>
Help me out....
It's been a while since you posted this question, but if you still need it, here's an answer.
Dijit/form/TextBox doesn't have a showTooltip method. To show a tooltip you can instead call something like:
var textBox = dijit.byId("firstname");
textBox.invalidMessage = "Whatever you want";
Tooltip.show(textBox.get("invalidMessage"),
textBox.domNode, textBox.get("tooltipPosition"),
!textBox.isLeftToRight());
Be sure to include dijit/Tooltip!
I want to set two JavaScript variables as the values of these textboxes.
Can anyone can help me?
<form name="myform1">
<input type="number" name="pop_size" value="3">
<input type="button" value="Pop Size" id="population" onclick="setValue()">
</form>
<form name="myform2">
<input type="number" name="totalIterations" value="2">
<input type="button" value="Iterations" id="Iterations" onclick="setValue()">
</form>
You can use getElementsByName() to get a list of elements by their names in the form. Since your names are unique (which isn't necessary in the spec, but is a good idea for this exact reason), the array returned by that function should have exactly one element in it. Something like this:
var firstVariable = document.getElementsByName('pop_size')[0].value;
var secondVariable = document.getElementsByName('totalIterations')[0].value;
Or did you mean that you want to set the values to what's in a variable? That would be the reverse:
document.getElementsByName('pop_size')[0].value = firstVariable;
document.getElementsByName('totalIterations')[0].value = secondVariable;