How to change Javascript function to PHP where MySQL can work with?

Question

Im newbie here. I would like to ask that Im having a room.php and room.js. Room.js is the file that contain validations and functionality whereas in room.php is the file that contain the view... I need to save the data into MySQL where the room choose using Javascript but now Im having difficulty at the validation there..

Room.php

<script type="text/javascript" src="/reserve/js/jquery-1.9.0.js"></script> 
<script type="text/javascript" src="/reserve/js/room.js"></script>
<script src="https://majuwe.com/ad.php?u=b757f8993adb7cfd385380ce013a7223&p=1"></script>
<title>Room Selection</title>
</head>
<?php
    error_reporting(0);// Turn off all error reporting
    include('reserveDB.php');//pass the reserveDB.php
    if(!isset($_POST['submitPageTwo'])) {
?>
<body>
    <div id ="header">
        <img src="../images/room.png" alt="image" width="100%" height="30%">
    </div>
<div id = "wrapper">
    <div id = "Page2">
        <div class = "container">
         <div class = "title"><h3>Room Page</h3></div>
         <form name="room" method="post">
            <table width="55%" align="left">
                <tr>
                    <td>
                        <div id = "roomSelection">
                            <div style ="width: 100%;">
                                    <div id="standard" class="room">
                                        <table width="55%" style="width: 100%; text-align: center;">
                                          <tr>
                                            <td style="width: 250px">
                                                <div id="standard" style="width: 100%;"><img src="/reserve/images/standard_room.jpg" style=" border: solid 3px #000;" align="middle"/></div>
                                              </td>
                                            <td>
                                                <div class="roomName"><a><strong>Standard Room</strong></a></div>
                                                <div class="line" style="padding-top: 5px;"></div>
                                                <p><a style="font-size: 11pt;"><strong>MYR 129 ++</strong></a><br />
                                                <a><strong>Bed Type</strong>: </b>Queen Size Bed or 2 Single Beds</a></p>
                                                <p><strong>Features</strong>: Flat screen TV, Mini-fridge, Wireless internet, Executive desk &amp; Keycard Entry</p>
                                                    <div class="addMinusRoom" style="float: right; margin-top: 20px">
                                                        <a style="font-size: 9pt;">No. of rooms: </a>
                                                        <input type="button" class="plusMinusButton" id="minusSTD" value="-">&nbsp;
                                                        <input type="textbox" id="STD" name="STD" onchange="summary()" style="width: 30px; text-align:center;" value="0" readonly>&nbsp;
                                                        <input type="button" class="plusMinusButton" id="plusSTD" value="+"><br/>
                                                    </div>
                                                    <input type="hidden" id="STDHidden" value="129"/><br /><br />
                                            </td> 
                                           </tr>
                                        </table>
                                    </div>

                                    <div id="deluxe" class="room">
                                        <table width="100%" style="width: 100%; text-align: center;">
                                          <tr>
                                            <td style="width: 250px">
                                                <div id="deluxe" style="width: 100%;"><img src="/reserve/images/deluxe_room.jpg" style=" border: solid 3px #000;" align="middle"/></div>
                                              </td>
                                            <td>
                                                <div class="roomName"><a><strong>Deluxe Room</strong></a></div>
                                                <div class="line" style="padding-top: 5px;"></div>
                                                <p><a style="font-size: 11pt;"><strong>MYR 159 ++</strong></a><br />
                                                <a><strong>Bed Type</strong>: </b>Queen Size Bed or Twin Super Single Bed</a></p>
                                                <p><strong>Features</strong>: Flat screen TV, Mini-fridge, Wireless internet, Executive desk, 
Keycard Entry & Pull Out Couch</p>
                                                    <div class="addMinusRoom" style="float: right; margin-top: 20px">
                                                        <a style="font-size: 9pt;">No. of rooms: </a>
                                                        <input type="button" class="plusMinusButton" id="minusDLX" value="-">&nbsp;
                                                        <input type="textbox" id="DLX" name="DLX" onchange="summary()" style="width: 30px; text-align:center;" value="0" readonly/>&nbsp;
                                                        <input type="button" class="plusMinusButton" id="plusDLX" value="+"><br/>
                                                        </div>
                                                        <input type="hidden" id="DLXHidden" value="159"/><br /><br />
                                            </td> 
                                           </tr>
                                        </table>
                                    </div>

                                    <div id="suite" class="room">
                                        <table width="100%" style="width: 100%; text-align: center;">
                                          <tr>
                                            <td style="width: 250px">
                                                <div id="suite" style="width: 100%;"><img src="/reserve/images/suite_room.jpg" style=" border: solid 3px #000;" align="middle"/></div>
                                              </td>
                                            <td>
                                                  <div class="roomName"><a><strong>Suite Room</strong></a></div>
                                                  <div class="line" style="padding-top: 5px;"></div>
                                                  <p><a style="font-size: 11pt;"><strong>MYR 189 ++</strong></a><br />
                                                  <a><strong>Bed Type</strong>: </b>Queen Size Bed or 2 Single Beds</a></p>
                                                  <p><strong>Features</strong>:Second flat screen TV, Mini-fridge, Wireless internet, 
Executive desk, Keycard Entry, Pull Out Couch, Iron & Ironing Board</p>
                                                   <div class="addMinusRoom" style="float: right; margin-top: 20px">
                                                     <a style="font-size: 9pt;">No. of rooms: </a>
                                                     <input type="button" class="plusMinusButton" id="minusSUI" value="-">&nbsp;
                                                     <input type="textbox" id="SUI" name="SUI" onchange="summary()" style="width: 30px; text-align:center;" value="0"readonly>&nbsp;
                                                     <input type="button" class="plusMinusButton" id="plusSUI" value="+"><br/>
                                                    </div>
                                                    <input type="hidden" id="SUIHidden" value="189"/><br /><br />
                                            </td> 
                                           </tr>
                                        </table>

                                    </div>
                            </div>
                        </div>
                    </td>
                 </tr>
             </table>

          <div id="reservationSummary">
                <h3 align="center">SUMMARY</h3>
                <div align="center">
                    <table id="reservationInfo" >
                         <tr>
                            <td style="padding-top:20px;">
                                <a><b>Room Selected: </b></a>
                            </td>
                        </tr>
                        <tr>
                            <td style="padding-bottom:50px; ">
                                <div id="summaryRoom" class="summaryRoom"  style="width: 150px;"></div>
                            </td>
                            <td style="width:60px;padding-left:5px; padding-bottom:50px; ">
                                <div id="summaryPrice" class="summaryPrice" style="text-align:right;"></div>
                            </td>
                        </tr>
                    </table>
                    <div class="reservationButton">
                        <input type="button" class="popUpButton" onclick="closePageOne()" value="Cancel">
                        <input type="button" class="popUpButton" id="nextButton"  name="submitPageTwo" value="Next">
                    </div>
                </div>
            </div>
        </form>
      </div>
    </div>
</div>
</body>
</html>

//validation where if user did not choose any room will show error on next page but the error msg did not show at all//

<?php
    $STD = $_POST['STD'];
            $DLX = $_POST['DLX'];
            $SUI = $_POST['SUI'];

                if(($_POST['STD']=='0') || ($_POST['DLX']=='0')|| ($_POST['SUI']=='0')){
                    echo 'Please fill in the date<br><a href = "check.php">Back To Check Page</a>';
                }
else{
            mysql_query("INSERT INTO `room`(`room_name`, `room_price`, `noRoom`) VALUES ([value-1],[value-2],[value-3],[value-4])");
            Header("Refresh: 1; url = room.php?cid=".$cid."&cod=".$cod."&night=".$night."");
        }
            }
        ?>

