JS for setting cookies on Form Submit works in Firefox but not Edge/Chrome

Question

I have a bootstrap modal that pops up when a page loads asking a user to set their location and saves this value to a cookie.

This all works fine in Firefox however doesn't work in Edge or Chrome. Anyone have any ideas?

<script>
function setCookie(cookieName, cookieValue, nDays) {
    
    var today = new Date();
    var expire = new Date();

    if (!nDays) 
        nDays=1;
    expire.setTime(today.getTime() + 3600000*24*nDays);
    document.cookie = cookieName+"="+escape(cookieValue) + ";expires="+expire.toGMTString();
    return false
}
</script>

<div class="modal_container">
     
        <!-- Modal -->
        <div class="modal fade" id="store_prompt" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered" role="document">
              <div class="modal-content">
                <div class="modal-header">
                  <h5 class="modal-title" id="exampleModalLongTitle">Location Number</h5>
                </div>
                <div class="modal-body">
                    <form onsubmit="javascript:return setCookie('location', this.querySelector('select').value, 365);">
                        <div class="form-group">
                            <label for="LocationSelect">Please select your location below.</label>
                            <select class="form-control" id="LocationSelect">
                              <option value='1' >1 - Location A</option>
                              <option value='2' >2 - Location B</option>
                            </select>
                        </div>
                        <button type="submit" class="btn btn-primary btn-lg btn-block" onclick="closemodal(); location.reload();">Save changes</button>
                    </form> 
                </div>
              </div>
            </div>
</div>

Does this answer your question? [Why would setting document.cookie not work in Chrome?](https://stackoverflow.com/questions/26349052/why-would-setting-document-cookie-not-work-in-chrome) — BadPiggie, Jan 25 '21 at 11:42

score 1 · Accepted Answer · answered Jan 26 '21 at 06:10

1

Do you test the code through file protocol like file:///C:/...? If so, I can reproduce the situation you encountered.

Your code is right. But cookies are not set when browsing using the file:/// protocol, depending on the browser. You need to run your page on a http/https server then the code can work on all browsers.

Result:

answered Jan 26 '21 at 06:10

Yu Zhou

11,532
1
8
22

this was exactly the situation! the page is under the local PC and not hosted. Thanks! – acarhart Jan 26 '21 at 17:02

score 0 · Answer 2 · answered Jan 25 '21 at 11:40

0

I think this might be because of the issues mentioned in this question. Please go through these. It might solve your issue. Why would setting document.cookie not work in Chrome?

answered Jan 25 '21 at 11:40

Shubham Patel

133
2
7

JS for setting cookies on Form Submit works in Firefox but not Edge/Chrome

2 Answers2