How to load an HTML file into a DIV in zend-framework3

Asked

Viewed 78 times

0

I am working on an email marketing tool and need to upload an HTML template into a DIV in the view. I am using zend-framework3. I tried using the . load() function, but it’s giving error 500. Can anyone help me??

I am using the following function:

$('#carregaTemplate').click(function(){

    var qtdProdutos = $('#qtdProdutos').val();

    $(function(){
        if( qtdProdutos == 1 ) {
            $('#arquivoHtml').load('templates/sem_produtos.html');
        }
        if( qtdProdutos == 2 ) {
            $('#arquivoHtml').load('templates/dois_produtos.html');
        }
        if( qtdProdutos == 3 ) {
            $('#arquivoHtml').load('templates/tres_produtos.html');
        }
        if( qtdProdutos == 4 ) {
            $('#arquivoHtml').load('templates/quatro_produtos.html');
        }
    });
});
  • Error 500 is on the server side, check the routes, see in the console how is mounting the address for the templates and try to access them directly from the address bar.

  • I checked the routes and tried to access directly also, the browser displays the message that can not meet the request. I tried to use a <iframe> obtained the same error 500. I believe zend requires another way to render HTML files. I’m researching, but I haven’t found anything yet... @Leandro Angelo

  • No use in iframe, you need to add a path to the static files so that it ignores it without trying to find a controller and an action for the request

  • Take a look here https://blog.eduonix.com/web-programming-tutorials/static-pages-in-zend-framework/

  • Thank you @Leandro Angelo. From the blog indicated I managed to reach the resolution of the problem. I used the example here https://olegkrivtsov.github.io/using-zend-framework-3-book/html/en/Routing/Regex_Route_Type.html

  • It would be interesting for you to post an answer explaining how you solved it. This information can be very useful for other users who come across the same problem

Show 1 more comment

1 answer

0

After much research and the contribution of the dear friends here in the stack, I managed to solve the problem as follows:

-created a route of type Regex. This route type allows rendering static pages. See example here: https://olegkrivtsov.github.io/using-zend-framework-3-book/html/en/Routing/Regex_Route_Type.html

-in the controller, I created the following function responsible for rendering the page:

public function docAction() {
    $pageTemplate = 'email-marketing/template/doc' . $this->params()->fromRoute('page', 'documentation.phtml');

    $filePath = __DIR__ . '/../../view/' . $pageTemplate . '.phtml';        
    if (!file_exists($filePath) || !is_readable($filePath)) {
        $this->getResponse()->setStatusCode(404);
        return;
    }

    $viewModel = new ViewModel([
        'page'=>$pageTemplate
    ]);

    $viewModel->setTemplate($pageTemplate);

    return $viewModel;
}

and finally, the function that loads the page inside a DIV, in my case, was like this:

Function loading() {

    var qtdProdutos = $('#qtdProdutos').val();

    if( qtdProdutos == 1 ) {
        $('#arquivoHtml').load( "<?= $this->url('doc', ['page' => 'pagina']) ?>", function( response, status, xhr ){
            if( status == "error" ) {
                var msg = "Desculpe, ocorreu um erro: ";
                $('#arquivoHtml').html( msg + xhr.status + " " + xhr.statusText );
            }
        });
    }
    if( qtdProdutos == 2 ) {
        $('#arquivoHtml').load( "<?= $this->url('doc', ['page' => 'dois_produtos']) ?>", function( response, status, xhr ){
            if( status == "error" ) {
                var msg = "Desculpe, ocorreu um erro: ";
                $('#arquivoHtml').html( msg + xhr.status + " " + xhr.statusText );
            }
        });
    }
    if( qtdProdutos == 3 ) {
        $('#arquivoHtml').load( "<?= $this->url('doc', ['page' => 'tres_produtos']) ?>", function( response, status, xhr ){
            if( status == "error" ) {
                var msg = "Desculpe, ocorreu um erro: ";
                $('#arquivoHtml').html( msg + xhr.status + " " + xhr.statusText );
            }
        });
    }
    if( qtdProdutos == 4 ) {
        $('#arquivoHtml').load( "<?= $this->url('doc', ['page' => 'quatro_produtos']) ?>", function( response, status, xhr ){
            if( status == "error" ) {
                var msg = "Desculpe, ocorreu um erro: ";
                $('#arquivoHtml').html( msg + xhr.status + " " + xhr.statusText );
            }
        });
    }

}

Browser other questions tagged

You are not signed in. Login or sign up in order to post.