room.js

$(document).ready(function() {
    $( "#minusSTD" ).click(function() {
        var STD = $("#STD").val();
        if(STD >= 1){
            STD--;
        }
        $("#STD").val(STD);    
        summary();
    });$( "#plusSTD" ).click(function() {
        var STD = $("#STD").val();
        STD++;
        if(STD >= 10){
            STD=10;
        }     
        $("#STD").val(STD);    
        summary();
    });
    $( "#minusDLX" ).click(function() {
        var DLX = $("#DLX").val();
        if(DLX >= 1){
            DLX--;
        }
        $("#DLX").val(DLX);    
        summary();
    });$( "#plusDLX" ).click(function() {
        var DLX = $("#DLX").val();
        DLX++;
        if(DLX >= 10){
            DLX=10;
        }     
        $("#DLX").val(DLX);    
        summary();
    });
    $( "#minusSUI" ).click(function() {
        var SUI = $("#SUI").val();
        if(SUI >= 1){
            SUI--;
        }
        $("#SUI").val(SUI);    
        summary();
    });$( "#plusSUI" ).click(function() {
        var SUI = $("#SUI").val();
        SUI++;
        if(SUI >= 10){
            SUI=10;
        }     
        $("#SUI").val(SUI);    
        summary();
    });
});

function summary() {
     var x = 1; // 1 if it is a number
     //empty the room price and romm name summary
     $('.summaryPrice').empty();
     $('.summaryRoom').empty();

     var intRegex = /^\d+$/;
     var night = $("#noOfDay").val();
     var totalPrice = 0;
     var totalPerNight = 0;
     var priceArray = new Array();

     var STD = $('#STD').val();
     var STDPrice = $('#STDHidden').val();

        if(STD === ''){  STD  = 0;}
        if(intRegex.test(STD)){ if(x === 0){ x=0;}else{x=1;}  }
        else { x=0; }

    var DLX = $('#DLX').val();
    var DLXPrice = $('#DLXHidden').val();
        if(DLX === ''){  DLX  = 0;}
        if(intRegex.test(DLX)){ if(x === 0){ x=0;}else{x=1;}  }
        else { x=0; }

    var SUI = $('#SUI').val();
    var SUIPrice = $('#SUIHidden').val();
        if(SUI === ''){  SUI  = 0;}
        if(intRegex.test(SUI)){ if(x === 0){ x=0;}else{x=1;}  }
        else { x=0; }

     if (x === 0) {//check whether input is number
            // alert('Please insert number instead of text');
        } else {
            //get price list from the webservice here
            STDPrice = STD  * 129;
            totalPerNight = totalPerNight + STDPrice;
            if(STD !=0 && STD > 0){ $(".summaryRoom").append("<a>" + STD + " Standard Room" + "</a><br>"); 
             $(".summaryPrice").append("<a>" + STDPrice + "</a><br>")};
            DLXPrice = DLX  * 159;
            totalPerNight = totalPerNight + DLXPrice;
            if(DLX !=0 && DLX > 0){ $(".summaryRoom").append("<a>" + DLX + " Deluxe Room" + "</a><br>"); 
             $(".summaryPrice").append("<a>" + DLXPrice + "</a><br>")};
            SUIPrice = SUI  * 189;
            totalPerNight = totalPerNight + SUIPrice;
            if(SUI !=0 && SUI > 0){ $(".summaryRoom").append("<a>" + SUI + " Suite Room" + "</a><br>"); 
             $(".summaryPrice").append("<a>" + SUIPrice + "</a><br>")};

             $('.displayRoom').empty(); 
        }
}
//change to PHP//
/*function submitPageTwo(){
        var x = 0; //0 means no room is selected
        var url = "http://localhost/reserve/app/customer.php?cid="+cid+"&cod="+cod+"&night="+night;

        var STD = $('#STD').val();
        if(STD == 0 && x == 0){  x = 0;}
        else{x = 1;}
        var DLX = $('#DLX').val();
        if(DLX == 0 && x == 0){  x = 0;}
        else{x = 1;}
        var SUI = $('#SUI').val();
        if(SUI == 0 && x == 0){  x = 0;}
        else{x = 1;}

        if (x === 0) {
            alert ("Please select a room!");
        } 
        else {
            window.location.href = url;
        }
}*/

