Access post value in js - javascript

Here is my sample code in js which display a form with textbox name=q and a submit button.
var imghtml='<div id="qrfile"><canvas id="out-canvas" width="320" height="240"></canvas>'+
'<form name="test" action="qr.js" method="get"><div id="imghelp">Enter student id'+
'<br> manually<br>'+
'<input type="text" name="q"/><input type="submit" value="submit" onclick="myFunction()">'+
'</div></form>'+
'</div>';
I want to capture the value when user click on submit button, the value is display in a div. i've create the function myFunction() below:
function myFunction(){
document.getElementById("result_1").value=`q`;
}
the error is that i've wrongly capture q which is textbox name. any help

Give your textbox an id and find that id using document.getElementById. Then you'll be able to get the value in the textbox.

Give the field an ID then access/set the value in the way Suman suggested or using jquery instead you could do the following
$("#result_1").val() //Retrieve
$("#result_1").val("q") //Set

Related

set value in a form or pass a value in a form using jquery or javascript or ajax

i created a Google Form and list down all the ID in each input type, and then created a localhost with the same ID,
The first thing i want to do is to save the values into a localhost and pass the values in the Google Form or set the values into the corresponding ID or Name in each input type in a new tab, is there a way to do this using ajax or jquery?
my form looks like this
<form method="post" action"">
<input type="text" name="FName">
<input type="text" name="LName">
<input type="Submit">
</form>
$post('https://docs.google.com/a/grabtaxi.com/forms/d/e/1FAIpQLSfjiuhFbURVavdNW82ofHG3gPpBUKkK2VATQQKmV-YKKrJ75Q/viewform'{FName:Fname,LName}function(){
window.open('https://docs.google.com/a/grabtaxi.com/forms/d/e/1FAIpQLSfjiuhFbURVavdNW82ofHG3gPpBUKkK2VATQQKmV-YKKrJ75Q/viewform');
});
i am trying to use the $.post() in jquery but it looks like i cannot set the values into the Google Form.
Any tips please... Thank You very much
You should wrap your javascript code inside a scipt tag. Then, you should bind the code to submit event, tha happened when you press the submit button.
<script type="JavaScript">
$('input[type=submit]').submit(
// here you should put your code
});
</script>
And check your code, you wrote $post instead of $.post mi sing the dot.

Changing post parameters of form on submit without it being visible to the user

I have following piece of code:
<h:form >
<h:inputText value="#{bean.property}"/><br/>
<h:commandButton
value="Send"
action="#{bean.action}"/>
</h:form>
How do I (without jQuery) change the value of property from inputText in post form when someone clicks the button without it being visible to the user? Let's say that I know the inputTexts name in generated html and it is for example
<input type="text" name="inputName" />
My try is
document.forms['formName'].onsubmit = function(){
var txt = document.getElementsByName("inputName")[0];
txt.value = "changed"
documents.forms['formName'].submit();
}
But this changes what is in inputText and it's clearly visible.
Add a hidden input field to the form. In the OnSubmit event handler, set that field to whatever value you want. Have the backend ignore the field that's visible to the user and only use the hidden one (you can accomplish that via how you name the fields).

Retrieve text from jQuery to HTML after clicking button

I am learner for HTML and jQuery. Trying to retrieve the text from jquery to html
JQuery: To return textbox value after clicking button.
$('#value').click(function() {
var value = $("#test").val();
return value;
});
HTML: Typing the text and clicking on button.
<input type="text" id= "test" title="details/>
<input type ="button" id="value" value ="Detail" />
<!-- any suggestions how to get the stored value from jquery to html --!>
Is there a way to return the text value from jquery to HTML code so that i can able to some operations after clicking on submit button.
Can you please provide any suggestions.
I'm not sure what it is your trying to do? If i'm understanding correctly basically; you've landed on a page (page1) on page 1 there an element with a value(hidden or not) that when a button is clicked it lands into an empty text box? For example,
<p>Is your name <span id="name">John</span>?</p>
<br/>
<button id="yes_get_name" value="submit">Yes</button>
<input type="text" id="insert_tname" name="name" value=""/>
<script type="text/javascript">
$( document ).ready(function() {
// Trigger function when Button Clicked
$( "#yes_get_name" ).click(function() {
// Assigne Name as a variable
var name;
// Assign Value of Name as text of span id="Name"
var name = $('#name').text()
// Insert names value into input
$("#insert_tname").val(name);
});
});
</script>
I hope this helps. Other than this i might be misunderstanding the question.
Here's a jsfiddler on the roof to test.
Yes you can use following to write back into textbox:
$("#test").val("something");

