Question

我正在尝试向服务器发送数据，选择TAG中列出的数字是服务器上已有的事件ID，有人可以告诉我如何解决这个问题吗？

2）服务器端将返回以下三种类型之一的JSON响应：

{＆＃34; status＆＃34;：＆＃34; ok＆＃34;} //满足请求时

{＆＃34; status＆＃34;：＆＃34; partial＆＃34;，＆＃34; reserved＆＃34;：n} //部分满足请求时，其中n是保留票证的数量。

{＆＃34; status＆＃34;：＆＃34;失败＆＃34;} //当没有可用的tikets时。

如何显示屏幕上预订的门票数量？

<h1>Current Events Tickets:</h1>

<p>FHSU marching band concert <b>Ticket ID:6761</b></p>
<p>Great Bend Film Festival <b>Ticket ID:454</b></p>
<p>HPPR fundraising <b>Ticket ID:778</b></p>
<p>Monarch Butterflies watching Chayenne Bottoms<b>Ticket ID:234</b></p>

<form id="register"  action=" http://guimon.info/js/tickets.php" method="post">



<h2>Register Your Tickets</h2>

<label for="name"> Username </label> <input type="text" id="name" name="name"/>
<label for="email"> Email </label> <input type="email" id="email" name="email"/>
<label for="event_id">
<select>
  <option value="6761">FHSU marching band concert</option>
  <option value="454">Great Bend Film Festival</option>
  <option value="778">HPPR fundraising Ticket ID</option>
  <option value="234">Monarch Butterflies watching Chayenne Bottoms</option>
</select>
  </label> 
<label for="number_of_tickets"> No of Ticekts </label> <input type="text" id="number_of_tickets" name="number_of_tickets"/>

<input type="submit" value="Join"/>
</form>

<Script>
$('#register').on('submit',function(e){
    e.preventDefault();
    var details=$('#register').serialize();
    $.post(' http://guimon.info/js/tickets.php',details,function(data)
    {
        $('#register').html(data);
    });
});


</Script>

Answer 1

将您的选择更改为<select id="event">

$(function(){

   $('#register').on('submit',function(e){
     e.preventDefault();
     var details=$('#register').serialize();
     console.log(details)
     $.post('phpResponse.php', details, function(data)
     {
        console.log(data);
        var event = $('option:selected').text();
        var ticket = $('#event').val();
        $('#results').html("<p>"+event+" <b>TicketID: "+ticket+"</p>");

     });
   });
});

在表单末尾插入div标签以显示结果：

<div id="results"></div>

PHP测试代码：

<?php
header('Content-type: application/json');

    $data = array('status' => 'ok', 'reserved' => 4);
    echo json_encode($data);

?>

HTML code：

<html>
<head>
<script src="scripts/jquery-2.1.4.min.js"></script>
<script src="scripts/reservation.js"></script>
</head>
<body>
<h1>Current Events Tickets:</h1>
<div id="results">
</div>

<form id="register"  action="#" method="post">

<h2>Register Your Tickets</h2>

<label for="name"> Username </label> <input type="text" id="name" name="name"/>
<label for="email"> Email </label> <input type="email" id="email" name="email"/>
<label for="event_id">
<select id="event">
  <option value="6761">FHSU marching band concert</option>
  <option value="454">Great Bend Film Festival</option>
  <option value="778">HPPR fundraising Ticket ID</option>
  <option value="234">Monarch Butterflies watching Chayenne Bottoms</option>
</select>
  </label> 
<label for="number_of_tickets"> No of Ticekts </label> <input type="text" id="number_of_tickets" name="number_of_tickets"/>

<input type="submit" value="Join"/>
</form>
</body>
</html>

将所选数据发送到服务器

1 个答案: