i want use ajax read text file , convert array fill in select box. problem cannot figure out why ajax code not work. every time test out code in chrome, error jquery:
xmlhttprequest cannot load file:///c:/filepath.../attributecategories.txt. cross origin requests supported protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
here's html page:
<html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('#btn').click(function(){ $.ajax({ type: "get", url: "attributecategories.txt", datatype: "text", success: function (data) { processdata(data); } }); }); function processdata(data){ var attrcsv = data.split("\n"); //----------------------------------split csv rows var ctgylist = attrcsv[0].split(","); //----------------------------split first row categories for(var = ctgylist.length + 1; > 0; i--){//---------------------trim empty items off array if(isnan(ctgylist[i]) == true){ctgylist.splice(i,1);} } $('#sel')[0].options.length = 0;//----------------------------------clear select options for(var = 0; < ctgylist.length; i++){//-------------------------build select array $('#sel').append($('<option>',{value:i + 1,text:ctgylist[i]})); } } }); </script> </head> <body> <div> <table> <tr><td><button id="btn">click me!</button></td></tr> <tr><td><select id="sel"></select></td></tr> </table> </div> </body>
all of files (html , text file) in same folder. or clarification helpful, thanks.
the problem explained in error message. security reasons, browser not allow request asynchronously url different domain page running ("cross-origin request"). more information see https://en.wikipedia.org/wiki/same-origin_policy , https://developer.chrome.com/extensions/xhr.
Comments
Post a Comment