Last active
August 29, 2015 14:25
-
-
Save Shadey/a5d04f1eb3e79313f5ed to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="firmware-form"> | |
<select data-id="0" name="five"><option value="OLD">OLD</option><option value="NEW">NEW</option></select> | |
<select data-id="1" name="zero"><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option></select>. | |
<select data-id="2" name="one"><option value="0">0</option><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option></select>. | |
<select data-id="3" name="two"><option value="0">0</option></select>- | |
<select data-id="4" name="three"><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option></select> | |
<select data-id="5" name="four"><option value="E">E</option><option value="U">U</option><option value="J">J</option></select> | |
<button id="submit-button">Submit</button> | |
</div> | |
<div id="qr_code"></div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* This all should work clientside with no changes to the whatever backend code. However this requires a few small changes to the html | |
Change the form "firmware-form" to a div. This shouldn't change anything in your css. Next remove the "submit" type from the button and give it a id of "submit-button". | |
Lastly you just need a div with the id "qr_code" where you want the qr code to appear and it should work. Lastly this method only works in modern browsers.Tested in Firefox 39 | |
Example of it working here: http://a.pomf.cat/tzdeij.webm */ | |
var getQrCode = function(){ | |
sendData = new Object(); | |
sendData.zero = document.getElementsByName("zero")[0].value; | |
sendData.one = document.getElementsByName("one")[0].value; | |
sendData.two = document.getElementsByName("two")[0].value; | |
sendData.three = document.getElementsByName("three")[0].value; | |
sendData.four = document.getElementsByName("four")[0].value; | |
sendData.five = document.getElementsByName("five")[0].value; | |
var XHR = new XMLHttpRequest(); | |
var FD = new FormData(); | |
for(name in sendData){ | |
FD.append(name,sendData[name]) | |
} | |
XHR.open("POST","qr_code.png"); | |
XHR.responseType = "blob" | |
XHR.onload = function(e){ | |
if(this.status === 200){ | |
var blob = this.response; | |
var img = document.createElement('img'); | |
img.onload = function(e){ | |
window.URL.revokeObjectURL(img.src); | |
}; | |
img.src = window.URL.createObjectURL(blob); | |
document.getElementById("qr_code").appendChild(img); | |
} | |
}; | |
XHR.send(FD) | |
}; | |
window.onload = function(){ | |
document.getElementById("submit-button").onclick = getQrCode; | |
}; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment