最初に言っておきますが、私は特定の種類のコードの専門家ではありませんが、物事をつなぎ合わせて機能させることは得意です。私の最新号は、私のノウハウには少し技術的すぎるかもしれません。これが私が達成しようとしていることです:
ユーザーから一意の識別子を取得するフォームを含む HTML ページを使用しています。次に、PHP (データベース情報を取得するため) と JSON (その情報を HTML で使用する形式に解析するため) です。最後に、jquery プラグイン「Populate」を使用して、この情報を HTML ページの目的のフォーム フィールド (一意の識別子を取得するフォームとは別のフォーム) に送信します。
2 つのフォームを含む HTML ページがあります。最初の形式:
<form name="form_reservation" id="form-reservation">
<div style="padding:10px 20px 10px 10px;">
<label for="reservation-id">Reservation ID</label>
<input name="reservationid" class="reservationid" style="width:120px !important"/>
<div class="json-sample" id="json-simple-sample"> </div>
<input type="submit" class="button" value="Search Reservation" style="width:150px !important; margin:10px 0px 0px 5px;"/>
<input type="button" class="button" value="Clear" style="width:150px !important; margin:10px 0px 0px 5px;" onclick="resetForms('reservation')" />
</div>
</form>
この送信を取得する Javascript は次のようになります。
<script type="text/javascript">
$(document).ready(function(){
resetForms('reservation');
$('#form-reservation').submit(function(event){
event.preventDefault(); //the page will no longer refresh on form submit.
var resCheck = $(this).find('input[class="reservationid"]').val(); //now we have the reservation ID, let's perform our check.
$.ajax({
url: 'inc/searchres.php',
type: 'POST', //default is GET, you are using POST(*SEE: [1])
data: 'resid='+resCheck,
success: function(data){ //data is all the info being returned from the php file
var jsonData = $.parseJSON(data); //parse returned JSON data so we can use it like data.name, data.whatever
$('#json-reservation').populate({personal_first_name:jsonData['element_1_1'],personal_last_name:jsonData['element_1_2'],personal_phone_1:jsonData['element_7'],personal_email:jsonData['element_2'],reservation_status:jsonData['ADD THIS CELL'],reservation_date:jsonData['element_3'],reservation_time:jsonData['element_4'],reservation_party:jsonData['element_5'],reservation_special_request:jsonData['element_6'],reservation_using_coupon:jsonData['element_9'],reservation_coupon_code:jsonData['element_10']});
}
});
});
});
</script>
前のフォームの目的は、ユーザーに一意の識別子を求めることです。ユーザーが「Search Reservation」をクリックすると、この一意の識別子を使用してデータベースが検索され、データベースが存在するかどうかが確認されます...ページがリロードされたり、リンクが変更されたりしないようにする方法がわかりませんでした):
<?php
include('connect-searchres.php');
$term = $_POST['resid'];
$sql = mysql_query("SELECT * FROM ap_form_8 WHERE element_1_1 = '$term'"); //select first name (element_1_1) from form #8
if ($row = mysql_fetch_array($sql)){ //if reservation number exists
if ($row['element_10'] != 'Cancelled'){ //if reservation has not already been cancelled
if (strtotime($row['element_3']) >= strtotime(date("Y-m-d"))){ //if reservation has not already passed date
echo json_encode($row);
}
else //Reservation already passed (old reservation)
{
echo 'passed';
}
}
else //Reservation already cancelled
{
echo 'cancelled';
}
}
else //Reservation not found
{
echo 'not found';
}
mysql_close();
?>
ここまでで、ユーザーは一意の番号を入力し、php ファイルはデータベースでその番号を検索しました。また、SQL クエリを JSON 形式に変換しました。次に、受信したデータを HTML ページから別のフォームに入力する必要があります。もう 1 つの形式は次のようになります (これは大きなもので申し訳ありません)。
<form name="json_reservation" id="json-reservation" action="results.php" method="post" target="_blank" style="margin-top:15px">
<fieldset>
<legend>Personal Information</legend>
<ul class="controls">
<li>
<label for="first-name">First Name</label>
<input name="personal_first_name" id="personal-first-name" type="text" class="text" maxlength="" value="" disabled readonly/>
</li>
<li>
<label for="last-name">Last Name</label>
<input name="personal_last_name" id="personal-last-name" type="text" class="text" maxlength="" value="" disabled readonly/>
</li>
<li>
<label for="personal[country]">Phone</label>
<input name="personal_phone_1" id="personal-phone-1" type="text" class="text" style="width:110px !important" maxlength="" disabled readonly/>
</li>
<li>
<label for="email">Email</label>
<input name="personal_email" id="personal-email" type="text" class="text" maxlength="" value="" disabled readonly/>
</li>
</ul>
</fieldset>
<fieldset>
<legend>Reservation Information</legend>
<ul class="controls">
<li>
<label for="status">Reservation Status</label>
<input name="reservation_status" id="reservation-status" type="text" class="text" style="width:110px !important" maxlength="" value="" disabled readonly/>
</li>
<li>
<label for="date">Date</label>
<input name="reservation_date" id="reservation-date" type="text" class="text" style="width:110px !important" maxlength="" value="" disabled readonly/>
</li>
<li>
<label for="time">Time</label>
<input name="reservation_time" id="reservation-time" type="text" class="text" style="width:110px !important" maxlength="" value="" disabled readonly/>
</li>
<li>
<label for="party">Number in Party</label>
<input name="reservation_party" id="reservation-party" type="text" class="text" style="width:110px !important" maxlength="" value="" disabled readonly/>
</li>
<li>
<label for="specialrequest">Requests</label>
<textarea name="reservation_special_request" id="reservation-special-request" rows="3" wrap="virtual" class="specialrequest" style="width:60% !important" disabled readonly/></textarea>
</li>
<li>
<label for="coupon">Using Coupon/Promotion</label>
<input name="reservation_using_coupon" id="reservation-using-coupon" type="text" class="text" style="width:110px !important" value="" disabled readonly/> # <input name="reservation_coupon_code" id="reservation-coupon-code" type="text" class="text" style="width:110px !important" maxlength="" value="" disabled readonly/>
</li>
</ul>
</fieldset>
</form>
とにかく、これが私がいる場所であり、この時点で、コードだけでなく方法にも多くの問題があることを知っています。そのため、この時点で高低を検索したので、ヒントをいただければ幸いです。
言及すべきもう 1 つのポイントは、1 つの HTML ページで、これらのフォームの両方が再読み込みせずにうまくやり取りできるようにしたかったということです。外部リンクは次の場所にあります: http://goo.gl/IFVv4 外部リンクのフォームの「パート 3」については気にしないでください。
更新: 上記のコードを編集して、現在の場所を示しました。あなたの助けは素晴らしく、私はかなり遠くまで行きましたが、今私の問題はphpファイルにあると思います...