Snippet redraw not working with BootstrapRenderer #10

Mirovsky · 2016-04-14T21:33:16Z

When used any of BootstrapRenderers, snippet redraw sends the message but actual redraw never happens.

Presenter:

class SimplePresenter extends Nette\Application\UI\Presenter {
    public function createComponentSimpleForm() {
        $form = new Nette\Application\UI\Form();
        $form->setRenderer(new BootstrapRenderer);
        $form->getElementPrototype()->class('ajax');

        $form->addText('text', 'Text');
        $form->addSubmit('submit', 'Submit');

        $form->onSuccess[] = array($this, 'onSuccess');

        return $form;
    }
    public function onSuccess(Nette\Application\UI\Form $form) {
        $form->setValues(array(), TRUE);
        $this->redrawControl('form');
    }
}

Template:

{block content}

    {snippet form}
        {control simpleForm}
    {/snippet}

{/block}

All files are included, $.nette.init() called, other snippets redraws are working.
After commenting out line with $form->setRenderer(...) its works properly. Also when DefaultFormRenderer is used, everything works as expected.

The text was updated successfully, but these errors were encountered:

tomaj · 2016-04-18T10:39:10Z

Can you send some error message that you get? or maybe whole presenter file?

Mirovsky · 2016-04-19T14:30:56Z

There is no error message. And the whole presenter file looks like this.

<?php

namespace App\Modules\Admin\Presenters;

use Nette;
use Tomaj\Form\Renderer\BootstrapRenderer;

class SimplePresenter extends Nette\Application\UI\Presenter {

    public function createComponentSimpleForm() {
        $form = new Nette\Application\UI\Form();
        $form->setRenderer(new BootstrapRenderer);
        $form->getElementPrototype()->class('ajax');

        $form->addText('text', 'Text');
        $form->addSubmit('submit', 'Submit');

        $form->onSuccess[] = array($this, 'onSuccess');

        return $form;
    }
    public function onSuccess(Nette\Application\UI\Form $form) {
        $form->setValues(array(), TRUE);
        $this->redrawControl('form');
    }

}

and for template

{**
 * @param string   $basePath web base path
 * @param array    $flashes  flash messages
 *}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">

    <title>{ifset title}{include title|striptags} | {/ifset}Nette Sandbox</title>

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <link rel="stylesheet" href="{$basePath}/css/style.css">
    <meta name="viewport" content="width=device-width">
    {block head}{/block}
</head>

<body>
    <div n:foreach="$flashes as $flash" n:class="flash, $flash->type">{$flash->message}</div>

    <div class="container">
       {snippet form}
          {control simpleForm}
       {/snippet}
    </div>

    {block scripts}
    <script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
    <script src="{$basePath}/bower_components/nette.ajax.js/nette.ajax.js"></script>
    <script src="{$basePath}/js/main.js"></script>
    {/block}
</body>
</html>

and inside main.js is only this:

$(function () {
    $.nette.init();
});

and this is what i get inside the response from server:

{state: [], snippets: {,…}}
snippets: {,…}
snippet--form: "<form action="/admin/simple/default" method="post" class="ajax form-horizontal" id="frm-simpleForm" novalidate="novalidate">↵↵<div>↵<div class="form-group">↵   <div class="col-sm-3 control-label"><label for="frm-simpleForm-text">Text</label></div>↵↵   <div class="col-sm-9"><input type="text" name="text" class="form-control text" id="frm-simpleForm-text"></div>↵</div>↵↵<div class="form-group">↵    <div class="col-sm-3 control-label"></div>↵↵    <div class="col-sm-9"><input type="submit" name="_submit" class="btn btn-primary button" value="Submit"></div>↵</div>↵</div>↵↵<div><input type="hidden" name="do" value="simpleForm-submit"><!--[if IE]><input type=IEbug disabled style="display:none"><![endif]--></div>↵</form>↵"
state: []

SimeonAnunciado · 2022-11-30T13:28:18Z

There is no error message. And the whole presenter file looks like this.

<?php

namespace App\Modules\Admin\Presenters;

use Nette;
use Tomaj\Form\Renderer\BootstrapRenderer;

class SimplePresenter extends Nette\Application\UI\Presenter {

    public function createComponentSimpleForm() {
        $form = new Nette\Application\UI\Form();
        $form->setRenderer(new BootstrapRenderer);
        $form->getElementPrototype()->class('ajax');

        $form->addText('text', 'Text');
        $form->addSubmit('submit', 'Submit');

        $form->onSuccess[] = array($this, 'onSuccess');

        return $form;
    }
    public function onSuccess(Nette\Application\UI\Form $form) {
        $form->setValues(array(), TRUE);
        $this->redrawControl('form');
    }

}

and for template

{**
 * @param string   $basePath web base path
 * @param array    $flashes  flash messages
 *}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">

    <title>{ifset title}{include title|striptags} | {/ifset}Nette Sandbox</title>

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <link rel="stylesheet" href="{$basePath}/css/style.css">
    <meta name="viewport" content="width=device-width">
    {block head}{/block}
</head>

<body>
    <div n:foreach="$flashes as $flash" n:class="flash, $flash->type">{$flash->message}</div>

    <div class="container">
       {snippet form}
          {control simpleForm}
       {/snippet}
    </div>

    {block scripts}
    <script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
    <script src="{$basePath}/bower_components/nette.ajax.js/nette.ajax.js"></script>
    <script src="{$basePath}/js/main.js"></script>
    {/block}
</body>
</html>

and inside main.js is only this:

$(function () {
    $.nette.init();
});

and this is what i get inside the response from server:

{state: [], snippets: {,…}}
snippets: {,…}
snippet--form: "<form action="/admin/simple/default" method="post" class="ajax form-horizontal" id="frm-simpleForm" novalidate="novalidate">↵↵<div>↵<div class="form-group">↵   <div class="col-sm-3 control-label"><label for="frm-simpleForm-text">Text</label></div>↵↵   <div class="col-sm-9"><input type="text" name="text" class="form-control text" id="frm-simpleForm-text"></div>↵</div>↵↵<div class="form-group">↵    <div class="col-sm-3 control-label"></div>↵↵    <div class="col-sm-9"><input type="submit" name="_submit" class="btn btn-primary button" value="Submit"></div>↵</div>↵</div>↵↵<div><input type="hidden" name="do" value="simpleForm-submit"><!--[if IE]><input type=IEbug disabled style="display:none"><![endif]--></div>↵</form>↵"
state: []

im encountering this how do you fix this ?

tomaj added the bug label Apr 18, 2016

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Snippet redraw not working with BootstrapRenderer #10

Snippet redraw not working with BootstrapRenderer #10

Mirovsky commented Apr 14, 2016

tomaj commented Apr 18, 2016

Mirovsky commented Apr 19, 2016

SimeonAnunciado commented Nov 30, 2022

Snippet redraw not working with BootstrapRenderer #10

Snippet redraw not working with BootstrapRenderer #10

Comments

Mirovsky commented Apr 14, 2016

tomaj commented Apr 18, 2016

Mirovsky commented Apr 19, 2016

SimeonAnunciado commented Nov 30, 2022