html - JavaScript error with XML when trying to read empty node -
i trying render catalog xml document , works, although when trying show default image if there no image present in xml node, disables parent node therefore forcing not show of , reads me error in console saying:
uncaught typeerror: cannot read property 'getelementsbytagname' of undefined
which pointing part of code:
if (records[i].getelementsbytagname("image")[0].childnodes.length > 0) {
so question in code below error causing not load xml node?
ps: if needs more of code please let me know, , happy post it.
for (var = fromitem; < nextmaxitem; i++) { if (records[i].getelementsbytagname("image")[0].childnodes.length > 0) { xmlcontent += '<article class="post ' + records[i].getelementsbytagname("category")[0].childnodes[0].nodevalue + '" id="">' + '<div class="col-sm-4 col-lg-4 col-md-4"><div class="thumbnail img-hover">' + '<a class="fancybox" rel="group" href="' + records[i].getelementsbytagname("bigimage")[0].childnodes[0].nodevalue + '" title="'+ records[i].getelementsbytagname("shortdescription")[0].childnodes[0].nodevalue +'">' + '<img class="product-image" src="' + records[i].getelementsbytagname("image")[0].childnodes[0].nodevalue + '" alt="' + records[i].getelementsbytagname("title")[0].childnodes[0].nodevalue + '" />' + '<div class="caption">' + '<h4>' + records[i].getelementsbytagname("title")[0].childnodes[0].nodevalue + '</h4>' + '<p>' + records[i].getelementsbytagname("shortdescription")[0].childnodes[0].nodevalue + '</p>' + '</div>' + "</a></div></div></article>"; } else { xmlcontent += '<article class="post ' + records[i].getelementsbytagname("category")[0].childnodes[0].nodevalue + '" id="">' + '<div class="col-sm-4 col-lg-4 col-md-4"><div class="thumbnail img-hover">' + '<a class="fancybox" rel="group" href="' + records[i].getelementsbytagname("bigimage")[0].childnodes[0].nodevalue + '" title="'+ records[i].getelementsbytagname("shortdescription")[0].childnodes[0].nodevalue +'">' + '<img class="product-image" src="/images/products/no-preview.jpg" alt="no preview available" />' + '<div class="caption">' + '<h4>' + records[i].getelementsbytagname("title")[0].childnodes[0].nodevalue + '</h4>' + '<p>' + records[i].getelementsbytagname("shortdescription")[0].childnodes[0].nodevalue + '</p>' + '</div>' + "</a></div></div></article>"; } }
here whole javascript code:
var page = 1, perpage = 12, content = document.getelementbyid('content'), pagination = document.getelementbyid('pagination'), records; function paganation(page) { var nextmaxitem = perpage * page, fromitem = (page - 1) * perpage, maxpages = math.ceil(records.length / perpage); var xmlcontent = '<div class="row">'; (var = fromitem; < nextmaxitem; i++) { if (records[i].getelementsbytagname("image")[0].childnodes.length > 0) { xmlcontent += '<article class="post ' + records[i].getelementsbytagname("category")[0].childnodes[0].nodevalue + '" id="">' + '<div class="col-sm-4 col-lg-4 col-md-4"><div class="thumbnail img-hover">' + '<a class="fancybox" rel="group" href="' + records[i].getelementsbytagname("bigimage")[0].childnodes[0].nodevalue + '" title="' + records[i].getelementsbytagname("shortdescription")[0].childnodes[0].nodevalue + '">' + '<img class="product-image" src="' + records[i].getelementsbytagname("image")[0].childnodes[0].nodevalue + '" alt="' + records[i].getelementsbytagname("title")[0].childnodes[0].nodevalue + '" />' + '<div class="caption">' + '<h4>' + records[i].getelementsbytagname("title")[0].childnodes[0].nodevalue + '</h4>' + '<p>' + records[i].getelementsbytagname("shortdescription")[0].childnodes[0].nodevalue + '</p>' + '</div>' + "</a></div></div></article>"; } else { xmlcontent += '<article class="post ' + records[i].getelementsbytagname("category")[0].childnodes[0].nodevalue + '" id="">' + '<div class="col-sm-4 col-lg-4 col-md-4"><div class="thumbnail img-hover">' + '<a class="fancybox" rel="group" href="' + records[i].getelementsbytagname("bigimage")[0].childnodes[0].nodevalue + '" title="' + records[i].getelementsbytagname("shortdescription")[0].childnodes[0].nodevalue + '">' + '<img class="product-image" src="/images/products/no-preview.jpg" alt="no preview available" />' + '<div class="caption">' + '<h4>' + records[i].getelementsbytagname("title")[0].childnodes[0].nodevalue + '</h4>' + '<p>' + records[i].getelementsbytagname("shortdescription")[0].childnodes[0].nodevalue + '</p>' + '</div>' + "</a></div></div></article>"; } } xmlcontent += "</div>"; content.innerhtml = xmlcontent; var paginationcontent = '<nav><ul class="pagination">'; if (page > 1) { paginationcontent += '<li>'; paginationcontent += '<a href="javascript:paganation(' + (page - 1) + ');" aria-label="previous"><span aria-hidden="true">«</span></a>'; paginationcontent += '</li>'; } else { paginationcontent += '<li class="disabled">'; paginationcontent += '<a href="#" aria-label="previous"><span aria-hidden="true">«</span></a>'; paginationcontent += '</li>' } var prevposition = page - 3; var nextposition = page + 3; (var = 1; <= maxpages; i++) { if (i != page) { if (i >= prevposition && <= nextposition) { var linktopage = == prevposition ? 1 : == nextposition ? maxpages : i; var linktext = == prevposition ? "..." : == nextposition ? "..." : i; paginationcontent += "<li>"; paginationcontent += '<a href="javascript:paganation(' + linktopage + ');">' + linktext + '</a>'; paginationcontent += "</li>"; } } else { paginationcontent += "<li class='active'>"; paginationcontent += '<a href="javascript:paganation(' + + ');">' + + '</a>'; paginationcontent += "</li>"; } } var next = page + 1; if (next <= maxpages) { paginationcontent += '<li>'; paginationcontent += '<a href="javascript:paganation(' + next + ');" aria-label="next"><span aria-hidden="true">»</span></a>'; paginationcontent += '</li>'; } else { paginationcontent += '<li class="disabled">'; paginationcontent += '<a href="#" aria-label="next"><span aria-hidden="true">»</span></a>'; paginationcontent += '</li>'; } paginationcontent += '</ul></nav>'; pagination.innerhtml = paginationcontent; } if (window.xmlhttprequest) {// code ie7+, firefox, chrome, opera, safari xmlhttp = new xmlhttprequest(); } else {// code ie6, ie5 xmlhttp = new activexobject("microsoft.xmlhttp"); } xmlhttp.open("get", xmlurl, false); xmlhttp.send(); xmldoc = xmlhttp.responsexml; records = xmldoc.getelementsbytagname(xmlnode); records = array.prototype.slice.call(records).sort(function () { return math.random() > 0.5 ? 1 : -1 }); paganation(1);
if imagine records
of length 18, second page, have:
fromitem - 12 nextmaxitem - 24
you iterating i
fromitem
nextmaxitem
, go past i = 18
, you've gone past end of records
. need make sure doesn't happen. need ensure don't iterate past end of array:
var max = math.min(nextmaxitem, records.length); (var = fromitem; < max; i++) { .... }
Comments
Post a Comment