read text file from ajax and send stringback to html file

Question

i am new to ajax, i have a text file with number values

like ids.txt, here 12345 mapping value is 54321

12345,54321
23456,65432
34567,76543
45678,87654
56789,98765

this is my Html file

<html><body>
    <INPUT TYPE="TEXT" NAME="text" SIZE="25" >
    <button type="button" onclick="getId()">Submit</button>
    <div id="myDiv"><h2></h2></div>
</body></html>

If i enter the value 12345 in the above textbox i should get its mapping value 54321 from ids.txt file and it should be displayed in div tag "myDiv"

Can anyone please help?

Where are you stuck? Are you able to get the AJAX content and you're stuck parsing it? Are you stuck getting the AJAX content? — Benjamin Gruenbaum
– Benjamin Gruenbaum, Commented Oct 20, 2013 at 6:45

idmean · Accepted Answer · 2013-10-20 07:18:50Z

1

I would consider you use JSON. Convert you ids.txt into a ids.json with this content:

{
 12345:54321
 23456:65432
 34567:76543
 45678:87654
 56789:98765
}

Then you can parse the data of the ajax call with JSON.parse() and you have an object.

An jQuery example using $.get:

$.get("ids.json",function(data){
   //jQuery probably has already parsed the json

   //get the text out of the textfield
   var text = $('input[name="text"]').val();

   //display the number in #myDiv
   $("#myDiv").text(data[text]);
});

answered Oct 20, 2013 at 7:18

idmean

15k9 gold badges63 silver badges90 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Alex Art. · Accepted Answer · 2013-10-20 06:54:09Z

1

I think the best way for this would be parsing your file into Dictionary(C#) or HashMap(Java) so that the first number will be the key and the second will be the value. You should probably cache this dictionary so you don't have to create it for every ajax call (Because IO action is very expensive!). Than in ajax request pass your number as a parameter. In your Back-End simply get the value from the dictionary with the key that you just receive as an ajax parameter and send it back to client(Make sure to perform required validations!). In your ajax success handler simply update your div content with the result.

answered Oct 20, 2013 at 6:54

Alex Art.

8,7813 gold badges32 silver badges50 bronze badges

Comments

Rashedul.Rubel · Accepted Answer · 2013-10-20 07:56:08Z

At first retrieve the text from the file line by line as below:

var file = "ids.txt";
function getFile(){
    $.get(file,function(txt){
        var lines = txt.responseText.split("\n");
        // all the text will be stored into the lines as array
        // lines[0] will contain 12345,54321
       var arr;var indexA;
       for (var i = 0, len = lines.length; i < len; i++) {
            arr.push(lines[i].split(","))
        }
        for(var j=0;leng=arr.length;j<length;j+=2){
          indexA[arr[j]]=arr[j+1];// index array will store value as key:12345,value=54321
    }

    }); 
}

then text field value can be compared with the indexA array and if the index matches with the typed value then that indexed value can by shown to $("#myDiv").text(indexA[indexValue]);

Regards, Rubel

Collectives™ on Stack Overflow

read text file from ajax and send stringback to html file

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related