I want to send result to JavaScript to display the result in html using eel.
I'm adding the two numbers reading it from JavaScript through html & I want to display the result in html side at the end..
main.py
import eel
import requests
eel.init('web')
#eel.expose
def sum(a,b):
c = int(a) + int(b)
print(c)
return c
eel.start('index.html', size=(500, 500))
main.js
function sum() {
var a = document.getElementById("data_1").value;
var b = document.getElementById("data_2").value;
eel.sum(a, b);
}
index.html
<!doctype html>
<html lang="en">
<head>
<title>Test eel</title>
<script type="text/javascript" src="/eel.js"></script>
<script type="text/javascript" src="/myscript.js"></script>
</head>
<body>
<h3 class='label_'>Num 1 </h3>
<input type="text" id="data_1" >
</br>
<h3 class='label_'>Num 2 </h3>
<input type="text" id="data_2" >
</br>
<input type="button" class="submit" value="submit" onclick="sum()"></br>
output
<div id='file-name'>---</div>
</div>
</body>
</html>
You can use JavaScript callback function to pass the return value to html
main.js
function sum() {
var a = document.getElementById("data_1").value;
var b = document.getElementById("data_2").value;
eel.sum(a, b)(callback); // change here
}
// add function as
function callback(c) {
document.getElementById("data").value = c;
}
In index.html add this below code to print result on html side
index.html
<div>
Result : <input type="text" id="data" >
</div>
Related
I'm trying to create an simple web page to test the crypto module in js, but even when i use browserify my brower returns Uncaught ReferenceError: require is not defined.
My script.js:
const { createHash } = require('crypto');
function hasher() {
const password = document.getElementById("js_n_password").value;
const hash = createHash(password);
document.getElementById("hashed").innerHTML = password;
}
My index.html:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="bundle.js"></script>
<script src="script.js"></script>
</head>
<body>
<h1>Web Hash</h1>
<form class="input" id="input">
<label for="n_password">Password:</label>
<input type="password" id="js_n_password" name="n_password">
</form>
<button onclick="hasher()">hash it</button>
<p class="hashed" id="hashed"> </p>
</body>
</html>
Why browserify isn't working and how can i make it work?
PS: add module.exports = function (n) { return n * 111 } to script.js doesn't change anything.
I'm trying to get a JS script to insert HMTL on a python flask server and it doesn't seem to want to run.
File Structure:
project
static
css
style.css
templates
demo.html
download.html
index.html
wrongLink.html
main.py
Here is the flask code that runs the webserver:
from flask import Flask, render_template, send_file
from flask import request, redirect
app = Flask(__name__)
#app.route('/')
def main():
return render_template('demo.html')
I also render some templates like this:
return render_template('download.html',
thumb=thumb, title=title, options=options, counter=counter)
I realised that I'm having trouble specifically with one piece of JS in the download.html file:
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<link href="{{ url_for('static', filename='css/style.css') }}"
rel="stylesheet" type="text/css">
</head>
<body>
<div>
<form action="/getVideo" method="post">
<input type="text" name="Link" value="{{ Link }}">
<input type="submit" value="Convert">
</form>
<img src="{{ thumb }}" alt="Thumbnail" width="480" height="270">
<p>{{ title }}</P>
<p id="demo"></p>
<form id="options">
<input type="submit" value="Download">
</form>
</div>
<script type="text/javascript">
window.alert("JS works");
var i;
var options = JSON.parse{{options | tojson}};
for (i = 0; i < options.length; i++) {
out += '<input type="radio" value="' + options[i]["res"] += '"><br>';
}
document.getElementById("demo").innerHTML = "hi";
</script>
</body>
</html>
Neither the alert window or the element edit execute so I'm not sure what's happening there.
I'm creating a webpage which checks whether the data given by the user matches the data in the webpage's script.
My code:
var a = document.getElementById("a");
var b = document.getElementById("p");
function checking() {
if (b.innerHTML == a.value){
alert("All is perfect");
} else {
alert("Please check again");
}
}
<!DOCTYPE html>
<html>
<head>
<title>Terms and Conditions Checker</title>
</head>
<body>
<input id="a" autocomplete="off" />
<button onclick="checking()">Check</button>
<div id="p" style="display:none;">
a
b
</div>
</body>
</html>
So, I want to replace the empty spaces at the end of the lines with a space inside the <div>. So, if the code is
<div id="p" style="display:none;">
a
b
</div>
it should match:
<div id="p" style="display:none;"> a b </div>
Remove all tab , enter and using regex /(\r\n\t|\n|\r\t)/gm
See below snippet :
var a = document.getElementById("a");
var b = document.getElementById("p");
function checking() {
var val = b.innerHTML.replace(/(\r\n\t|\n|\r\t)/gm, "");
console.log(a.value,val);
if (val == a.value){
alert("All is perfect");
} else {
alert("Please check again");
}
}
<!DOCTYPE html>
<html>
<head>
<title>Terms and Conditions Checker</title>
</head>
<body>
<input id="a" autocomplete="off" />
<button onclick="checking()">Check</button>
<div id="p" style="display:none;">
a
b
</div>
</body>
</html>
I have some Input fields on my page, these fields are already filled when I refresh the page.
How can I clear the pre-filled input fields without using reset button on page refresh?
function add() {
var num1, num2, c;
num1 = Number(document.getElementById("a").value);
num2 = Number(document.getElementById("b").value);
c = num2 + num1;
document.getElementById("answer").value = c;
}
<!doctype html>
<html>
<title>
addition WEBSITE
</title>
<body>
<div align="center">
<h1>addition</h1>
a= <input id="a"> b= <input id="b">
<button onclick="add()">Add</button> Sum= <input id="answer">
</div>
</body>
</html>
You can clear the fields on window.onload .
<!doctype html>
<html>
<title>
addition WEBSITE
</title>
<head>
</head>
<script >
window.onload = function(){
document.getElementById("a").innerHTML = "";
document.getElementById("b").innerHTML = "";
}
function add()
{
var num1,num2,c;
num1= Number(document.getElementById("a").value);
num2= Number(document.getElementById("b").value);
c=num2+num1;
document.getElementById("answer").value=c;
}
</script>
<body>
<div align="center">
<h1>
addition
</h1>
a= <input id="a">
b= <input id="b" >
<button onclick="add()">Add</button>
Sum= <input id="answer" >
</div>
</body>
</html>
Your code should be better.
Anyway, if you want the fields to be empty when refreshing the page, create an anonymous function called by itself like this:
function () {
document.getElementById('a').value = "";
}
Get the other input elements and do the same inside this function.
Happy coding !!
How do I get JSONRPC working properly with JQuery on the client-side, on the referenced types of calls?
To represent my attempt, I've tried to create the smallest possible test-case:
Server[1]
from txjsonrpc.web import jsonrpc
from twisted.web import server
from twisted.internet import reactor
class Math(jsonrpc.JSONRPC):
def jsonrpc_add(self, a, b):
return a+b
def jsonrpc_echo(self, foo):
return str(foo)
def jsonrpc_hello(self):
return u"Hello World!"
reactor.listenTCP(7080, server.Site(Math()))
reactor.run()
Client[2]
<!DOCTYPE HTML>
<html>
<head>
<title>Math is fun?!</title>
<script type="text/javascript" charset="utf-8" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="https://raw.github.com/datagraph/jquery-jsonrpc/master/jquery.jsonrpc.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$.jsonRPC.setup({
endPoint : 'http://localhost:7080',
namespace : ''
});
$("input#evaluate").click(function() {
$.jsonRPC.request('jsonrpc_echo', {
params : [$("textarea#input").val()],
success : function(data) {
$("<p />").text(data.result).appendTo($("p#result"));
},
error : function(data) {
$("<p />").text(data.error.message).appendTo($("p#result"));
}
});
});
});
</script>
</head>
<body>
<p id="result"></p>
<p>
<textarea name="input" id="input"></textarea>
</p>
<p>
<input name="evaluate" id="evaluate" value="evaluate" type="button" />
</p>
</body>
</html>
Adapted from https://stackoverflow.com/a/4738563/1438003
Adapted from https://github.com/filonenko-mikhail/maxima-json-rpc/blob/master/examples/js-maxima-rpc-client.html