I want get value1, value2, value3... but i have trouble.
why this error?
can't access property "concat", texto1 is undefined
please help me!!
I have the html code:
<div id=items>
<input type="text" name="cadena1" id="idcadena1" value="valor" />
<input .....
</div>
<div>
<button name="button" type="button" id="concatenate">concatenar</button>
</div
Mi javascript code is the following:
$('#concatenate').click(function () {
var n = $('#items]').length;
var texto1 = $('input:first', '#items:first').value;
var texto2=texto1.concat(n);
});
In jQuery, it's .val() to get/set the value.
var texto1 = $('input:first', '#items:first').val();
Related
IM trying to test to see if my code is set up right to access the text value of a form. im just trying to access text value and then use Console.log to confirm that its getting that far.
here is my code(
<body>
<form id="form">
<input type="text" id="item">
<button class="Btn add item">Add item</button>
</form>
<script type="text/javascript">
document.getElementById("item").onclick = function() {
var output = document.getElementById("item").value;
console.log(output);
}
</script>
</body>
When I run it in the Dev tools in chrome nothing happens. No error and console doesn't log the value I entered into the form.
You can try something like this:
var output = document.getElementById("item").innerText;
Your mistake is incorrect names of the ID-attributes. Be careful!
<body>
<form id="form">
<input type="text" id="input"/>
<button id="button" type="button">Add item</button>
</form>
</body>
<script type="text/javascript">
document.getElementById("button").onclick = function(){
var str = document.getElementById("input").value;
console.log("Your string is: " + str);
}
</script>
Your input tag lacks the value attribute and has no default value.
I'm assuming you want to log the value when the button is clicked rather than the input. Try this out:
<form id="form">
<input type="text" id="item"/>
<button id="btn" class="Btn add item" type="button">Add item</button>
</form>
<script type="text/javascript">
document.getElementById("btn").onclick = function() {
var output = document.getElementById("item").value;
console.log(output);
}
</script>
It's hard to understand what you are looking for from your example, but if you want your value to be logged as you type it can be done this way :
<form id="form">
<input type="text" id="item">
<button class="Btn add item">Add item</button>
</form>
<script type="text/javascript">
document.getElementById('item').addEventListener('keyup', function(e){
var output = e.target.value
console.log(output)
})
</script>
As Markus Zeller said, when your input tag has no value, console.log will show a space.
Try entering any number of characters, then out focus, then click on the input again, you will see it displays exactly the value of the input tag you just entered.
I have my html elements like this:
<body ng-controller="addController">
<div class="col-sm-10">
<label class="control-label">tableName:</label>
<fieldset ng-repeat="tableName in tableNames">
<input type="text" class="form-control" ng-model="tableName.tableName" /><br />
</fieldset>
<button class="btn btn-default" ng-click="addNewTable()">Add tablename</button>
<input type="submit" ng-click="add()" />
</div>
<div>
<pre>{{tableNames|json}}</pre>
</div>
</body>
This code generates a text box every time button is clicked.
js:
function addController($scope, $http) {
$scope.tableNames = [];
$scope.addNewTable = function (tableName) {
$scope.tableNames.push({});
}
}
When i display tableNames it gives me:
[{"tableName":"textboxvalue"},{"tableName":"textboxvalue"}];
But what i intend is getting output of:
[{"tableName1":"textboxvalue","tableName2":"textboxvalue","tableName3":"textboxvalue"}];
What should I have to change in design in order to get desired output.
Thanks in advance.
You're pushing objects to the array each time but what you want is to add key value pair in the object in the array.
try this
$scope.tableNames = [{}];
$scope.addNewTable = function (tableName) {
$scope.tableNames[0].tableName = "textboxvalue" ;
}
I want to set value to form input using function then POST the value. How can I do this?
JS:
function saveSignature() {
$('#signature').empty();
var dataUrl = $('.js-signature').jqSignature('getDataURL');
$('#signature').append($('<p>').text(dataUrl));
$('#data').jqSignature('getDataURL');
}
I tried to make it like this but it doesn't work.
<form action="add.php" method="post">
<input id="data" type="hidden" name="data" value="id='data'">
<button id="saveBtn" class="btn btn-default" onclick="saveSignature();" disabled>Save Signature</button>
</form>
you can use http://api.jquery.com/val/ to modify the value of an input.
<script>
function saveSignature() {
$('#signature').empty();
var dataUrl = $('.js-signature').jqSignature('getDataURL');
$('#signature').append($('<p>').text(dataUrl));
$('#data').val(dataUrl);
}
</script>
function signature () {
var somevalue = 'xyz';
$(['name=data']).val(somevalue);
...
}
I am trying to make a form with one text input and a submit button. What I want the script to do is take the text after I click submit and store it as a value. After that, if I type something else (without refreshing the page) and click submit store the input as another value. This process can be done one hunded times so I will have 100 different values. What I also want to do with this values is put them in a new array.So:
var AllValues = [""+Val1+"",""+Val2+"",""+Val3"",..,""+Val99+"",""+Val100""];.
The code I have managed to write untill now is this but it won't actually help you:
<!DOCTYPE html>
<html>
<body>
<form id="form1">
Type the words here: <input type="text" name="fname"><br>
<input type="button" onclick="myFunction()" value="Submit">
</form>
<input type="button" onclick="myFunction2()" value="Print all inserted words at array">
<p id="demo"></p>
<script>
function myFunction() {
}
function myFunction2() {
var AllValues = [""+Val1+"",""+Val2+"",""+Val3"",..,""+Val99+"",""+Val100""];
document.getElementById("demo").innerHTML = AllValues;
}
</script>
</body>
</html>
I am asking this question after trying a lot of things which didn't worked and I know that the script will work only if I use HTML local storage but I don't have the knowledge to do it even if I did a lot of research on this topic. I dont want to only store the values but I want to get them inside a new Array. I am making the question a bit more general as always in order to help as many as possible. Could you please help me? Thanks in advance.
You had several issues, the main is that you have to provide the "id" attribute for the input text named "fname".
Next you have to store the AllValues array in context visible by two declared functions (in this case, the global context).
<!DOCTYPE html>
<html>
<body>
<form id="form1">
Type the words here: <input type="text" name="fname" id="fname"><br>
<input type="button" onclick="myFunction()" value="Submit">
</form>
<input type="button" onclick="myFunction2()" value="Print all inserted words at array">
<p id="demo"></p>
<script>
var AllValues = [];
function myFunction() {
var fname = document.getElementById("fname").value;
AllValues.push(fname);
}
function myFunction2() {
document.getElementById("demo").innerHTML = AllValues;
}
</script>
</body>
</html>
Try also the immediate function to avoid storing variables in global context. The code that I paste is not very clean of course, but working :)
For a very basic way of doing this, try the following:
HTML:
<form id="form1">Type the words here:
<input type="text" name="fname">
<br>
<input type="button" value="Submit" class="submit">
</form>
<input type="button" class="show-button" value="Print all inserted words at array">
<p id="demo"></p>
JS:
var values = new Array();
$(".submit").on("click", function () {
values.push($('input[name="fname"]').val());
});
$(".show-button").on("click", function () {
$("#demo").html(values.join("<br>"));
});
Fiddle here: http://jsfiddle.net/5z4g04js/2/
My answer:
<form id="form1">
Type the words here: <input id="words" type="text" name="fname"><br>
<input type="button" id="submitWords" value="Submit">
</form>
<input type="button" id="printWords" value="Print all inserted words at array">
<p id="demo"></p>
<script>
var arrWords = [];
var btnSubmit = document.getElementById('submitWords');
var btnPrint = document.getElementById('printWords');
var demo = document.getElementById('demo');
btnSubmit.onclick = function() {
var words = document.getElementById('words').value;
arrWords = words.split(' ');
console.log(arrWords);
}
btnPrint.onclick = function() {
for(var i = 0; i < arrWords.length; i++) {
demo.innerHTML += arrWords[i]+"<br>";
}
}
</script>
</body>
</html>
You could use jquery to do that:
var all_values =[];
function myFunction() {
var temp_val = $("#fname").val();
alert(temp_val);
all_values.push(temp_val);
}
function myFunction2() {
alert(all_values);
}
<form id="form1">
Type the words here: <input type="text" name="fname" id="fname"><br>
<input type="button" onclick="myFunction()" value="Submit">
</form>
<input type="button" onclick="myFunction2()" value="Print all inserted words at array">
<p id="demo"></p>
working demo
p.s. edited jquery answer with more changes. working demo
Using this getAllValues(name) function, you can return the values of any element with the name of 'name'.
function getAllValues(name) {
var nameMatches=document.getElementsByName(name);
var AllValues=[];
for (var i=0; i<nameMatches.length; i++) {
AllValues.push(nameMatches[i].name);
AllValues.push(nameMatches[i].value);
}
return AllValues;
}
To call this you would use getAllValues('fname').
Please help me find the error,the normal button "Redial" works fine but the "hangoff" one doesn't..
<div id="buttons">
<button type="button" id="Redial">Call</button>
<input type="image" src="hangup.png" alt="hangoff">
</div>
var hangoff = document.querySelector("#hangoff");
var Redial = document.querySelector("#Redial");
hangoff.onclick = Dropcall;
Redial.onclick = Callagain;
function Dropcall() {
phone.hangup();
remoteStream.parentNode.removeChild(remoteStream);
}
function Callagain() {
window.location.reload();
}
You are selecting for an id that doesn't exist.
div id="buttons">
<button type="button" id="Redial">Call</button>
<input type="image" src="hangup.png" alt="hangoff"> <-- does not have id hangoff.
</div>
var hangoff = document.querySelector("#hangoff");
var Redial = document.querySelector("#Redial");
Just change your input tag to:
<input type="image" src="hangup.png" alt="hangoff" id="hangoff">
and that will do the trick. (notice the new "id" attribute)
hangoff = document.querySelector("#hangoff")
this selector is looking for HTMLElement with id hangoff
if you want to get element with attribute alt=hangoff you have to use next seletor
hangoff = document.querySelector("[alt='hangoff']")
or set id for input
<input type="image" src="hangup.png" id="hangoff">