Click here to Skip to main content
15,557,873 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I am trying to achieve when user enter the id in textbox and click on submit button, to return specific status of track based on that id in txt file. So for example user enter in textbox id -> 1 and press submit button, then we read the txt file, and return back status value of that id in alert popup. What I did so far, I am getting all values from txt file by pressing the button. But how to loop through all input in txt file, and take specific value based on input from textbox?

What I have tried:

Here is my structure of traces.txt file

id,status
1,aktivan
2,neaktivan
3,aktivan
4,neaktivan


Here is my html part of code:
HTML
<form action="#" class="search-box">
<div class="input-form">
<input type="text" placeholder="Your Tracking ID" name="trackingId">
</div>
<input class="btn btn-primary" type="submit" value="Submit" id="trackButton">
</form>


And here is javascript part of code:

JavaScript
document.getElementById('trackButton').addEventListener('click',loadTxt);

//Load txt

function loadTxt()
{
    fetch('traces.txt')
    .then(function(response)
    {
        
        return response.text();
    })
    .then(function(data)
    {
        var jobValue = document.getElementsByName('trackingId')[0].value;
        console.log(data);
        alert(data);
      
    })
}
Posted
Updated 8-Oct-22 4:57am
Comments
Richard MacCutchan 8-Oct-22 12:17pm    
Since you know all the valid status codes it would be simpler to put them in a drop down so the user can only select valid numbers. Using a textbox just to get a number is much more likely to lead to errors.
Jakobson 2022 8-Oct-22 12:20pm    
What kind of errors you mean ? I will handle also validation of user input this is only prototype. But maybe your way is better idk
Richard MacCutchan 8-Oct-22 12:33pm    
Any input errors can occur if you leave the user to enter as text. It just seems that unless you have hundreds or thousands of values, it would be much simpler to use a dropdown list.
Jakobson 2022 8-Oct-22 12:46pm    
agree, thanks, need to check if your approach fits our needs :D

1 solution

You need to do some things before:

1. You will get an string as a respnse, so you have to split that text by lines.

2. Now you have an array of string lines. But your .txt file has headers/data format. You should remove headers from the current array (first element).

3. At this point, it would be interesting if you split every line by commas.

4. Well, your data is almost valid to work with it, but you need to save it in a Map:
Map is similar to an array, but it storages data in pairs of keys/values (id/status). Therefore, when you need to find some value, you have to do it by its key.

Now, you have your data stored in a map, so every time the user clicks in the submit button, it will look at this object and return the value assigned to the id submited.
 
Share this answer
 
Comments
Jakobson 2022 8-Oct-22 10:02am    
I decided to instead of using .txt file use json file, and I catch everything what I needed. Thank you anyway for your response, generally I knew these things what you explained, but did not know how to implement because I am not very familiar with javascript..

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900