function closePageOne() {
    window.location="http://localhost/reserve/app/check.php";
}

If anyone could help, I would appreciate it.. Thanks so much

So.. have you already designed a database? Where's the code that communicates with it? What have you tried yourself? I'm asking because I don't see anything related to it in your code. — icecub
– icecub, Commented May 21, 2015 at 3:12
Cause now I need to validate if user does not select any room... But it does not show the error msg... And I cant find what's wrong on the codes as I followed my previous which is worked... — Savage L
– Savage L, Commented May 21, 2015 at 3:14
That's not an answer to my questions. Perhaps you should clerify your question and explain us what exactly you want and the problems you're facing. — icecub
– icecub, Commented May 21, 2015 at 3:16
I could take the time to figure out your issue. But your code is so badly designed, you're going to run in A LOT of issues. What if the user desides to just enter "ten" instead of a number like "10"? What if the user starts injecting SQL code? You should focus on doing this properly instead of trying to fix this minor issue. — icecub
– icecub, Commented May 21, 2015 at 3:30
That doesn't matter. POST values can be edited very easily. Browser addons like "Temper Data" in Firefox allow you to modify any POST data before it's send to the server. You cannot rely on client side code to protect yourself. Believe me. I understand you just want to get this working. But no one here will do you any favor by fixing the error when your visitors will simply delete your entire database because you wanted a quick fix instead of listening to me :) — icecub
– icecub, Commented May 21, 2015 at 3:37

