project1/csv_to_json.html at master · preshin/project1 · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <style type="text/css">
        body
        {
            font-family: Arial;
            font-size: 10pt;
        }
        table
        {
            border: 1px solid #ccc;
            border-collapse: collapse;
        }
        table th
        {
            background-color: #F7F7F7;
            color: #333;
            font-weight: bold;
        }
        table th, table td
        {
            padding: 5px;
            border-color: black;
        }
        table, td, th {
    border: 1px solid black;
}

    </style>
</head>
<body>
    <script type="text/javascript" src="/home/mobme/my_project/bower_components/jquery/dist/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            var arr=[];
            var m=0;
            var n=0;
            var k=0;
            $("#upload").bind("click", function () {
                var regex = /^([a-zA-Z0-9\s_\\.\-:])+(.csv|.txt)$/;
                if (regex.test($("#fileUpload").val().toLowerCase())) {
                    if (typeof (FileReader) != "undefined") {
                        var reader = new FileReader();
                        reader.onload = function (e) {
                            var table = $("<table />");
                            var rows = e.target.result.split("\n");
                            for (var i = 0; i < rows.length-1; i++) {
                                arr.push([]);
                                var row = $("<tr />");
                                var cells = rows[i].split(",");
                                for (var j = 0; j < cells.length; j++) {
                                    var cell = $("<td />");
                                    cell.html(cells[j]);
                                    arr[m].push(cells[j]);
                                    row.append(cell);
                                }
                             table.append(row);
                             m++;
                            }
                            $("#dvCSV").html('');
                            $("#dvCSV").append(table);
                        }
                        reader.readAsText($("#fileUpload")[0].files[0]);
                    } else {
                        alert("This browser does not support HTML5.");
                    }
                } else {
                    alert("Please upload a valid CSV file.");
                }
            });
            $("#json").bind("click", function () {
                var c=arr[0].length;
               /* document.write("[<br><br>");
                for(var i=1;i<arr.length;i++){
                   document.write("{");
                    for(var j=0;j<c;j++){
                        document.write(" "+arr[0][j]+" : "+arr[i][j]+"<br>");
                    }
                    document.write("} <br><br>");
                }
                document.write("]");    */
                $("<label/>",{text:"["}).appendTo($(".next"));
                for(var i=1;i<arr.length;i++){
                  // document.write("{");
                  $("<p/>",{text:"{"}).appendTo($(".next"));
                    for(var j=0;j<c;j++){
                        //document.write(" "+arr[0][j]+" : "+arr[i][j]+"<br>");
                        $("<p/>",{text:" "+arr[0][j]+" : "+arr[i][j]+" "}).appendTo($(".next"));
                    }
                    //document.write("} <br><br>");
                    $("<label/>",{text:"}"}).appendTo($(".next"));
                    //$("<p/>").appendTo($(".next"));
                }
               // document.write("]");
               $("<p/>",{text:"]"}).appendTo($(".next"));
            });
        });
    </script>
    <input type="file" id="fileUpload" />
    <input type="button" id="upload" value="Upload" />
    <hr />
    <div id="dvCSV">
        </div>
        <input type="button" id="json" value="json" />
    <hr />
        <div class="next">
        </div>
</body>
</html>