DEV Community

Gerardo Cárdenas
Gerardo Cárdenas

Posted on

Submit button

What I built

A demo of a functionality that should be included in a web page that have a button of submit. The submit button will only work if the browser supports Web Monetization.

Submission Category:

The category of this project is: Foundational Technology

Demo

JUST COPY THE NEXT IN A FILE WITH .HTML EXTENSION.
<html>
<head><title>Submit only if it supports Web Monetization</title>
<SCRIPT LANGUAGE="JavaScript">

<!-- Oculto código a navegadores que no soportan JavaScript

function submitAllclearinFields(){
document.Datos.Vo.value="";
document.Datos.Vf.value="";
document.Datos.A.value="";
document.Datos.D.value="";
document.Datos.T.value="";
}

function resuelve(){
doc=open('','Processed',"width=350,height=400,resizable,scrollbars");
doc.document.write('<html><head> <meta name="monetization" content="$ilp.uphold.com/3L3ZYG97kmMk"><title>Submission</title></head><body>');
if (document.monetization) {
doc.document.write('<b>Your data was submitted.</b>');
submitAllclearinFields();
}//if (document.monetization) {
else {
doc.document.write('<b>Your data was NOT submitted.</b>');
doc.document.write('<b>Your browser should support web monetization.</b>');
}//else from if document.monetization
doc.document.write('</body></html>');
doc.document.close();
}
// Termino de ocultar código-->

</SCRIPT>

</head>
<body bgcolor="#000000" leftmargin="50" topmargin="50" marginwidth="50" marginheight="50">
<form name="Datos">
<center>
<font color="yellow">
<h1>Your data:</h1>
</font>
<br />

<table>
<tr>
<td><font color="white"><b>FILL THE FIELDS:</b></font></td>
</tr>
<tr>
<td>
<font color="white">
</font>
</td></tr>
</table>
<br>
<TABLE BORDER="10" CELLPADDING="5" CELLSPACING="2" BORDERCOLOR="00FF00" bgcolor="ffffff">
<tr>
<td>
<b>TEMA:</b> Type anything that will be submitted.
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
Name:<input type="text" name="Vo" value=""><br>
Favorite food:<input type="text" name="Vf" value=""><br>
Favorite drink:<input type="text" name="A" value=""><br>
Favorite dessert<input type="text" name="D" value=""><br>
Hobby:<input type="text" name="T" value=""><br>
<center>
<input type="button" name="SUBMIT" value="SUBMIT" onClick="resuelve();">
</center>
</td>
</tr>
</table>

</center>
</form>
</body>
</noscript>
</html>

Link to Code

How I built it

In a notepad i created this web page to illustrate the functionality of the "SUBMIT" button. It will be nice to have a prebuilt button that only will works if the browser supports MONETIZATION. In other words, the function called when the button is pressed will be executed only if the browser supports WEB MONETIZATION.

Additional Resources/Info

Top comments (1)

Collapse
 
kewbish profile image
Emilie Ma

Great resource! I'll definitely check this out!

You might want to wrap your HTML in a code block. To do this, you can type three backticks (`) followed by html at the beginning of your code, and three backticks at the end.