У меня есть загрузочная форма 2.32, форма которой длинна (см. Ниже). Я хотел бы реализовать это как отдельный частичный вид, который будет динамически вставлен в HTML другого представления (для удобства обслуживания), но я точно не знаю, как это сделать. Я работаю с Codeigniter 2.1.
Кнопка основного вида:
<div id="thanks"><p><a data-toggle="modal" href="#form-content" class="btn btn-primary btn-large">Modal powers, activate!</a></p></div> Вот что я хотел бы сохранить отдельно как частичное представление:
<div id="form-content" class="modal hide fade in" style="display: none;"> <div class="modal-header"> <a class="close" data-dismiss="modal">×</a> <h3>Send me a message</h3> </div> <div class="modal-body"> <form class="contact" name="contact"> <fieldset> <!-- Form Name --> <legend>modalForm</legend> <!-- Text input--> <div class="control-group"> <label class="control-label" for="user">User</label> <div class="controls"> <input id="user" name="user" type="text" placeholder="User" class="input-xlarge" required=""> <p class="help-block">help</p> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="old">Old password</label> <div class="controls"> <input id="old" name="old" type="text" placeholder="placeholder" class="input-xlarge"> <p class="help-block">help</p> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="new">New password</label> <div class="controls"> <input id="new" name="new" type="text" placeholder="placeholder" class="input-xlarge"> <p class="help-block">help</p> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="repeat">Repeat new password</label> <div class="controls"> <input id="repeat" name="repeat" type="text" placeholder="placeholder" class="input-xlarge"> <p class="help-block">help</p> </div> </div> </fieldset> </form> </div> <div class="modal-footer"> <input class="btn btn-success" type="submit" value="Send!" id="submit"> <a href="#" class="btn" data-dismiss="modal">Nah.</a> </div> </div>
Вы можете сделать это в любой точке в виде, где вам нужно загрузить «частичный» вид.
$this->load->view('modal_view');
EDIT: загрузка динамического содержимого
В этом примере я буду использовать вызов jQuery AJAX для динамического получения представления.
По вашему мнению, вы должны включить целевой div для вставки ответа AJAX.
<div id="modal_target"></div>
Кнопка для загрузки модальных и показов.
<button type="button" class="btn btn-primary btn-medium" onclick="get_modal();" >Show Modal</button>
Функция javascript, которая делает магию
<script type="text/javascript"> function get_modal(){ $.ajax({ type : 'POST', url : '<?php base_url() ?>controler/get_modal', cache : false, success : function(data){ if(data){ $('#modal_target').html(data); //This shows the modal $('#form-content').modal(); } } }); } </script>
Вы также должны включить в свой contoller функцию, вызванную в AJAX
public function get_modal() { $this->load->view('modal_view'); }