On gists

Nette modální okno

Nette

edit.latte Raw #

{block title}Editovat xyz{/block}

{block content}
<p class="buttons">
    <a class="btn btn-primary" n:href="default">
        <i class="fa fa-chevron-left"></i>
    </a>
</p>

{block modal}
    {control manageForm}
{/block}

presenter.php Raw #

public function actionAdd()
{
    if ($this->isAjax()) {
        $this->payload->isModal = TRUE;
        $this->redrawControl("modal");
    }
}


public function actionEdit($id)
{
    // my application logic, entity fetch etc..., redirect if not existing

    $this["manageForm"]->setDefaults($this->entity->toArray());

    if ($this->isAjax()) {
        $this->payload->isModal = TRUE;
        $this->redrawControl("modal");
    }
}

nette-ajax-extension.js Raw #

    $.nette.ext("modals", {
        success: function(payload) {
            if (payload.redirect) {
                $(".modal-ajax").modal("hide");
            } else if(payload.isModal) {
                $('.modal-ajax').modal('show');
            }
        }
    });

    $.nette.ext("ajaxRedirect", {
        success: function (payload) {
            if (payload.redirect) {
                $.nette.ajax(payload.redirect);
            }
        }
    });

layout.latte Raw #

{snippet modal}
        {if $presenter->isAjax()}
            {ifset #modal}
                <div class="modal fade modal-ajax">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                                {block modalHeader}
                                    <h3 class="modal-title">
                                        {block|striptags}{include #title}{/block}
                                    </h3>
                                {/block}
                            </div>
                            <div class="modal-body">
                                {include #modal}
                            </div>
                            {ifset #modalFooter}
                                <div class="modal-footer">
                                    {include #modalFooter}
                                </div>
                            {/ifset}
                        </div>
                    </div>
                </div>
            {/ifset}
        {/if}
    {/snippet}