Using Javascript In Dynamically Embeded HTML? -
how use, or correctly use, javascript in dynamically embedded pages/content?
when event occurrs loading php/html page html element. javascript works fine on outter page, or page content gets loaded into, not work on page being loaded.
here request function:
function sendservicerequest(file, nvpsenddata, successcallback, failcallback) { $.ajax({ type: "post", url: file, data: nvpsenddata, datatype: 'html' }).success(function(data, status) { console.log(".done"); console.log("return ajax status: " + status); //console.log("success data: " + json.stringify(data)); successcallback(data, status); }).fail(function(data, status, error) { console.log(".fail"); console.log("return ajax status: " + status); //console.log("return data: " + json.stringify(data)); failcallback(data, status, error); }); }
then have php page, viewscripts.php, has javascript file included, handles loading process
view_events.js
document.addeventlistener('domcontentloaded', function() { var rx = document.queryselector("#rx-number").value; sendservicerequest( "/comments/get_content.php", {action:"loadcontent", loadtype:"comments", rx_number:rx}, function(data, status) { document.queryselector("#rx-comments-container").innerhtml = data; }, function(data, status, error) { console.log("ajax send service request failed while loading comments!"); } ); });
then in code above, /comments/get_content.php verifies data being sent, , loads page comment.php div element, #rx-comments-container. until point fine. it's javascript in comment.php not want work. have tried including '.js' file specified functions handle events comment.php, not work. have tried including event functions in view_events.js, listed above, included in viewscripts.php, , not want work either. have tried embedding javascript directly comments.php, doesn't work either.
here javascript included in comments.php:
document.addeventlistener('domcontentloaded', function() { document.getelementsbyclassname("edit-rx-comment-glyph").addeventlistener("click", function () { var id = this.value; sendservicerequest( "/comments/get_content.php", {action: "loadcontent", loadtype: "editcomment", comment_id: id}, function (data, status) { document.queryselector('#' + id).innerhtml = data; }, function (data, status, error) { console.log("ajax send service request failed while loading edit form!"); } ); }); document.getelementsbyclassname("comment-history-glyph").addeventlistener("click", function () { var id = this.value; sendservicerequest( "/comments/get_content.php", {action: "loadcontent", loadtype: "viewhistory", comment_id: id}, function (data, status) { document.queryselector('#comments-body').innerhtml = data; }, function (data, status, error) { console.log("ajax send service request failed while loading edit form!"); } ); }); });
i managed figure out. guess doing wrong, because code ended working. used onclick event sendservicerequest function, , ended working. didn't need include other js files.
Comments
Post a Comment