How to access form element with javascript without using element's id

I want to access form elements by using javascript. The form is generated dynamically so the name, id of the form and the elements are variable. I want to get the id value of a textarea inside it by providing the name of the form, which is generated by a different script.
For instance:
<form method=post name=form33>
<textarea id=466 cols=50 rows=5></textarea>
<input name=submit33 onclick=postCmnt(33) value=Post type=button>
</form>
and I have the name of the form name "form33" and I need its textarea id that is 466 as output...
Javascript Generating The Form:
function openComment(id, msgid, div) {
var div = document.getElementById(div);
div.innerHTML = "<form method=post name=form"+id+">
<textarea id="+msgid+" cols=50 rows=5></textarea>
<input name=submit"+id+" onclick=postCmnt("+id+") value=Post type=button>
</form>"
}
Javascript that need to access the form
Here is my attempt to access the id name of textarea by providing form name.
function postCmnt(id){
var msgid=document.forms["form"+id].elements[0].id.value;//the text area's id
var msg=document.getElementById(msgid).value;//value of text area
//rest scripts goes here
}
Information:
Form is not static generated by call to the function openComment()
predicting number of form in a page is not possible as it depends upon user input .Though the textarea is the 1st element of the form .
You can add a hidden field that contains the msgid:
Javascript Generating The Form:
function openComment(id,msgid,div){
var div = document.getElementById(div);
div.innerHTML="<form method=post name=form"+id+">
<input type='hidden' id='theid"+id+"' value='"+msgid+"'>
<textarea id="+msgid+" cols=50 rows=5></textarea>
<input name=submit"+id+" onclick=postCmnt("+id+") value=Post type=button>
</form>"
}
and then just get the value directly:
function postCmnt(id){
var msgid=document.getElementById("theid"+id).value;//the text area's id
var msg=document.getElementById(msgid).value;//value of text area
//rest scripts goes here
}
If there is only one form in the documents, you can do
document.forms[0]
As pointed out you can use
document.getElementById("teller")[i]
to access the i-th field of the form with id "teller".
Demo

passing textbox values on the same page url without form or submit button using jquery or javascript

is there any ways to pass textbox values on the same page url without form or submit button i have javascript function but this function is working for drop down values not for text box values? i need to send textbox values on the same page url without form and submit button
now this is drop down page in this page dropdown values passing on the same page url but now i'm confused how can i send textbox values on the same page url without form or submit button using this javascript function?
function getComboB(sel) {
var customers=document.getElementById("customers");
var value = sel.options[sel.selectedIndex].value;
addreceivable.action = "addreceivable.php?customers="+value+"";
addreceivable.submit();
}
<form name="addreceivable" id="addreceivable">
<select name="customers" id="customers">
<option value="Test">Test</option>
<option value="Demo">Demo</option>
<option value="Check">Check</option>
</select>
<input type="submit" name="test" id="test" value="Submit">
</form>
now my problem is solved here i have completed my code passing textbox values on the same page url without submit button using javascript function
function getComboB(sel) {
var textbox=document.getElementById("textbox");
var input_val = document.getElementById("textbox").value;
addreceivable.action = "test2.html?textbox="+input_val+"";
addreceivable.submit();
}
<form name="addreceivable" id="addreceivable">
<input name="textbox" class="textbox" onchange="getComboB();">
</form>
thanks to all friends!
With textboxes use .val() to grab the value of it. I believe that is jQuery though so you might need that.
function getTextbox() {
var textbox = $('input.textbox').val();
//Do what you want with textbox now
}
<input name="textbox" class="textbox">
function getComboB(sel){
//your other code
//new code here
var input_val = document.getElementById("id of your textbox").value;
}
You could use this to listen for changes in the text box:
document.getElementById("id of your textbox").addEventListener("change", getComboB);
The above line would listen for typing in the textbox and then call your function getComboB() at which point you would get the value of your textbox.

Categories

Resources