I want to get the filename and pass it to the servlet class.

On the screen, click a line to the table, press the File Name Acquisition button with the yellow line, and pass the file name in the yellow line to the servlet class in Java.You can click a row to the table and turn it into a yellow row, but I don't know how to write the code that gets the filename and passes it to the Java servlet class.How should I write it?

<!DOCTYPE html>
<html lang="ja">
<head>
<metacharset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

<title>File Download</title>

<link href="bootstrap/css/bootstrap.min.css"rel="stylesheet">

<script
    src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<script src="bootstrap/js/bootstrap.min.js">/script>
<script>
    function sentaku(pos){
        switch(pos){
        case1:
            document.getElementById("tr1").style.backgroundColor="yellow";
            document.getElementById("tr2").style.backgroundColor="white";
            break;
        case2:
            document.getElementById("tr2").style.backgroundColor="yellow";
            document.getElementById("tr1").style.backgroundColor="white";
            break;
        }
    }

</script>
</head>
<body>

    <h1>File Download Screen</h1>
    <div class="container">
        <form name="download" action="/downloadfile" method="post">

            <table id="name_tbl" border="1" width="500" cellspacing="0"
                cellpadding="5" bordercolor="#333333">
                <tr>
                    <thbgcolor="#EE0000">font color="#FFFFFF">No</font>>
                    <thbgcolor="#EE0000" width="150"><font color="#FFFFFF">filename</font>>
                    <thbgcolor="#EE0000" width="200"><font color="#FFFFFF">Notes</font>>
                </tr>
                <trid="tr1" onclick="sentaku(1)">
                    <td align="right" nowrap>1</td>
                    <td value="top" width="150">aaa.text</td>
                    <td value="top" width="200">-</td>
                </tr>
                <trid="tr2" onclick="sentaku(2)">
                    <td align="right" nowrap>2</td>
                    <td value="top" width="150">bbb.text</td>
                    <td value="top" width="200">-</td>
                </tr>
            </table>
            <div style="padding-top:10px">
                <button class="btn btn-primary"
                    type = "submit" > File name acquisition button </button>
            </div>
        </form>
    </div>
</body>

java jquery bootstrap jsp

2022-09-30 19:09

1 Answers

I wrote it roughly, but how do you feel like this?
Save the currentPos line number when you click the row in the table.Obtain the filename from the information when you press the Get File Name button.Next, I submit the form by setting the file name to the action attribute of the form.

Servlet can receive a request with the URL download and a filename from the parameter fileName.

<!DOCTYPE html>
<html lang="ja">
<head>
<metacharset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

<title>File Download</title>

<link href="bootstrap/css/bootstrap.min.css"rel="stylesheet">

<script
    src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<script src="bootstrap/js/bootstrap.min.js">/script>
<script>
    varcurrentPos=-1;
    function sentaku(pos){
        currentPos = pos;
        switch(pos){
        case1:
            document.getElementById("tr1").style.backgroundColor="yellow";
            document.getElementById("tr2").style.backgroundColor="white";
            break;
        case2:
            document.getElementById("tr2").style.backgroundColor="yellow";
            document.getElementById("tr1").style.backgroundColor="white";
            break;
        }
    }
</script>
</head>
<body>

    <h1>File Download Screen</h1>
    <div class="container">
        <form name="download" action="/downloadfile" method="post">

            <table id="name_tbl" border="1" width="500" cellspacing="0"
                cellpadding="5" bordercolor="#333333">
                <tr>
                    <thbgcolor="#EE0000">font color="#FFFFFF">No</font>>
                    <thbgcolor="#EE0000" width="150"><font color="#FFFFFF">filename</font>>
                    <thbgcolor="#EE0000" width="200"><font color="#FFFFFF">Notes</font>>
                </tr>
                <trid="tr1" onclick="sentaku(1)">
                    <td align="right" nowrap>1</td>
                    <td value="top" width="150">aaa.text</td>
                    <td value="top" width="200">-</td>
                </tr>
                <trid="tr2" onclick="sentaku(2)">
                    <td align="right" nowrap>2</td>
                    <td value="top" width="150">bbb.text</td>
                    <td value="top" width="200">-</td>
                </tr>
            </table>
            <div style="padding-top:10px">
                <button id="getFileName" class="btn btn-primary"
                    type = "button" > File name acquisition button </button>
            </div>
        </form>
    </div>
    <script>
    document.getElementById("getFileName").addEventListener("click", function(){
        // Get Filename
        varfileName= document.querySelector("#tr" + currentPos+"td:nth-child(2)").textContent;
        // Set to action of form and submit
        var form = document.getElementsByTagName("form")[0];
        form.action="downonloadFile?fileName="+fileName;
        form.submit();
    }, false);
    </script>
</body>

2022-09-30 19:09

If you have any answers or tips

Popular Tags

python x 4647

android x 1593

java x 1494

javascript x 1427

c x 927

c++ x 878

ruby-on-rails x 696

php x 692

python3 x 685

html x 656