Question

嗨我有一个问题，基于我将如何用我的控制器返回的数据替换我的网页部分。我有一个页面直接从我的数据库显示电影的细节，我想当用户选择一个特定的类型，然后只显示该特定类别的电影。我已经设法从选择框中获取每个类型的名称并将其发送到控制器，我将使用它从数据库中提取数据。在我的HTML中我使用foreach循环来加载 ALL 数据，我的问题是如何将它们显示回视图并操纵我的php / html代码以显示它们（实际上替换了现有的php / html与new作为ajax请求）。我知道我必须使用json_encode（）将它们作为对象发回，但我不知道如何显示它们或迭代php / html标签中的数据。

的Javascript

$(".select__sort").change(function()
    {

        var genre = $(".select__sort").val();

        $.ajax({
            type: "POST",
            url: "http://localhost:8888/Cinema_Seat_Booking_System/movie_list_full/order_by_genre",
            data: {'cat':genre},
            dataType:"json",
            cache: false,
        success: function (data) {

        }
      });
    });

HTML

  <div class="select-area">

                <form class="select select--film-category" method='get'>
                      <select name="select_item" class="select__sort" tabindex="0">
                        <option value="default" selected="selected">All</option>
                          <?php foreach($genres as $category): ?>
                          <option value="<?php echo $category->genre ?>" selected="selected"> <?php echo $category->genre ?></option>
                          <?php endforeach ?>
                    </select>
                </form>

        </div>

HTML foreach循环电影数据

<!-- Movie preview item -->
            <?php foreach($movies_data as $movie_data) :?>
            <div class="movie movie--preview movie--full release">
                 <div class="col-sm-3 col-md-2 col-lg-2">
                        <div class="movie__images">
                            <img alt='' src=<?php echo $movie_data->path ?>>
                        </div>

                </div>

                <div class="col-sm-9 col-md-10 col-lg-10 movie__about">
                        <a href='view_movie_page_full.php' class="movie__title link--huge"><?php echo $movie_data->title ?></a>

                        <p class="movie__time"><?php echo $movie_data->duration_min ?></p>

                        <p class="movie__option"><strong>Country: </strong><a href="#"><?php echo $movie_data->country ?></a href="#"></p>
                        <p class="movie__option"><strong>Category: </strong><a href="#"><?php echo $movie_data->genre ?></a></p>
                        <p class="movie__option"><strong>Director: </strong><a href="#"><?php echo $movie_data->director ?></a></p>
                        <p class="movie__option"><strong>Actors: </strong><a href="#"><?php echo $movie_data->actors ?></a></p>

                        <div class="movie__btns">
                            <a href="<?php echo site_url('book1')?>" class="btn btn-md btn--warning">book a ticket <span class="hidden-sm">for this movie</span></a>
                        </div>

                        <div class="preview-footer">
                            <div class="movie__rate"><div class="score"></div><span class="movie__rate-number"></span> </div>


                        </div>
                </div>

                <div class="clearfix"></div>



            </div>
            <?php endforeach ?>
            <!-- end movie preview item -->

控制器

 public function order_by_genre()
{
    $this->load->model('movie_list_full_model');

    $ajax_request = $this->input->post('cat');
    $query_data['genres'] = $this->movie_list_full_model->get_all_genres($ajax_request);


    $this->load->view('templates/header');
    $this->load->view('home/view_movie_list_full', $query_data);
    $this->load->view('templates/footer_movie_list_full');

}

ps我希望页面在不重新加载的情况下更改数据，这就是我用ajax尝试它的原因，但我对此很新，我被卡住了。有什么帮助吗？

Answer 1

您可以检查ajax是否使用post来访问您的控制器然后返回json encode

public function order_by_genre(){

$this->load->model('movie_list_full_model');
$is_post = $this->input->server('REQUEST_METHOD') == 'POST';

if($is_post){
     $ajax_request = $this->input->post('cat');

     echo json_encode( $this->movie_list_full_model->get_all_genres($ajax_request));
  }
else {
      $this->load->view('templates/header');
      $this->load->view('home/view_movie_list_full', $query_data);
      $this->load->view('templates/footer_movie_list_full');
     }
}

然后在javascript中你可以使用$（this）.val（）它获取更改元素的值（你可以使用它很多）然后如果ajax调用在div中成功，你显示你的电影只需追加每一个带有forEach循环的电影

$(".select__sort").change(function()
{

    var genre = $(this).val();

    $.ajax({
        type: "POST",
        url: "http://localhost:8888/Cinema_Seat_Booking_System/movie_list_full/order_by_genre",
        data: {'cat':genre},
        dataType:"json",
        cache: false,
        success: function (data) {
          $("#movies").html(" "); //clear everything from movie div

            data.forEach(function(entry) {   
             $("#movies").append("<div>"+entry.movie+"</div>");
               //just add everything here
             });
        }
    });
});

如何将json数据发送到codeigniter视图

1 个答案: