javascript - BarcodeScanner2 = TypeError: Cannot set property 'innerHTML' of null -
i trying develop barcode scanning app using phonegap-1.4.1 in android. trying store values in array code[]
, later on displaying values using array. creating local storage
of values. here declaration of array , counter.
localstorage["counter"]=0; var code = ["test1", "test2","test3", "test4"]; localstorage.setitem("code", json.stringify(code));
here javascript file scanning barcode , using recursive function in app scanning continues , values stored in array.
var scancode = function () { window.plugins.barcodescanner.scan( function (result) { if(result.cancelled == true ) { window.location.href = 'page5.html'; } else { var test2 = json.parse(localstorage.getitem("code")); var k = parseint(localstorage.getitem("counter")); document.getelementbyid(test2[k]).innerhtml = "result.text"; k++; localstorage["counter"] = k; alert("scanned code: " + result.text + ". format: " + result.format + ". cancelled: " + result.cancelled); scancode();} }, function (error) { alert("scan failed: " + error); window.location.href = 'page5.html'; }); }
and after storing values displaying values in page5.html as
<tr> <td >1</td> <td> <p id="test1"></p></td> </tr>
but getting error barcodescanner2 = typeerror: cannot set property 'innerhtml' of null
. please me on issue. in advance.
add below javascript function in html file ( top of page).
function savedatatolocalstorage(barcodevalue) { var olditems = json.parse(localstorage.getitem('barcodes')) || []; var newitem = { 'barcode': barcodevalue }; olditems.push(newitem); localstorage.setitem('barcodes', json.stringify(olditems)); }
now change barcode scan code below :
var scancode = function () { window.plugins.barcodescanner.scan(function (result) { if(result.cancelled == true ) { window.location.href = 'page5.html'; } else { // below function save data in localstorage. savedatatolocalstorage(result.text); scancode(); } }, function (error) { alert("scan failed: " + error); window.location.href = 'page5.html'; }); }
now, if want display barcodes in page5.html read barcodes localstorage , display in page.
use following function page5.html display barcodes in page5.html
function displayvalues() { var olditems = json.parse(localstorage.getitem('barcodes')) || []; for(var i=olditems.length-1;i>=0;i--) { var html=document.getelementbyid("allcodes").innerhtml; document.getelementbyid("allcodes").innerhtml=html+"<br>"+olditems[i].barcode; } }
make 1 div name allcodes in page5.html
your page5.html
<body> <div id="allcodes"> </div> </body> <script> function displayvalues() { var olditems = json.parse(localstorage.getitem('barcodes')) || []; for(var i=olditems.length-1;i>=0;i--) { var html=document.getelementbyid("allcodes").innerhtml; document.getelementbyid("allcodes").innerhtml=html+"<br>"+olditems[i].barcode; } } displayvalues(); </script>
//display in table :
function displayvalues() { var olditems = json.parse(localstorage.getitem('barcodes')) || []; if(olditems.length>0) { document.getelementbyid("allcodes").innerhtml="<table border='2'>"; } for(var i=olditems.length-1;i>=0;i--) { var html=document.getelementbyid("allcodes").innerhtml; html=html+"<tr><td>"+olditems[i].barcode+"</td></tr>"; document.getelementbyid("allcodes").innerhtml=html; } if(olditems.length>0) { var old=document.getelementbyid("allcodes").innerhtml; document.getelementbyid("allcodes").innerhtml=old+"</table>" } }
Comments
Post a Comment