java - ユーザー入力を HTML ファイルから Java サーブレットに渡すにはどうすればよいですか?

Question

私は 1 つの html ファイルを呼び出しpage2.htmlており、Twitter ブートストラップ ツールキットを使用しています。私は試験用の自動座席配置を開発するプロジェクトに取り組んでおり、管理者が学生が座ることができる場所を「選択」できるインターフェイスを開発しようとしています。

JavaScript を使用して、使用中の座席の色を変更しています。問題は、Occupied Seat の値をサーブレットに送信するにはどうすればよいかということです。ここでは色を変更しているだけなので、典型的な入力値ではありません。コードが説明しているように<div>、クリック時に「座席」を描画するためにタグのみを使用しているため、「占有」されます。

サンプル画像: サンプル画像を投稿したいのですが、評判が 10 にならないといけません。

コードは次のとおりです。

<div class="alert alert-success hide" id="alert1">
                        <h4>Select the seating arrangement for <i>Floor 1</i>.</h4>
                    </div>
                    <form class="hide" id="seat-select1" method="get" action="Seat1">
                        <div class="btn" style="position:absolute; top:300px; left:210px" onclick="col(0,1)" >Toggle</div>
                            <span style="position:absolute; top:340px; left:190px; ">
                                <span style="position:relative; top:0px; left:0px;">
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="100" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="101" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="102" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="103" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="104" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="105" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                </span>
                            </span>
                        <div class="btn" style="position:absolute; top:300px; left:314px" onclick="col (1,1)" >Toggle</div>
                            <span style="position:absolute; top:340px; left:294px;">
                                <span style="position:relative; top:0px; left:0px;">
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="110" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="111" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="112" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="113" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="114" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="115" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                </span>
                            </span>
                        <div class="btn" style="position:absolute; top:300px; left:510px" onclick="col (2,1)" >Toggle</div>
                            <span style="position:absolute; top:340px; left:490px;">
                                <span style="position:relative; top:0px; left:0px;">
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="120" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="121" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="122" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="123" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="124" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="125" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                </span>
                            </span>
                        <div class="btn" style="position:absolute; top:300px; left:614px" onclick="col (3,1)" >Toggle</div>
                            <span style="position:absolute; top:340px; left:594px;">
                                <span style="position:relative; top:0px; left:0px;">
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="130" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="131" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="132" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="133" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="134" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="135" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                </span>
                            </span>
                        <div class="btn" style="position:absolute; top:300px; left:718px" onclick="col (4,1)" >Toggle</div>
                            <span style="position:absolute; top:340px; left:698px;">
                                <span style="position:relative; top:0px; left:0px;">
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="140" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="141" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="142" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="143" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="144" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="145" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                </span>
                            </span>

                        <div class="btn" style="position:absolute; top:300px; left:918px" onclick="col (5,1)" >Toggle</div>
                            <span style="position:absolute; top:340px; left:898px;">
                                <span style="position:relative; top:0px; left:0px;">
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="150" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="151" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="152" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="153" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="154" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="155" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                </span>
                            </span>

                        <div class="btn" style="position:absolute; top:300px; left:1022px" onclick="col (6,1)" >Toggle</div>
                            <span style="position:absolute; top:340px; left:1002px;">
                                <span style="position:relative; top:0px; left:0px;">
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="160" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="161" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="162" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="163" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="164" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                    <div style="width:100px;height:40px;border:1px solid #000; background-color:#FFF8DC;" id="165" onclick="this.style.backgroundColor='#90EE90'">..</div>
                                </span>
                            </span>
                        <input type="sumbit" class="btn btn-success" value="Submit" style="position:absolute; top:600px; left:566px" onclick="processseat1()" />    
                        <input type="button" class="btn btn-danger" value="Reset" style="position:absolute; top:600px; left:666px" onclick="Reset(1)" />
                    </form> 




//JavaScript Code for the Seat Selection.
var seat= false;
        function col(col_num,floor) {
            var q=10;
            floor=floor*100;
            col_num=(col_num*q)+floor;
            if(!seat) {
                for(var row=0; row<6; row++) {
                    var cr=col_num+row;
                    document.getElementById(cr).style.backgroundColor='#90EE90';
                    seat= true;
                }
            }
            else {
                for(var row=0; row<6; row++) {
                    var cr=col_num+row;
                    document.getElementById(cr).style.backgroundColor='#FFF8DC';
                    seat= false;
                }
            }
        }
        function Reset (floor) {
            var q=10;
            floor=floor*100;
            for(var col_num=0;col_num<7;col_num++){
                col_n=(col_num*q)+floor;
                for(var row=0; row<6; row++) {
                    var cr=col_n+row;
                    document.getElementById(cr).style.backgroundColor='#FFF8DC';
                }
            }
        }