检查选择了哪个选项

时间:2020-07-15 14:26:40

标签: javascript php jquery ajax

单击按钮时,我正在使用AJAX来显示一个PHP模态,其中包含一个表单。这是一种编辑表单,因此字段中会填充从AJAX接收的数据,这些数据是通过处理程序调用PHP函数的。但是,我需要一种select输入的方法来知道选择了哪个,但是要用于该数据的是JavaScript。通常我会使用诸如

$occasionTypes = getPublishedOccasionTypes($connection);
if($occasionTypes != NULL){
    foreach ($occasionTypes as $occasionType) {
        $selected = (isset($booking['reservation_type']) && ($booking['reservation_type'] == $occasionType['id'])) ? 'selected' : NULL;
        $occasionSelect .= '<option value='.$occasionType['id'].' '.$selected.'>'.$occasionType['name'].'</option>';
    }
}

但是在这种情况下,$booking['reservation_type]是没有用的,因为我需要的实际值在输入(我创建的隐藏值)中,但是由JavaScript填充。有任何想法吗?这也是我的JavaScript

$.ajax({
    type: 'POST',
    url: "/modules/ajax/ajax_handler.php",
    data: data
})
.done((result)=>{
    result = JSON.parse(result);
    console.log(result);
    
    $('#firstName').val(result.customer_first_name);
    $('#lastName').val(result.customer_last_name);
    $('#email').val(result.customer_email);
    $('#number').val(result.customer_mobile);
    $('#date').val(result.reservation_date);
    $('#time').val(result.reservation_time);
    $('#size').val(result.party_size);
    $('#occasion').val(result.occasion_type);
    $('#comment').val(result.special_requirements);
    $('#code').val(pcode);
    $('#customerCode').val(result.customer_code);
    
    $('#editModal').modal('show');
    
})

MODAL

$modalpopup =
'
<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Edit Booking</h4>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            </div>

            <form id="editBooking" class="form form-horizontal" method="post" enctype="multipart/form-data">
                <div class="modal-body">

                    <div class="form-group">
                        <label>First Name</label>
                        <input type="text" class="form-control" name="firstName" id="firstName" placeholder="" required>
                    </div>

                    <div class="form-group">
                        <label>Last Name</label>
                        <input type="text" class="form-control" name="lastName" id="lastName" placeholder="" required>
                    </div>

                    <div class="form-group">
                        <label>Email</label>
                        <input type="email" class="form-control" name="email" id="email" placeholder="" required>
                    </div>

                    <div class="form-group">
                        <label>Phone Number</label>
                        <input type="text" class="form-control" name="number" id="number" placeholder="" required>
                    </div>

                    <div class="form-group">
                        <label>Date</label>
                        <input type="date" class="form-control" name="date" id="date" placeholder="" required>
                    </div>

          <div class="form-group">
                        <label>Time</label>
            <select id="time" name="time" class="form-control" required>
                                                        <option value="">Please select ...</option>
                                                        '.$timeSelect.'
                                                    </select>
                    </div>

          <div class="form-group">
                        <label>Party Size</label>
                        <input type="number" class="form-control" name="size" id="size" placeholder="" required>
                    </div>

          <div class="form-group">
                        <label>Occasion</label>
            <select id="occasion" name="occasion" class="form-control" required>
                                                        <option value="" selected>Please select</option>
                                                        '.$occasionSelect.'
                                                    </select>
                    </div>

          <div class="form-group">
                        <label>Status</label>
                        <select class="form-control" name="status" id="status" placeholder="">
              <option value="accepted">Accepted</option>
              <option value="not-accepted">Not Accepted</option>
            </select>
                    </div>

          <div class="form-group">
                        <label>Comment</label>
                        <textarea type="text" class="form-control" name="comment" id="comment" placeholder=""></textarea>
                    </div>

          <input type="hidden" class="form-control" name="code" id="code" placeholder="">
          <input type="hidden" class="form-control" name="customerCode" id="customerCode" placeholder="">
                </div>
                <div class="modal-footer">
                        <button type="submit" class="btn btn-primary">Edit</button>
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                </div>
            </form>
        </div>
    </div>
</div>';

0 个答案:

没有答案
相关问题