javascript - Undefined error for file upload if js is included in home page -


i'm using blueimp jquery fileupload in webpage. i'm including css , js files in home page's head tag. i've left menu contains many menus. on clicking menu1 send ajax request , response set in div menucontent.

<head> <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <link rel="stylesheet" href="file_upload_style.css"> <link rel="stylesheet" href="jquery_file_upload.css"> <script src="jquery_ui_widget.js"></script> <script src="jquery_iframe_transport.js"></script> <script src="jquery_file_upload.js"></script> </head> <div id="menucontent" class="menucontent"></div> 

the response contains upload button corresponding jquery fileupload code.

<span class="btn btn-success fileinput-button w3-margin-bottom  ">     <i class="glyphicon glyphicon-plus"></i>     <span>upload</span>     <input id="uploadxlsxfile" type="file" name="files"> </span> <script type="text/javascript"> $(function () {     'use strict';        $('#uploadxlsxfile').fileupload({         add: function(e, data) {             var uploaderrors = [];             if (!(/\.(xlsx)$/i).test(data.originalfiles[0].name)) {                 return false;             }             data.submit();         },         url: "uploadhandler.php",          datatype: 'json',         acceptfiletypes : /(\.|\/)(xlsx)$/i,         done: function (e, data) {          }     }).prop('disabled', !$.support.fileinput)         .parent().addclass($.support.fileinput ? undefined : 'disabled');    });  </script> 

when click on menu1 response set div i'm getting error like

uncaught typeerror: $(...).fileupload not function

how can access js added in homepage in ajax response too? can me fix this?

thanks in advance.

append script header like:

var s = document.createelement("script"); s.type = "text/javascript"; s.src = "http://somedomain.com/somescript"; $("head").append(s); 

or can use jquery's getscript()

$.getscript( "ajax/test.js", function( data, textstatus, jqxhr ) {   console.log( data ); // data returned   console.log( textstatus ); // success   console.log( jqxhr.status ); // 200   console.log( "load performed." ); }); 

Comments

Popular posts from this blog

Is there a better way to structure post methods in Class Based Views -

performance - Why is XCHG reg, reg a 3 micro-op instruction on modern Intel architectures? -

jquery - Responsive Navbar with Sub Navbar -