如何使用jQuery

时间:2017-05-31 18:27:11

标签: php jquery json ajax twitter-bootstrap

我正在使用jQuery的jjax方法成功地将数据发送到PHP文件。 现在,我的问题是我想填充一个模态表单,用于根据我发送到PHP页面的事件ID编辑现有的数据库记录。

我用来调用PHP页面的片段是:

$.ajax({
                    url: 'dbget.php',
                    data: 'eventid='+event.id,
                    type: 'POST',
                    dataType: 'json',
                    cache: false,
                    success: function(json_resp){   




                        //populate_data('#update_event', json_resp);
                        $('#updateModal').modal('show');
                    },
                    error: function(e){
                        alert('Error processing your request: '+e.responseText);
                    }
                });

正如您所看到的,我似乎无法在ajax方法的成功部分的表单中填充数据。

以下是从PHP文件返回的数据:

[{"u_id":"21","u_eventName":"Ready Ply","u_eventDate":"2017-05-11","u_customerName":"Fassoooggg","u_customerMobile":"9383838383","u_customerEmail":"ffgg@gmaks.com","u_totalAmount":"1000","u_advanceAmount":"500","u_balanceAmount":"500"}]

这是PHP文件片段处理数据库请求并发送json编码数据:

//Get the evenId from the POST request
$eventId = $_POST['eventid'];

$events = array();

$getQuery = mysqli_query($con, "SELECT eventmaster.id, eventmaster.eventName, eventmaster.startDate, eventmaster.customerName, "
."eventmaster.customerMobile, eventmaster.customerEmail, eventdetail.totalAmount, eventdetail.advanceAmount, "
."eventdetail.balanceAmount FROM eventMaster INNER JOIN eventdetail ON eventmaster.id = eventdetail.eventId " 
."WHERE eventmaster.id= '$eventId'");

while($fetch = mysqli_fetch_array($getQuery, MYSQLI_ASSOC))
{
    $e = array();

    $e['u_id'] = $fetch['id'];
    $e['u_eventName'] = $fetch['eventName'];
    $eventDate =  substr($fetch['startDate'],0,10); //extract the eventDate in yyyy-mm-dd format from the table date
    $e['u_eventDate'] = $eventDate;
    $e['u_customerName'] = $fetch['customerName'];
    $e['u_customerMobile'] = $fetch['customerMobile'];
    $e['u_customerEmail'] = $fetch['customerEmail'];
    $e['u_totalAmount'] = $fetch['totalAmount'];
    $e['u_advanceAmount'] = $fetch['advanceAmount'];
    $e['u_balanceAmount'] = $fetch['balanceAmount'];


    array_push($events, $e);
}

//printf("Data sent to client: " );

echo json_encode($events); //return data in JSON array

请注意,json数据中的键与表单字段的名称相匹配。这是表单摘要。这是我试图填充的形式:

<!-- Update Event Modal Starts -->
<div id="updateModal" class="modal fade">
 <div class="modal-dialog">
  <div class="modal-content">

   <div class="modal-header"><!-- Modal Header -->
    <button type="button" class="close" data-dismiss="modal">&times;</button>
    <h4 class="modal-title">Update Event</h4>
   </div>

   <div class="modal-body"><!-- Modal Body -->

        <p class="statusMsg"></p>

        <form method="post" id="update_event">

            <div class="form-group">
                <input type="text" name="u_id" id="u_id" class="form-control"   />
            </div>
            <div class="form-group">
                <label for="u_eventName">Event Name</label>
                <input type="text" name="u_eventName" id="u_eventName" class="form-control"  placeholder="Event Name"/>
            </div>

                <label for="u_startDate">Event Date</label>
            <div class='input-group date' id='datetimepicker1'>
                <input type='text' class="form-control" name="u_startDate" id="u_startDate" readonly />
                <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
                </span>
            </div>
            <br />
            <div class="form-group">
                <label for="u_customerName">Customer Name</label>
                <input type="text" name="u_customerName" id="u_customerName" class="form-control"  placeholder="Customer Name"/>
            </div>

            <div class="form-group">
                <label for="u_customerMobile">Customer Mobile</label>
                <input type="text" name="u_customerMobile" id="u_customerMobile" class="form-control"  />
            </div>

            <div class="form-group">
                <label for="u_customerEmail">Customer Email</label>
                <input type="text" name="u_customerEmail" id="u_customerEmail" class="form-control"  placeholder="customer@email.com"/>
            </div>

            <div class="form-group">
                <label for="u_totalAmount">Total Amount</label>
                <input type="text" name="u_totalAmount" id="u_totalAmount" class="form-control"  placeholder="0"/>
            </div>

            <div class="form-group">
                <label for="u_advanceAmount">Advance Amount</label>
                <input type="text" name="u_advanceAmount" id="u_advanceAmount" class="form-control"  placeholder="0"/>
            </div>

            <div class="form-group">
                <label for="u_balanceAmount">Balance Amount</label>
                <input type="text" name="u_balanceAmount" id="u_balanceAmount" class="form-control"  placeholder="0"/>
            </div>

            <div class="form-group">
                <input type="submit" name="updateBtn" id="updateBtn" value="Update" class="btn btn-success" />
            </div>

        </form>
   </div>

   <div class="modal-footer"><!--Modal Footer -->
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
   </div>
  </div>
 </div>
</div>
<!-- Update Event Modal Ends -->

因此,在您查看上面的代码片段之后,请再次帮助我填充表单,其中包含从PHP文件发送的JSON对象,该文件包含要在表单中填充的数据库中的一行记录。

我错过了什么或什么?另外,如果我尝试在html页面中打印JSON对象,我只会打印一个OBJECT而不是数据。

我在这里发布的样本是我从PHP回应的内容。

任何人的帮助都将受到高度赞赏。感谢。

0 个答案:

没有答案