I have a large multi-select menu (450 items, result of poor categorisation). AJAX seems like a great way to pass those back to server and save folks the effort of inputting their choices again upon page re-load.
My problem is passing all of those back to Flask - right now I only get the first third or so.
My AJAX:
var occList = document.getElementById('occClass');
occArray = [];
for (var i = 0; i < occList.options.length; i++) {
if (occList.options[i].selected) {
console.log(occList.options[i].value)
occArray.push(occList.options[i].value);
}
}
console.log(occArray.length)
So I can see each item being added to the list fine, and the length of the list is fine too at 450.
But in my Flask application, when I call
request.form.getlist('occArray')
I can see it's only around the first third or so. Splitting it into a Python list reveals it to only have 150 or so elements - in the order that they exist in the menu, and in the order that the console logs them (and so appends them - presumably).
I've read around and I can't see what limit I'm bumping up against - is there one?
EDIT - COMPLETE AJAX CALL
As requested - this is the complete AJAX call (at least I think this is what is meant). Other elements have been omitted (e.g. the date picker). The return is response.graph.
<script>
function loadXMLDoc()
{
var req = new XMLHttpRequest()
req.onreadystatechange = function()
{
if (req.readyState == 4)
{
if (req.status != 200)
{
//error handling code here
}
else
{
var response = JSON.parse(req.responseText)
$("#content").html(response.graph);
}
}
}
req.open('POST', '/safety1Ajax')
req.setRequestHeader("Content-type", "application/x-www-form-urlencoded")
var occList = document.getElementById('occClass');
occArray = [];
for (var i = 0; i < occList.options.length; i++) {
if (occList.options[i].selected) {
console.log(occList.options[i].value)
occArray.push(occList.options[i].value);
}
}
console.log(occArray.length)
var postVars = occArray='+occArray
req.send(postVars)
return false
}
</script>