CodeIgniter 和 Bootstrap 模式 - 传递数据

Question

我在 views/modals 文件夹中创建了一个引导模式 mngCat，当我想添加新类别或想编辑现有类别时，我想在这两种情况下调用它。

<div id="mngCat" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="addNewLabel" aria-hidden="true">
    <div class="modal-header">
        <h3 id="addNewLabel"><?php echo empty($cat->category_id) ? 'Add category' : 'Edit category ' . $cat->category; ?></h3>
    </div><!-- end of .modal-header -->
    <div class="modal-body">
    <?php echo form_open('admin/category/manage') . PHP_EOL; ?>
        <p>
        <label for="category_name">Category name:</label>
    <input type="text" name="category_name" value="<?php echo set_value('category_name', $cat->category); ?>" />
        </p>
        <p>
        <label for="parent">Set Parent category:</label>
        <select>
        <option>-- None --</option>
        <?php if(count($all_categories)): foreach($all_categories as $cat): ?>
        <option value="<?php echo $cat->category_id; ?>"><?php echo $cat->category; ?></option>
        <?php endforeach; endif; ?>
        </select>
        </p>
        <?php echo form_close() . PHP_EOL; ?>
    </div>
    <div class="modal-footer">
        <button class="btn btn-primary" type="submit">Ok</button>
        <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    </div>
</div><!-- end of #mngCat modal -->

当我想添加一个类别时，我点击了这个 ci 锚

$attr = array(
    'class' => 'btn btn-primary',
    'data-toggle' => 'modal',
    'data-target' => '#mngCat'
    );
echo anchor('#mngCat','<i class="icon-plus icon-white"></i> Add Category', $attr);

当我想编辑一个类别时，我点击了这个：

<?php echo anchor('#mngCat' . $cat->category_id, $cat->category, $attr); //not passing any data  ?>

因此，当我单击添加类别时，模态显示标题为添加类别，但是当我单击类别名称（第二个锚点）时，模态不会出现。我想做的是显示带有标题编辑类别的模式并以类别数据的形式显示，以便我可以进行编辑。

Answer 1

这里你必须明白几件事：

1. 引导模式已加载到视图中，或者说它已经加载 渲染 - 它只是隐藏（查看源代码你会在那里看到它）。

2. 无论你点击多少，你做什么，它总是 显示相同的数据

3. 除非您这样做，否则您无法通过链接将数据解析为引导模式 一些后期处理。

你必须做什么

1. 在两个链接上使用 jquery 创建 onclikc 事件

2. 添加data-category_id=$cat->category_id作为你的属性（如果添加添加null）

3. 一旦触发事件，创建模态

   var category_modal = $('<div id="mngCat" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="addNewLabel" aria-hidden="true"></div>');

4. 通过 ajax 将数据加载到模态体中

   .post('somecontroler/getcatgoryform/',{category_id:$(this).data('category-id')}
             function(response){
              category_modal.html(response);
              category_modal.modal('show');
   
   }
   

   }

5) 在 codigniters somecontroler/getcatgoryform/ 中进行处理并 加载以模态标题开头的视图（没有模态 容器） sfsdfsd

 <div class="modal-header"><h3 id="addNewLabel"><?php echo empty($cat->category_id) ? 'Add category' : 'Edit category ' . $cat->category; ?></h3></div><!-- end of .modal-header -->
<div class="modal-body">
<?php echo form_open('admin/category/manage') . PHP_EOL; ?>
    <p>
    <label for="category_name">Category name:</label>
<input type="text" name="category_name" value="<?php echo set_value('category_name', $cat->category); ?>" />
    </p>
    <p>
    <label for="parent">Set Parent category:</label>
    <select>
    <option>-- None --</option>
    <?php if(count($all_categories)): foreach($all_categories as $cat): ?>
    <option value="<?php echo $cat->category_id; ?>"><?php echo $cat->category; ?></option>
    <?php endforeach; endif; ?>
    </select>
    </p>
    <?php echo form_close() . PHP_EOL; ?>
</div>
<div class="modal-footer">
    <button class="btn btn-primary" type="submit">Add</button>
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
</div>

最后如果不确定，谷歌load bootstrp modal via ajax