在视图页面上显示 AJAX 结果 jQuery

displaying ajax result on view page jquery

本文关键字:AJAX 结果 jQuery 显示 视图      更新时间:2023-09-26

下面是HTML源代码:

<?php foreach ($workshops as $workshop): ?>             
    <div class="col-md-3">                          
        <div class="virtual clearfix">
            <div class="virtual_days clearfix">
                <div class="twitter_image pull-left">
                    <?php echo img(array('src' => base_url($this->config->item('img_path').'twitter.png'), 'class' => 'twitter_image pull-left')); ?>
                </div>
                <div class="weekend pull-left">
                    <div class="no_of_days pull-left">
                    <?php echo $workshop->total_days ?>
                    </div>
                    <div class="pull-right">
                        Days
                        <br>
                        Weekend Classes
                    </div>
                </div>
                </div>
                <div class="virtual_time clearfix">                                     
               <?php echo $workshop->city; ?>
               <br>                                       
               <?php echo $workshop->country; ?>                                
               <br>
               UTC / GMT is 9:30 AM to 1:30 PM
                </div>
                <div class="training_calendar">
                  <?php foreach ($workshop->workshop_dates as $dates) : ?>                                       
                    <div class="month">
                <?php echo date("M", strtotime($dates->start_date)); ?>
                </div>
                                    <div class="week_calendar">
                                        <div class="full_week_days clearfix">
                                            <div class="days pull-left">
                                                <span><?php  echo date('D', strtotime($dates->start_date)); ?></span>
                                                <br>
                                                    <?php echo $dates->start_date; ?>
                                                    to
                                                    <?php echo $dates->end_date; ?>
                                                <br>
                                            </div>                                          
                                        </div>
                                    </div>
                                    <?php endforeach; ?>
                                </div>
                                <div class="virtual_price">
                                    <div class="center-block">
                                        <div class="virtual_price_center">
                                            Exam Fee is Extra
                                        </div>
                                    </div>
                                    <div class="strike_through">
                                        <?php echo $workshop->price ?>
                                    </div>
                                    <div class="price">
                                        <?php echo $workshop->price ?>
                                    </div>
                                    <div class="early_bird_date">
                                        Last Date For Early Bird
                                        <?php echo $workshop->early_bird_date ?>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-3"></div>
                                        <div class="col-md-6">
                                            <div class="enroll_now">
                                                <a href="cart.html">Enroll Now</a>
                                            </div>
                                        </div>
                                        <div class="col-md-3"></div>
                                    </div>
                                    <div class="service_tax">
                                        Service Tax 12.5% Extra
                                    </div>
                                </div>
                            </div>
                        </div>                                          
                    <?php endforeach; ?>

下面是jquery代码,其中结果如上所示,我正在使用$workshop作为对象:

所以请与以下代码集成

改变路线 $('#course').change(function() {

    // Search Data
    var search_data = {
        course_id: $('select[name="course_id"]').val(),
        country_id: $('select[name="country_id"]').val(),
        city_id: $('select[name="city_id"]').val()
    };
    if(!search_data.course_id && !search_data.country_id && !search_data.city_id) {
        location.reload();
    }
    $('select[id="course_id"]').html('<option value="">Select Course</option>');
    if($(this).val()) {
        $.ajax({
            data:{course_id: $(this).val()},
            type:"post",
            url: "<?php echo base_url($this->config->item('courses_ajax_get_workshops_by_search_uri')); ?>",
            dataType:"json",
            data: search_data,
            cache:false,
            success:function(data){
                if(data.response == true){
                    if(typeof data.courses!='undefined'){                        
                        $.each(data.courses, function(key, courses) {
                            ----------------------------
                            (your code as to come here)
                            (concatenate with above html elements)
                            -----------------------------
                        });
                    }
                }
            }
        });
    }
});`

向上面的这个 PHP 文件发送 ajax 请求。

$.ajax({
  url: "getPHPData.php"
}).done(function(result) {
  $( '#divToAppend').html(result);
});

因此,使用 .html 附加到您想要的某个div。