With the below; I am attempting to capture form field contents on click of submit button. However when I go to test it and console.log the variable I just get the HTML of the form field. Any pointers. Or I get uncaught reference error, the variable is not defined.
Mark-Up wise: I'm using input type text and input type radios.
$(document).ready(function(){
$('#submitS').click(function(){
var firstName01 = document.getElementById('firstName').value;
var firstName02 = document.getElementById('firstName2').value;
var lastName01 = document.getElementById('lastName').value;
var lastName02 = document.getElementById('lastName2').value;
var iphone01 = document.getElementById('iphone').value;
var android01 = document.getElementById('android').value;
var iphone02 = document.getElementById('iphone2').value;
var android02 = document.getElementById('android2').value;
});
});
Try using .textContent instead of .value
Related
I am having trouble getting the input values from a div that I appended. It returns as undefined. So basically I am creating the input element and giving it an Id. I have a function that when I clicked a button it is suppose to show the input value..
I am relatively new to JavaScript and I can't seem to find any solution for this. Please help me.. thank you
I am currently doing this in the same JavaScript script so there is no HTML script.
var question1ProjectTitleDiv = document.createElement("div");
var question1ProjectTitle= document.createElement("span")
var question1ProjectTitleName= document.createTextNode("Project Title:")
var question1ProjectTitleInput = document.createElement("input");
question1ProjectTitleInput.type= "text"
question1ProjectTitleInput.maxLength = 256;
question1ProjectTitleInput.id="question1ProjectTitleInputID"
question1ProjectTitleDiv.append(question1ProjectTitle)
question1ProjectTitle.append(question1ProjectTitleName)
question1ProjectTitleDiv.append(question1ProjectTitleInput)
questions.append(question1ProjectTitleDiv) //Add project title
console.log(question1ProjectTitleInput) // Returns <input type="text" maxlength="256" id="question1ProjectTitleInputID">
JS CODE:
let question1ProjectTitleInputID = $("#question1ProjectTitleInputID").val(); //Jquery
let question1ProjectTitleInputID2 = document.getElementById('question1ProjectTitleInputID') //Vanilla JS
You have the following statement:
question1ProjectTitleInput.id="question1ProjectTitleInputID"
So, if you use jquery to read the input, you should
let question1ProjectTitleInputID = $("#question1ProjectTitleInputID").val(); //Jquery
<script type="text/javascript">
function add(element){
var form = window.document.dynamicForm;
// We clone the add button
var add = element.cloneNode(true);
// Create a new HTML tag of type "input"'
my_form=document.createElement('FORM');
my_form.name='myForm';
//var field = document.createElement("input");
// The value filled in the form will be stored in an array
// field.name = "champs[]";
// field.placeholder = "champs[input]";
// field.type = "text";
//MAIN DOCUMENTATION
my_tb=document.createElement('INPUT');
my_tb.type='TEXT';
my_tb.name='myInput';
my_tb.placeholder='Values of my Input';
my_form.appendChild(my_tb);
my_tb1=document.createElement('INPUT');
my_tb1.type='text';
my_tb1.name='myInput1';
my_tb1.placeholder='Values of my hidden1';
my_form.appendChild(my_tb1);
my_tb2=document.createElement('INPUT');
my_tb2.type='text';
my_tb2.name='myInput2';
my_tb2.placeholder='Values of my hidden1';
my_form.appendChild(my_tb2);
document.body.appendChild(my_form);
var rem = document.createElement("input");
rem.value = "Remove a field";
rem.type = "button";
// Add the onclick event
rem.onclick = function onclick(event)
{del(this);};
// We create a new element of type "p" and we insert the field inside.
var bloc = document.createElement("p");
bloc.appendChild(field);
//form.insertBefore(add, element);
//form.insertBefore(rem, element);
form.insertBefore(bloc, element);}
Sir Thanks in advance .sir here i want to access the input given by the user in every input block .if user increase the number of input block the i can get the input text in new block and send that to my php file which store that data into database .
please help me to access the new and created input blocks by user on clicking add column
document.forms["form_name"].getElementsByTagName("input");
refer get all the elements of a particular form
I have a js file with this code:
<form>
<input onchange="this.value"/>
<input type="pas" onchange="this.value"/>
</form>
This code get data for inputs and replace in main page. Now I don't want replace in html page. I want get input's value and save in string variable. for example:
var name = ""; // input 1
var Pas = ""; // input 2
How can this work?
Thank you.
You can give the input elements id(say, 'name' and 'password') and access it this way
var input1 = document.getElementById('name').value;
var input2 = document.getElementById('password').value;
How does one get the .tagName of a value passed in an HTML form input? This is to check whether the value that has been passed is an 'iFrame'. The input is to only accept iframes
For example:
//HTML
<input type="text" id="iFrame">
<button id="butt">Push</button>
//JavaScript
document.getElementById("butt").onclick = function(){
var iframe = document.getElementById("iFrame").value;
console.log(iframe.tagName);
}
I think you are looking for
var iframe = document.getElementsByTagName("iFrame")
I perhaps did not ask the question in the best way, initially.
I wanted to check if the value passed in the input field was an "iframe" (the input is to only accept iFrames). Since .value returns a string and not an HTML tag, getting the tag name through basic methods would not work. I needed another way.
For anybody else who needs a quick solution, this is how I managed to do it:
document.getElementById("submit").onclick = function(){
var iframe = document.getElementById("iFrame").value;
var check1 = iframe.match(/iframe/g);
var check2 = iframe.match(/frameborder/g);
var check3 = iframe.match(/http:/g);
var check = check1.length + check2.length + check3.length;
if (check === 4) {
alert("good!");
}
}
I want to assign value of text box in another text box's value present in the immediate next line. How to do that using html and javascript?.
Eg:
input type = "text" name = "test" value = "pass">
input type = "hidden" name = "hiddentest" value = "(here i have to get the value of previous textbox)"/>
Please help me..
Assuming the two textboxes have IDs of "textbox1" and "textbox2", respectively:
var tb1 = document.getElementById('textbox1');
var tb2 = document.getElementById('textbox2');
tb1.value=tb2.value;
First, put a function into your page that will handle it:
<script language="JavaScript" type="text/javascript">
function setHiddenValue()
{
document.getElementById('txtHidden').value = document.getElementById('txtVisible').value;
}
</script>
Next, hookup the event on the visible textbox to call the function whenever the text changes:
<input type="text" onChange="javascript:setHiddenValue();"></input>
document.getElementById('hiddentest').value = document.getElementById('test').value ;