I have this code.
<script src="http://nerdamer.com/js/nerdamer.core.js"></script>
<script src="http://nerdamer.com/js/Algebra.js"></script>
<script src="http://nerdamer.com/js/Calculus.js"></script>
<div id="text"></div>
<form name="formulario" onsubmit="return procesar(this);">
Ingrese la funcion:
<input name="func" type="text" size="15" />
<input type="submit" value="Procesar" />
</form>
JavaScript Code:
//Calculo de derivada
var func = document.getElementsByName("func")[0].value;
var result = nerdamer('diff(2x^3+3x^2)').evaluate();
document.getElementById('text').innerHTML += '<p>'+result.text()+'</p>';
I need that when I introduce manually the function, on input, when I click on ''Procesar'' calculate derivate. Thank you, I dont know how... need help.
I mean, save the value pass to the function and show result.
I don't know that library, but it seems you can differentiate an expression expr with
nerdamer.getCore().Calculus.diff(nerdamer(expr).symbol).text()
It's a bit long, but safer than nerdamer("diff(" + expr + ")") in case expr is malformed.
Then, you can use
document.forms.formulario.addEventListener('submit', function(e) {
e.preventDefault(); // Don't send form
var expr = this.elements.func.value,
diff = nerdamer.getCore().Calculus.diff(nerdamer(expr).symbol).text();
document.getElementById('text').textContent = diff;
});
<script src="http://nerdamer.com/js/nerdamer.core.js"></script>
<script src="http://nerdamer.com/js/Algebra.js"></script>
<script src="http://nerdamer.com/js/Calculus.js"></script>
<form name="formulario">
Enter function:
<input name="func" type="text" size="15" />
<input type="submit" value="Differentiate" />
</form>
<div id="text"></div>
You have to create procesar function :
function procesar(_this){
//Calculo de derivada
var func = document.getElementsByName("func")[0].value;
var result = nerdamer('diff(2x^3+3x^2)').evaluate();
document.getElementById('text').innerHTML += '<p>'+result.text()+'</p>';
return false; //Prevent the refresh
}
Hope this helps.
This shows derivative:
function Differentiate(sender) {
var func = document.getElementsByName("func")[0].value.trim();
var result = nerdamer('diff(' + func + ')').evaluate();
var html = document.getElementById('text').innerHTML;
html = '<p>' + result.text() + '</p>' + html;
document.getElementById('text').innerHTML = html;
}
<script src="http://nerdamer.com/js/nerdamer.core.js"></script>
<script src="http://nerdamer.com/js/Algebra.js"></script>
<script src="http://nerdamer.com/js/Calculus.js"></script>
<form name="formulario" method="get" onsubmit="return Differentiate(this);">
Ingrese la funcion:
<input name="func" type="text" size="15" />
<input type="submit" value="Differentiate" />
</form>
<div id="text"></div>
Unfortunately I am unable to comment under the accepted answer but would like to make a slight modification to it which should achieve the same result. Also keep in mind that if your function contains more than one variable then you need to specify with respect to which variable you're differentiating.
document.forms.formulario.addEventListener('submit', function(e) {
e.preventDefault(); // Don't send form
var value = this.elements.func.value,
deriv = nerdamer('diff('+value+')').text();
document.getElementById('text').textContent = deriv;
});
<script src="http://nerdamer.com/js/nerdamer.core.js"></script>
<script src="http://nerdamer.com/js/Algebra.js"></script>
<script src="http://nerdamer.com/js/Calculus.js"></script>
<form name="formulario">
Ingrese la funcion:
<input name="func" type="text" size="15" />
<input type="submit" value="Procesar" />
</form>
<div id="text"></div>
Related
I wanted to make a communication form and I literally copy pasted the code of a previously working one. The only changes I have made to the code are the text parts and CSS. All the name and ids are the same including the form. As I previously stated, literally a copy paste. I checked the console tab, no errors at all. At this point I'm confused. Any help is appreciated.
Code:
<DOCTYPE html>
<html>
<head>
<link REL="STYLESHEET" TYPE="TEXT/CSS" HREF="STYLES.css">
<title>ΣΕΛΙΔΑ ΕΠΙΚΟΙΝΩΝΙΑΣ</title>
</head>
<body>
<form name="CForm" id="CForm" method="post">
<h3>ΦΟΡΜΑ ΕΠΙΚΟΙΝΩΝΙΑΣ</h3>
<form name="myForm" id="form1" onsubmit="return validateForm()" method="post">
<label for="fname">ΟΝΟΜΑ ΚΑΙ ΕΠΩΝΥΜΟ </label>
<input type="text" id="fname" name="fname" placeholder="Ονομα&Επωνυμο" class="otherCFcss">
<label for="tel">ΤΗΛΕΦΩΝΟ</label>
<input type="text" id="tel" name="tel" placeholder="Τηλεφωνο.." class="otherCFcss">
<label for="lname">Email</label>
<input type="email" id="email" name="email" placeholder="something#something.com"><br>
<label for="subject">ΘΕΜΑ</label>
<textarea id="message" name="message" placeholder="Γραψε κατι.." style="height:200px" class="otherCFcss"></textarea>
<input type="submit" id="submitbutton" value="ΑΠΟΣΤΟΛΗ">
<input type="reset" id="resetbutton" value="ΑΚΥΡΩΣΗ">
</form>
</body>
</html>
<script>
var a = sessionStorage.getItem("a");
var b = sessionStorage.getItem("b");
var c = sessionStorage.getItem("c");
var d = sessionStorage.getItem("d");
document.getElementById("fname").value= a;
document.getElementById("tel").value= b;
document.getElementById("email").value= c;
document.getElementById("message").value= d;
function send() {
window.location.href = "mailto:dimtrispap1999#gmail.com?subject=Αυτόματο μήνυμα &body="+"Όνοματεπωνυμο: "+ a +"%0A"+"Τηλέφωνο:"+" "+ b +"%0A"+"Αίτημα,ερωτημα: "+d;
}
function validateForm() {
var x = document.forms["myForm"]["fname"].value;
var y = document.forms["myForm"]["tel"].value;
var z = document.forms["myForm"]["email"].value;
var e = document.forms["myForm"]["message"].value;
if (x == "" || y == "" || z == "" || e == ""){
alert("Fill in the blanks");
} else {
var confirmwindow = window.open("", "_black", "width=560,height=190");
confirmwindow.document.writeln("<h3>Σιγουρα θελετε να στειλετε την παρακατω φορμα?</h3>");
confirmwindow.document.write("<b>Name*: </b>" + x + "<br>");
confirmwindow.document.writeln("<b>Τηλεφωνο*: </b>" + y + "<br>");
confirmwindow.document.writeln("<b>Email*: </b>" + z + "<br>");
confirmwindow.document.writeln("<b>Message*: </b><br>" + e + "<br><br>");
confirmwindow.document.write("<input type='submit' onclick='opener.send()' id='submitbutton' value='ΑΠΟΣΤΟΛΗ'>"+ " ");
confirmwindow.document.writeln("<input type='button' onclick='window.close();' id='resetbutton' value='cancel'>");
}
return false;
}
</script>
I also tried to add a variable outside the functions in both the previous and the current code.Something like that var x=document.forms["myForm"]["fname"].value;.In the previous code (the working one) there were no errors.
In the current one I get from the console this error:
Uncaught TypeError: Cannot read property 'fname' of undefined at
elidaepikoinwnias.html:35.
Line 35 is the line where I add the variable.Once I remove it the error is gone but still the JS code doesn't work.
Looks like you have a redundant and unclosed form - cForm
Remove this line
<form name="CForm" id="CForm" method="post">
You should not be nesting forms, check this
I am practicing on how to query url. But i could not get my expected output. Here is my code:
Form 1:
<html>
<head>
<title>Save Value</title>
</head>
<body>
<form action="display.html" method="get">
<label>
First Name:
<input name="name" size="20" maxlength="25" type="text" id="name" />
</label>
<input type="submit" value="submit" />
</form>
</body>
</html>
Form 2:
<html>
<head>
<title>Display</title>
<script type="text/javascript">
<script type="text/javascript">
function queryVar(variable) {
var query = location.search.substring(1);
var vars = query.split("&");
var i;
for (i = 0; i < vars.lenght; i++) {
var pair = vars[i].split("=");
if (pair[0] == variable) {
return pair[1];
}
}
return(false);
}
</script>
</head>
<body>
<form action="#">
<label>
First Name:
<input name="name" size="20" maxlength="25" type="text" id="name" readonly="readonly" />
</label>
<script type="text/javascript">
var firstName = document.getElementById("name").value;
firstName = location.search.substring(1);
</script>
</form>
</body>
</html>
So when i clicked submit button it will go to form 2 and will display the value that i typed in the form 1.
Thank you for your help!
Here's the solution for what you exactly wanted to do.
Form 1
<html>
<head>
<title>Save Value</title>
</head>
<body>
<form action="display.html" method="get">
<label>
First Name:
<input name="name" size="20" maxlength="25" type="text" id="name" />
</label>
<input type="submit" value="submit" />
</form>
</body>
</html>
Form 2
<html>
<head>
<title>Display</title>
<script type="text/javascript">
function queryVar(variable) {
var query = location.search.substring(1);
var vars = query.split("&");
var i;
for (i = 0; i < vars.length; i++) {
var pair = vars[i].split("=");
if (pair[0] == variable) {
return pair[1];
}
}
return(false);
}
</script>
</head>
<body>
<form action="#">
<label>
First Name:
<input name="name" size="20" maxlength="25" type="text" id="name" readonly="readonly" />
</label>
<script type="text/javascript">
document.getElementById("name").value = queryVar("name");
</script>
</form>
</body>
</html>
<script type="text/javascript">
function queryVar(variable) {
var query = location.search.substring(1);
var vars = query.split("&");
var i;
for (i = 0; i < vars.lenght; i++) {
var pair = vars[i].split("=");
if (pair[0] == variable) {
return pair[1];
}
}
return(false);
}
</script>
</head>
<body>
<form action="#">
<label>
First Name:
<input name="name" size="20" maxlength="25" type="text" id="name" readonly="readonly" />
</label>
</form>
<script type="text/javascript">
document.getElementById("name").value=location.search.substring(1);
</script>
remove the duplicated opening tag for first script
you forgot to assign the data to your field, I did (also put the second script outside of form)
Submitted form data (when using post) goes in the HTTP Request headers and are not accessible for JavaScript. You need to use a code preprocessor (like PHP) or pass the data to the url hash which would be extremely rare.
When using get, you should still use a preprocessor and not javascript for doing that. That was the actual purpose when introducing the "get" request type.
I am trying to show forms according to user input in the text box but it is showing it one time only...please help...
index.html:
<html>
<head>
<script type="text/javascript" src="demo1.js"></script>
</head>
<body>
<form name="su">
<input type="text" name="tt" onkeyup="javascript:toggleFormVisibility();" id="sub"/> </a>
</form>
<form id="subscribe_frm" style="display:none">
NAME:<input type="text" name="text">
EMAIL:<input type="text" name="text">
PASSWORD:<input type="text" name="text">
</form>
demo.js:
function toggleFormVisibility()
{
var txt = document.getElementById('sub').value;
for(var i=0;i<txt;i++)
{
var frm_element = document.getElementById('subscribe_frm');
var vis = frm_element.style;
vis.display = 'block';
}
}
A bit of a guess, but I think you are trying to create multiple copies of your form. Try this out:
http://jsfiddle.net/QnrM9/
JS
function toggleFormVisibility() {
var txt = document.getElementById('sub').value;
var neededChildren = txt.length - document.getElementById('form_container').children.length + 1;
for (var i = 0; i < neededChildren; i++) {
var frm_element = document.getElementById('subscribe_frm').cloneNode(true);
var vis = frm_element.style;
vis['display'] = 'block';
document.getElementById("form_container").appendChild(frm_element);
}
}
document.getElementById('sub').addEventListener('keyup', toggleFormVisibility);
HTML
<form name="su">
<input type="text" name="tt" id="sub" />
</form>
<div id="form_container">
<form id="subscribe_frm" style="display:none">NAME:
<input type="text" name="text" />EMAIL:
<input type="text" name="text" />PASSWORD:
<input type="text" name="text" />
</form>
</div>
I'm working on this project where I need to have the value of a textarea change when one of the input values in the same form changes.
HTML:
<form id="form" action="" method="">
<textarea readonly class="overview"></textarea>
<input type="text" class="add" name="product1" />
<input type="text" class="add" name="product2" />
<input type="text" class="add" name="product3" />
<input type="text" class="add" name="product4" />
</form>
The customer is allowed to change the input.class.
The textarea-value should change whenever one of the inputs changes.
The textarea should show something like:
3 x product1
1 x product3
4 x product4
Anybody got an idea?
Thanks in advance,
Joel
<textarea readonly class="overview" id="mytxtarea"></textarea>
$("#product1").blur(function(){
if($("#product1").val()!='')
{
$("#mytxtarea").val('test value');
}
});
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Test</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#form .add').on('keyup', function(){
console.log('test');
var string1 = $('#form .product1').val() + ' x product1\n';
var string2 = $('#form .product2').val() + ' x product2\n';
var string3 = $('#form .product3').val() + ' x product3\n';
var string4 = $('#form .product4').val() + ' x product4';
$('#form textarea').val(string1 + string2 + string3 + string4);
});
});
</script>
</head>
<body>
<form id="form" action="" method="">
<textarea readonly class="overview"></textarea>
<input type="text" class="add product1" name="product1" />
<input type="text" class="add product2" name="product2" />
<input type="text" class="add product3" name="product3" />
<input type="text" class="add product4" name="product4" />
</form>
</body>
</html>
$(".add").keyup(function () {
var app=""
$(".add").each(function () {
if( $(this).val() ) {
var value=$(this).val();
var name=$(this).attr('name');
app +=value+"*"+name+ "\n" ;
}
});
$(".overview").text(app);
});
Watch this.
Hope this will give you some solution.
This will do what you want...
$("input.add").keyup(function() {
var msg = "";
$("input.add").each( function() {
if( $(this).val() ) {
msg += $(this).val() + "x " + $(this).attr("name") + "\n";
}
});
$("textarea.overview").text(msg)
});
I used this with your HTML here: http://jsfiddle.net/XYXpp/
$('input').keyup(function () {
var inputedValue = $(this).val();
var name = $(this).attr('name');
$(".overview").text(inputedValue+name);
});
var fd = new FormData()
fd.append('csrfmiddlewaretoken', document.getElementsByName('csrfmiddlewaretoken')[0].value)
fd.append('field_name', $("input[name='field_name']").serialize())
will return
['field_name=9&field_name=15&field_name=10']
you will then have to parse the info in your view
hi guys i am new to js and html.I need a o/p as when click the button tat should show the all contents entered in form...
My code for giving alert of all entered data in single
how can I add values of form textbox using string ,for loop all should be only in javascript...or else give your own code with the conditions i said....
<html>
<head>
<title>elements in a form</title>
<script type="text/javascript">
function processFormData()
{
var len= document.getElementsByTagName('name');
var str1=null;
for(i=0;i<=len;i++)
{
var str=(subscribe.name[i].value);
str=str1+str;
}
alert(str);
}
</script>
</head>
<body>
<form name ="subscribe" >
<p><label for="name">Your Name: </label><input type="text" name="name" id="txt_name" value="name"></p>
<p><label for="email">Your Email: </label><input type="text" name="email" id="txt_email" value="mail"></p>
<input type="button" value="submit" onclick="processFormData()">
</form>
</body>
</html>
Try that for a start
var len= document.getElementsByTagName('input').length;
// add that you want the number of element
// Change 'name' for 'input' when using 'name' you are looking for <name in the HTML
// if you want the element with the name ABC use getElementsByName()
var str1='';
for(i=0;i<=len;i++)
{
var str=(subscribe[i].value);
str1=str1+str;
}
alert(str1);
jsFiddle example (in jQuery for the calling of the function) : http://jsfiddle.net/DavidLaberge/HPuhg/1/
<html>
<head>
<title>elements in a form</title>
<script type="text/javascript">
var str1=null;
function processFormData()
{
var len= document.getElementsByTagName('name').length;
for(i=0;i<=len;i++)
{
var str=(subscribe.name[i].value);
str1=str1+str;
}
alert(str1);
}
</script>
</head>
<body>
<form name ="subscribe" >
<p><label for="name">Your Name: </label><input type="text" name="name" id="txt_name" value="name"></p>
<p><label for="email">Your Email: </label><input type="text" name="email" id="txt_email" value="mail"></p>
<input type="button" value="submit" onclick="processFormData()">
</form>
</body>
</html>
you have just minor mistake that is you used str in place of str1; Now use the above code.
Try something like:
function processFormData() {
var inputs = document.getElementsByTagName("input"),
i,
len,
stringBuffer = [],
str;
for (i = 0, len = inputs.length; i < len; i++) {
if (inputs[i].type.toLowerCase() === "text") {
stringBuffer.push(inputs[i].value);
}
}
str = stringBuffer.join(""); // str contains concatenated values of all inputs
}
Try this:
function processFormData()
{
var len= document.getElementsByTagName('input').length;
var str = '';
for(i=0;i<len-1;i++)
{
str += document.subscribe[i].value;
}
alert(str);
}