2013-03-24 4 views
0

기본적으로 확인란을 사용하여 좌석 배치 계획을 표시하는 페이지가 있습니다. 이 확인란을 선택하면 예약중인 좌석을 나타낼 수 있습니다. 또한 예약을 위해 이름을 입력하는 텍스트 입력이 있으며이 양식은 다음 페이지에 게시되어 선택란을 선택하고 데이터베이스에 저장합니다. 난 내 현재 코드 유효성 검사를 통합 할 수있는 방법php, jquery, sql. 양식 유효성 검사

 title>School Hall</title> 

<script> 


     function confirmReservation() { 

     var selectedList = getSelectedList('Confirm Reservation'); 

     if (selectedList) { 
      if (confirm('Do you want to CONFIRM this Reservation : ' + selectedList + '?')) { 
       document.forms[0].statusA.value=0; 
       document.forms[0].statusB.value=1; 
       document.forms[0].previousPage.value='schoolHall'; 
       document.forms[0].action='bookingQueries.php';  
       document.forms[0].submit(); 
      } else { 
       clearSelection(); 
      } 
     } 
    } 



     function cancelReservation() { 

     var selectedList = getSelectedList('cancel Reservation'); 

     if (selectedList) { 
      if (confirm('Do you want to CANCEL this Reservation : ' + selectedList + '?')) { 
       document.forms[0].statusA.value=1; 
       document.forms[0].statusB.value=0; 
       document.forms[0].previousPage.value='schoolHall'; 
       document.forms[0].action='bookingQueries.php'; 
       document.forms[0].submit(); 
      } else { 
       clearSelection(); 
      } 
     } 
    } 




    function getSelectedList(actionSelected) { 

     // get selected list 
     var obj = document.forms[0].elements; 
     var selectedList = ''; 
     for (var i = 0; i < obj.length; i++) { 
      if (obj[i].checked && obj[i].name == 'seats[]') { 
       selectedList += obj[i].value + ', '; 
      } 
     } 

     // no selection error 
     if (selectedList == '') { 
      alert('Please select a seat '); 
      return false; 
     } else { 
      return selectedList; 
     } 

    } 




    function validateForm() 
    { 
    var x=document.forms["0"]["fname"].value; 
    if (x==null || x=="") 
     { 
     alert("First name must be filled out"); 
     return false; 
     } 
    } 


</script> 



</head> 
<body topmargin="0" leftmargin="0" rightmargin="0" > 
<table> 
<tr><td width="100%" align="left" id='table-2'> 
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post"> 
<input type="hidden" name="previousPage" value=""/> 
<input type="hidden" name="statusA" value=""/> 
<input type="hidden" name="statusB" value=""/> 
</tr> 
<table> 
<tr><td width="100%" align=left" id='table-2'> 
<INPUT Type="BUTTON" VALUE="Home Page" ONCLICK="window.location.href='/final/homePage.php'" align='lef'> 
<INPUT Type="BUTTON" VALUE="Bookings" ONCLICK="window.location.href='/final/schoolHallBookings.php'"> 


<?php 


// Connection 
$con = mysql_connect("localhost","root",""); 
if(!con) 
{ 
die('Could not connect:' . mysql_error()); 
} 

mysql_select_db("systemDatabase",$con); // Connection to DB 

echo '<br>'; 

echo '<font face="Trebuchet MS" color="Black" size="9" >School Hall </font>'; 


$query = "SELECT * from schoolHall order by rowId, columnId"; // Create Select Query 
$result = mysql_query($query); // Retrieve all data from query and hold in $result 
$prevRowId = null; 
$seatColor = null; 
$tableRow = false; 


echo "<table align='center' id='table-2'"; // Create table 
while (list($rowId, $columnId, $status, $updatedby, $firstName, $lastName) = mysql_fetch_row($result)) //  Itterates through fetched data 
{ 
if ($prevRowId != $rowId) 
{ 
    if ($rowId != 'A') 
    { 
     echo "</tr></table></td>"; 
     echo "\n</tr>"; 
    } 
    $prevRowId = $rowId; 
    echo "\n<tr><td align='center'><table class='center' border='1' cellpadding='15' cellspacing='8'  align='center' id='table-2' ><tr>"; 
} 
else 
{ 
    $tableRow = false; 
} 
if ($status == 0) 
{ 
    $seatColor = "lightgreen"; // Available 
} 
else 
{ 
    $seatColor = "red"; // Booked 
} 

echo "\n<td bgcolor='$seatColor' align='center'>"; 
echo "$rowId$columnId"; 
if ($status == 0 || ($status == 1)) { 
    echo "<input type='checkbox' name='seats[]' value='$rowId$columnId' align='center'></checkbox>"; // Create Checkboxes giving value RowId, ColumnId 
} 


    } 