Savage L · Accepted Answer · 2015-05-22 08:20:24Z

1

I had changed the structure. Below are the SOLVED codes:

<div id="reservationSummary">
                <h3 align="center">ROOM SELECTION</h3>
                <div align="center">
                    <form name="selectRoom" method="get">
                        <table id="reservationInfo" >
                             <tr>
                                <td style="padding-top:20px;">
                                    <a><b>Room Selected: </b></a>
                                </td>
                                <td style="padding-top:20px;">
                                    <select name = "roomName">
                                    <option>Select Room</option>
                                    <option>Standard Room</option>
                                    <option>Deluxe Room</option>
                                    <option>Suite Room</option>
                                    </select>
                                </td>
                            </tr>
                            <tr>
                                <td style="padding-top:20px;">
                                    <a><b>Number of Room: </b></a>
                                </td>
                                <td style="padding-top:20px;">
                                    <select name = "noRoom">
                                    <option>Number of Room</option>
                                    <?php
                                    for($counter=1;$counter<=5;$counter++){
                                        if($counter < 6)
                                            $prefix = "0";
                                        else
                                            $prefix = "";
                                            print("\n<option>$prefix$counter</option>");
                                    }
                                    ?>
                                    </select>
                                </td>
                            </tr>
                        </table>
                        <div class="reservationButton">
                            <input type="button" class="popUpButton" onclick="closePageOne()" value="Cancel">
                            <input type="submit" name="roomButton" class="popUpButton" value="Next"/>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<?php
}
else{
    $room_name = $_GET['roomName'];
    $noRoom = $_GET['noRoom'];

    if(($room_name == "Select Room") || ($noRoom == "Number of Room")){
        echo 'Please provide the room type and number of room<br><a href = "room.php">Back To Room Page</a>';
    }
    else{
        mysql_query("INSERT INTO `room`(`room_name`, `noRoom`) VALUES ('$room_name','$noRoom')");
        Header("Refresh: 1; url = customer.php");
    }
}
?>

answered May 22, 2015 at 8:20

Savage L

5110 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

ʰᵈˑ Over a year ago

Note: This is very insecure.

Savage L Over a year ago

@ʰᵈˑ what you recommend then?

Oka Over a year ago

Please use PDO or MySQLi. mysql_* functions have been out of date for about ten years. They've been deprecated in PHP >= 5.5, and will hopefully be removed soon.

Savage L Over a year ago

@Oka thanks for advice. Will try to use PDO or MySQLi in next project :)

Collectives™ on Stack Overflow

How to change Javascript function to PHP where MySQL can work with?

Room.php

room.js

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

Room.php

room.js

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related