-1

I wrote this code to check if a file exists and if it does, do one thing and if it doesn't, do another by creating a variable.

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script> $(document).ready(function(){
$("#myInput").keyup(function(event){
        var keycode = (event.keyCode ? event.keyCode : event.which);
        if(keycode == '13'){
        
                var exists = false;
                var filename = "folder/document.html";

                $.get(filename, function() { //This code only runs if a certain file exists
                    exists = true;
                    alert('should be displayed first');
                });

                if(exists == true) {
                    alert('This file exists!');
                } else {
                    alert('This file does not exist!');
                } 
        }
    });
});
</script>
</head>
<body>
<span id="myInput" role="textbox" contenteditable></span>
</body>

The problem with it is that for some reason, $.get runs after everything else, no matter what I do. Why is this happening and how do I solve it. I'm fine with a totally new method of checking if a file exists, but this is the best I could find. The $.get releases a 404 error if it does not find a file, meaning that the code inside of it only runs if it finds a file, which is why I had it set a variable inside of there and had the if statement be reliant on the variable.

PS: the code only works if it is uploaded to the internet, not as a file on a computer, which is really annoying.

Julia Weber
  • 9
  • 2
  • `.get()` is asynchronous. It's an AJAX function. Move your `if(exists == true)` block inside your get – j08691 Nov 12 '21 at 19:55
  • move the alerts into the `get()` callback. – MaartenDev Nov 12 '21 at 19:59
  • "the code only works if it is uploaded to the internet, not as a file on a computer, which is really annoying" It would be even more annoying if any website you browsed could access your local filesystem.... – Daniel Beck Nov 12 '21 at 20:03
  • Does this answer your question? [How to return the response from an asynchronous call](https://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-asynchronous-call) – Daniel Beck Nov 12 '21 at 20:04
  • Just to clear up, I can't move the alert or the if statement into the get() because the code inside of it only runs when it finds a file, meaning that if I do that, how do I run the code that I need when it doesn't find a file without running it when I do? I can't use continue because the get() runs after the rest of everything. – Julia Weber Nov 12 '21 at 20:04
  • That's not what's happening. The `get()` is running first, but it's asynchronous, so the response doesn't come back until later; meanwhile the rest of your keydown function runs. Code that needs to wait for the response from the `get` needs to be in a callback function -- you probably want both `.done()` and a `.fail()` callbacks, for when the file does and does not exist. – Daniel Beck Nov 12 '21 at 20:06
  • Is there a way to make the get() synchronous, I don't mind the wait because I'm planning on loading the file if it is found anyway. – Julia Weber Nov 12 '21 at 20:08
  • [There is](https://stackoverflow.com/questions/133310/how-can-i-get-jquery-to-perform-a-synchronous-rather-than-asynchronous-ajax-re), but it's deprecated, was a terrible idea and should never be used (it blocks _all_ activity until the call returns.). If you're going to do web coding you need to get familiar with asynch code, it's just the nature of the beast – Daniel Beck Nov 12 '21 at 20:10

1 Answers1

0

Update: I just figured it out and it works now. Thank you so much. Here is the code I'm using now from another question which didn't work when I tried it earlier, but it is all good now:

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script> $(document).ready(function(){
$("#myInput").keyup(function(event){
        var keycode = (event.keyCode ? event.keyCode : event.which);
        if(keycode == '13'){
                var exists = false;
                var filename = "folder/document.html";
                $.get(filename)
                .done(function() {
                alert('File exists!');
                }).fail(function() { 
                  alert('File does not exist')
                });         
        }
    });
});
</script>
</head>
<body>
<span id="myInput" role="textbox" contenteditable></span>
</body>
Julia Weber
  • 9
  • 2