0

我有 1 个 html 文件被调用page2.html,我正在使用 twitter 引导工具包。我正在开发一个开发考试自动座位安排的项目,我正在尝试开发一个界面,允许管理员“选择”学生可以坐的位置。

我正在使用 JavaScript 更改占用座位的颜色。现在的问题是,如何将 Occupied Seat 的值发送到 Servlet?由于我在这里只更改颜色,因此它不是典型的输入值。正如代码所解释的,我只使用<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';
                }
            }
        }
4

0 回答 0