Check a user input value against values in array

Question

I have text file. there around 1000 lines in it, each line contains a 8 letter alpha numeric word for example my text file looks like this

TEST1234
T1E2A334
12RR8912

and so on. this file is located on the server in a folder called TestCodes

Now I have an html file called test.html where in this file I have input textbox where the user enters the testcode he/she has with them

I have button called Verify. when this input button is clicked I want to check the user inputed value against the contents in the text file.

If the testcode exists in the text file then display a button called Procced if not display an error message called invalid.

I know how to write the if condition but I have no idea how to check it against the text file

HTML

<div class="user-input">
    <input type="text" name="test-code" id="test-code" value="" />
    <input type="submit" value="Verify Code" name="verify-code" id="verify-code" />
</div>
<div id="TestRegister">
    <form id="club" action="/Proceed.html" method="post" autocomplete="off">
        <input type="submit" value="Proceed Registration" name="proceed-register" />
    </form>
</div>
<div id="TestError">
    <span>Please check the code again, its not valid</span>
</div>

JavaScript

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script type="text/javascript">
$(document).ready(function () {
    $("#TestRegister").hide();
    $("#TestError").hide();

    $.get("testcodes.txt", function (data) {
        var lines = data.split("\n");

        // this is where I am stuck. how to pass the above to ARRAY
        $("#verify-code").click(function (e) {
            e.preventDefault();
            if ( /* here I need to check against the user input value, if they are equal */ ) {
                $("#TestRegister").show();
                $("TestError").hide();
            } else {
                $("#TestRegister").hide();
                $("TestError").show();
            }
        }
        });     


</script>

How can I pass text from testcodes to an Array and then check the user input value against this array? If the user input value is present in the array then I want to show #TestRegister , and if not, or if the input value is blank or null, show #TestError .

Thanks and appreciate any tips.

Answer 1

var lines;

$(document).ready(function () {
    $("#TestRegister").hide();
    $("#TestError").hide();

    $.get("testcodes.txt", function (data) {
        lines = data.split("\n");
    });

    $("#verify-code").click(function (e) {
        e.preventDefault();

        if (lines.indexOf($("#test-code").val()) !== -1 && $("#test-code").val().length == 8) {
            $("#TestRegister").show();
            $("TestError").hide();
        } else {
            $("#TestRegister").hide();
            $("TestError").show();
        }

    });

});

Answer 2

You can avoid an array loop altogether by creating a regular expression that ensures the test code is found between word boundaries:

var codeRegEx = new RegExp('\\b'+$('#test-code').val()+'\\b');
if(codeRegEx.test(lines)) {
   // the testcode is found on a single line, avoiding partial matches
}

Here's a demo:

jsFiddle DEMO