Javascript 使用ajax重新加载网页的一部分？

控制器（为加载特定板而调用）：

从模板/header.php

<li class="custom-holder select-board">
        <label class="boostrap-select-label">BOARD:</label>
        <select class="selectpicker" title="CHOOSE BOARD" id='board_selection'>
            <?php 
        if (count($boards) > 0) {
          foreach ($boards as $b) {?>
              <option value="<?php echo $b->id; ?>"><?php echo $b->name; ?></option>
            <?php
          }
        }
  ?>
        </select>
</li>

我有一个

选择

或下拉菜单，您可以从中选择要查看的板。然而，正如我上面的代码所暗示的，我正在使用模板。基本上，当你点击下拉菜单中的另一块板时，它应该加载该板。板的html位于

主看板中。我认为我不能使用
重定向
，因为有数据需要随视图一起传递

我尝试了jQuery的
load（）
，但遇到了问题。（当我使用板的表格时，每个
中都有一个新任务按钮。当新任务模式打开时，有一个选项可以选择到日期和从日期。当我使用
加载（）
日期-时间选择器没有显示。我正在使用几个脚本进行自定义，这些脚本加载在
模板/footer.php
模式中，我还有其他选择菜单。ajax完成后，这些菜单为空。）
如何实现这一点？
使用
load（）
的完成回调来初始化诸如日期选择器之类的插件

  var loadData = {'board_id' : selected_board};

  $('.mainboard').load(base_url + 'home', loadData , function(){
     // new html exists now .. initialize plugins or event listeners    
     $(this).find('.datepickerClass').datepicker({ /* options */})
  });

我在模式中还有其他
选择
菜单。当ajax完成时，这些菜单是空的。不知道需要什么，我看到的信息不够，但不确定是否应该将整个html粘贴到这里。但简而言之，我有一个页眉、内容和页脚。内容是动态的，其内容会根据所选的板而更改。我不能只是在控制器中重定向，因为视图需要一些数据传递给它们，所以我必须使用ajax（也要向函数传递一些POST变量）。我有一个函数，可以获取需要加载到内容中的数据。实现这一目标的最简单方法是什么？
$('.select-board').on('change', '#board_selection', function() {
console.log('Changed board selection.');
var selected_board = $('#board_selection option:selected').val();

$.ajax({
    type: 'POST',
    url: base_url + 'home', //configured this in routes.php
    data: { 'board_id' : selected_board },
    success: function(msg) {
        if (msg != 'failed') 
        {
            console.log('Loading board success!');
            $('.mainboard').load(base_url + 'home', {
                'board_id' : selected_board
            }); //mainboard is the parent div in main_kanban 
                 //that basically contains all the elements for the board
        }
        else 
        {
            console.log('Error >> ' + msg);
        }
    },
    error: function(xhr, error, errorThrown) {
        console.log(xhr.responseText);
        console.log(error);
    }
  });
});

  var loadData = {'board_id' : selected_board};

  $('.mainboard').load(base_url + 'home', loadData , function(){
     // new html exists now .. initialize plugins or event listeners    
     $(this).find('.datepickerClass').datepicker({ /* options */})
  });