echo "</tr></table></td>"; 
    echo "</tr>"; 
echo "</table>"; 

// Con close 
mysql_close(); 
?> 



    <table width='100%' border='0'> 
<tr><td align='right'> 
    &nbsp; 
&nbsp; First Name: <input type="text" name="fname"> 
&nbsp; Last Name: <input type="text" name="lname"> 
</td> 
<td><td align='left'> 


</td> 
<td><td align ='right'> 

    &nbsp;<input type='button' value='Confirm Reservation' onclick='confirmReservation()'/> 
</td></tr> 
<tr> 
<td><td align='left'> 



</td> 
<td><td align='left'> 


</td> 
<td align='right'> 
    &nbsp;<input type='button' value=' Cancel Reservation' onclick='cancelReservation()'> 
    </td> 
</table> 
</td></tr> 
<tr><td width="100%" align="center"> 


</td></tr> 
    <tr><td>&nbsp;</td></tr> 
    <tr><td width="100%" align="center"> 
<table border="1" cellspacing="6" cellpadding="4" align="center"> 
    <tr> 
     <td bgcolor='lightgreen'>Available</td> 
     <td bgcolor='red'>Unavailable</td> 
    </tr> 
</table> 
</td></tr> 
<tr><td>&nbsp;</td></tr> 
<tr><td width="100%" align="center"> 
</td></tr> 
</table> 

</body> 

있나요 :이 코드의 일부인가? 이름을 실제로 입력했는지 확인하기 위해 이름 텍스트를 확인해야합니다. 다음 페이지에 액세스하기 전에이 작업이 필요합니다. 어떤 아이디어?

+0

, 당신의 HTML을 게시하시기 바랍니다 명명 된 텍스트를 표시하기 위해 왜 getSelectedList를 사용하지 않고 변수를 가져 오며 마지막 쉼표를 제거하지 마십시오. –

+0

죄송합니다. selectedList에 대한 그게 뭐죠? HTML 코드 –

+0

functionSelectedList (actionSelected), actionSelected를 사용하고 루프를 마친 후 selectedList가 '1,3,6'이 될 것입니다. 마지막 쉼표를 사용 하시겠습니까 –

답변

0

먼저 텍스트 입력에 ID를 추가하십시오 :

<table width='100%' border='0'> 
    <tr> 
    <td align='right'> 
     &nbsp; 
     &nbsp; First Name: <input type="text" id="fname" name="fname"/> 
     &nbsp; Last Name: <input type="text" id="lname" name="lname"/> 
    </td> 
    <td> 
    <td align='left'> 

function getSelectedList(actionSelected) { 
    // get selected list 
    var obj = document.forms[0].elements; 
    var selectedList = ''; 
    for (var i = 0; i < obj.length; i++) { 
     if (obj[i].checked && obj[i].name == 'seats[]') { 
      selectedList += obj[i].value + ', '; 
     } 
    } 
    var fname = document.getElementById('fname'); 
    var lname = document.getElementById('lname'); 
    // no selection error 
    if (selectedList == '') { 
     alert('Please select a seat '); 
     return false; 
    } else if (actionSelected.beginsWith('Confirm') && (fname .value.replace(/^\s+|\s+$/g, '').length == 0 || /[0-9]/.test(fname))) { 
     alert('Please Enter valid first name.'); 
     return false; 
    } else if (actionSelected.beginsWith('Confirm') && (lname.value.replace(/^\s+|\s+$/g, '').length == 0 || /[0-9]/.test(lname))) { 
     alert('Please Enter valid last name.'); 
     return false; 
    } else { 
     return selectedList; 
    } 
}  
+0

천재! 그게 완벽하게 작동합니다. 어떻게이 숫자를 가져 가지 않을까요? –

+0

이것은 실제로 내 다른 기능과 충돌합니다. 예약 취소()는 이름을 필요로하지 않습니다. 그 일을 어떻게 할 수 있습니까? –

0

작업을 예를

http://jsfiddle.net/

예는 함수 checkInput에 값을 전달할 수 있으며, 그것은 유효한 입력 여부를 결정하는 방법을 보여줍니다 아래 - 함수가 jQuery를 사용하지만 당신이 할 수있는 그것도 jQuery와 함께.

데모 HTML :

<form> 
    <input id="first-name" value="some value" /> 
    <input id="last-name" value="" /> 
</form> 

JS 기능 (HTML 데모와 함께 간다) :

function checkInput(fieldID){ 
    var isValid = true; 

    if($("#" + fieldID).val() == ''){ 
     isValid = false; 
    } 

    return isValid; 

} 


$(document).ready(function(){ 
    if(!checkInput("first-name")){ 
     alert("error found with first name"); 
    } 
    if(!checkInput("last-name")){ 
     alert("error found with last name"); 
    } 
}); 
관련 문제