I am creating a simple application where I am going to have a lot of different dropdown type boxes. I really like the dojox/form/CheckedMultiSelect. However, I am having an issue when trying to load the contents of it from a .js file. I've attached my test file and the js file. It seems to be working okay in IE but is not working in Safari or Chrome. I have no idea why? As you can see from my code the dojox/form/CheckedMultiSelect seems to work in Safari and Chrome. It only seems to be an issue when I am trying to populate it via the .js code.
Any help would be very much appreciated as this is very frustrating and I have been working on this for a few days now.
Thanks,
Michael
Thats a really interesting problem, the problem is chrome is not able to find the element by the ID, you might be better off putting the Real_Estate_Filters2.js file contents into the javascript secton of your code (tried this, and it worked), and then have a JSON file that you load all the options from.
Thanks for the quick response but that could make the code extremely long. For instance we have over 60 Districts. I would rather not have all of those listed in the html file if I can help it..
I wasnt saying to put all the districts in the HTML file, Those would go in a JSON file seperate from the HTML file. That way you still have the seperation of your files.
But there is probably a better way.
I attached a copy that hammered out, needs to be ran though IIS or apache because of chromes orgin rules. Not very efficent code because it does the request syncronously, but I just wanted to show what I was meaning.
Lucas:
Thanks so much for helping and taking the time out of your schedule to try and help me. I download your zip file and tried it but it still does not work. I put the files in the same folder and tried to run them. The only place in your code where you reference the json file is below. Should I have put it someplace else.
xhr("Region_Filters.json", {
handleAs: "Json",
sync: "true"
}).then(lang.hitch(document, function(data){
Region_List = JSON.parse(data);
console.log(Region_List);
var sel = document.getElementById("Region_filter");
for (var i=0;i<Region_List.length;i++) {
sel.options=new Option(Region_List.text,Region_List.val);
}
}));
Hmm thats odd, it was working when I sent it, did you use IIS or apache to host it on localhost or a test website? accessing a local file system is not possible due to same orgin policies on modern browsers
We have IIS but I tested it using our webserver name. If I can't use it from their it won't do me any good. It is an intranet site.
ahh Ive had trouble with some configurations and JSON, some servers have JSON turned off for some reason, sorry it could have been more help, I wish you good luck
You don't need to store all of them in the HTML file. Do some research on using modules in Dojo (here is a starting tutorial) where you can store the District information.
Take a look back at an old discussion of yours that uses bookmarks stored in a module. You can use the District information in a data store to populate the CheckedMultiSelection form, like in this example.
Thanks for the responses. When I turned parseOnLoad: from true to false I could see my values now.
<script type='text/javascript' src='http://archive.dojotoolkit.org/nightly/dojotoolkit/dojo/dojo.js' data-dojo-config="has:{'dojo-firebug':true}, parseOnLoad:false, async:true"></script>
However, the boxes don't look normal I have no idea what the parse does but feel it is very important. Not sure the order of how to load things but it seems like I should do this after putting these values into the CheckedMultiSelect. However, I thought that was one of the first things I was doing using this line of code.
<script type="text/javascript" src="jsfiles/Real_Estate_Filters2.js"></script>