Form progression when using same form on multiple pages (javascript)

Question

I have a very specific issue I need to address.

I'm using a marketing automation platform which will pre-populate the values of fields where the database has a value stored on page load.

The objective is to ask the user a series of questions on the page - BUT only those questions where the database is missing a value.

However, I don't want to bombard the user with more than 5 questions at a time.

Doing this, the next time this same user goes to the page (content on page is displayed according to query string value), it should ask the NEXT 5 questions (or less) in line where the values are missing.

This way, I can use the same form on multiple pages whilst keeping the flow of questions intact and also not having to worry about who is where in the progression.

So, an example would be:

Total questions - 10

John Doe goes to page the first time and only sees
q1, q3, q4, q5, q6
because we have value for q2 in the database and we're restricting the display to 5 fields at a time.

The next time JD goes to the same page - q7, q8, q9 and q10 are displayed (or lesser fields incase we have values in the db)

I will have fields which are always constant so we won't have a scenario where potentially NO fields are displayed.

Does that make sense?

Here is what I have come up with so far in terms of functions.

What I need help with is the logic of how to make this work.

<script language="JavaScript">

var fieldName;

function getQueryVariable(variable)
{
   var query = window.location.search.substring(1);
   var vars = query.split("&");
   for (var i=0;i<vars.length;i++) {
           var pair = vars[i].split("=");
           if(pair[0] == variable){return pair[1];}
   }
   return(false);
}

Requests = {
    QueryString : function(item){
    var svalue = location.search.match(new RegExp(“[\?\&]” + item + “=([^\&]*)(\&?)”,”i”));
    return svalue ? svalue[1] : svalue;
    }
}


function showField(fieldName) {
        document.getElementById(fieldName).style.display = "block";
    }

function hideField(fieldName) {
        document.getElementById(fieldName).style.display = "none";
    }

function showHideField(fieldName) {
        if (document.getElementById(fieldName).style.display == "block")
    {
        document.getElementById(fieldName).style.display == "none";
    };

        if (document.getElementById(fieldName).style.display == "none")
    {
        document.getElementById(fieldName).style.display == "block";
    };
    }

    function isBlank(fieldName) {
    if (fieldName.value=="null" || fieldName.value=="") { return true; }
    else { return false; }  
    }

</script>