Question

我有以下代码： -JavaScript帮助我选择了一个文本文件，并且仅从文本文件中选择了ID。文本文件的示例如下：

ID,Name,Surname
re-002,ram,kelu
rf-897,rem,juke

当我添加按钮“ loader”时，javascript readText不再显示它从文本文件中获取的ID。

我想做的是允许用户选择一个文本文件，仅读取ID，然后将ID放入我的数据库中。

我的html页面：

<!DOCTYPE html>
<html>
<head>
<title>reading file</title>
<script type="text/javascript">

var reader = new FileReader();
function readText(that){

    if(that.files && that.files[0]){
        var reader = new FileReader();
        reader.onload = function (e) {  
            var output=e.target.result;
            //process text to show only lines with "-":     
            output = output.split("\n").filter((line, i) => i != 0).map(line => line.split(",")[0]).join("<br/>\n");
            document.getElementById('main').innerHTML= output;
        };//end onload()
        reader.readAsText(that.files[0]);   
    }

    } 

$("#loader").on("click", function(){
    var upload = $.ajax({
                        type: "POST",
                        url: "loader.php",
                        data: {array:output},
                        cache: false,
                        beforeSend: function() {
                        }
    });

</script>
</head>
<body>
<h1> Utilisateur Nomm&#233; </h1>
<h3> Import : <button id="loader" onclick='btn()'> Import</button>
<h3> Choose file : <input type="file" onchange='readText(this)' />

</h3>
</body>
</html>

我的php页面'loader.php'：

<?php
  define ( 'DB_HOST', 'localhost' );
  define ( 'DB_USER', 'root' );
  define ( 'DB_PASSWORD', '' );
  define ( 'DB_NAME', 'dbapp' );

 $array = json_decode($_POST['output']);

 $mysqli = new mysqli('DB_HOST','DB_USER','DB_PASSWORD','DB_NAME');

$arr_id =   $mysqli->real_escape_string($array[0]);

if ($mysqli->connect_error) {
die('Error : ('. $mysqli->connect_errno .') '. $mysqli->connect_error);
}

//MySqli Insert Query
$insert_row = $mysqli->query("INSERT INTO `user` (id) VALUES($arr_id)");

if($insert_row){
print 'Success! ID of last inserted record is : ' .$mysqli->insert_id .'<br 
/>'; 
}else{
die('Error : ('. $mysqli->errno .') '. $mysqli->error);
}
// close connection 
$mysqli->close();
?>

Answer 1

您的代码很脆弱。但是将output声明移到readText之外可能实际上有助于发送一些数据

var output; // move the output declaration here

var reader = new FileReader();

function readText(that) {

    if (that.files && that.files[0]) {
        var reader = new FileReader();
        reader.onload = function (e) {
            output = e.target.result;
            //process text to show only lines with "-":     
            output = output.split("\n").filter((line, i) => i != 0).map(line => line.split(",")[0]).join("<br/>\n");
            document.getElementById('main').innerHTML = output;
        }; //end onload()
        reader.readAsText(that.files[0]);
    }

}

function btn() {
    var upload = new XMLHttpRequest();
    upload.open("POST", "loader.php");
    upload.send(JSON.stringify({ array: output }))
    upload.onreadystatechange = function () {
        if (upload.readyState === XMLHttpRequest.DONE) {
            if (upload.status === 200) {
                alert(upload.responseText);
            } else {
                alert('There was a problem with the request.');
            }
        }
    }
}

<main id="main"></main>
<h1> Utilisateur Nomm&#233; </h1>
<h3> Import : <button id="loader" onclick="btn()"> Import</button>
<h3> Choose file : <input type="file" onchange='readText(this)' />

奖金：在没有jQuery的情况下完成。

https://developer.mozilla.org/en-US/docs/Web/Guide/AJAX/Getting_Started

通过单击按钮php将javascript数组插入数据库

1 个答案: