Reload page with javascript or Symfony?

Question

After a form is submitted, a modal is closed and a success notification is sent. However, the newly submitted data doesn't appear as captured, because the page doesn't refresh. (Can't get it to refresh with either PHP or javascript)

In this situation, I'd assume a javascript refresh would be ideal - or would a Symfony redirect be more appropriate?

Success code in php/symfony:

$passthroughVars = array(
    'closeModal'=> 1,
    'jsContent' => 'custom_widget'
);

$passthroughVars['widgetHtml'] = $this->renderView('WidgetBundle:Widget:widget.html.php', array(
    'widget' => $widget,
));
$passthroughVars['widgetId'] = $widget->getId();
$passthroughVars['flashes'] = $this->getFlashContent();

$response = new JsonResponse($passthroughVars);
$response->headers->set('Content-Length', strlen($response->getContent()));

return $response;

Javascript:

Widgety.widgetOnLoad = function (container, response) {
    if (response) {
        if (response.upWidgetCount) {
            var count = parseInt(mQuery('#WidgetCount').html());
            count = (response.upWidgetCount > 0) ? count + 1 : count - 1;

            mQuery('#WidgetCount').html(count);
        }

        if (response.widgetHtml && response.widgetId) {
            var el = '#Widget' + response.widgetId;
            if (mQuery(el).length) {
                mQuery(el).replaceWith(response.widgetHtml);
            } else {
                mQuery('#widget-container .widget').prepend(response.widgetHtml);
            }

            mQuery(el + " *[data-toggle='ajaxmodal']").off('click.ajaxmodal');
            mQuery(el + " *[data-toggle='ajaxmodal']").on('click.ajaxmodal', function (event) {
                event.preventDefault();

                Widgety.ajaxifyModal(this, event);
            });

            mQuery(el + " *[data-toggle='confirmation']").off('click.confirmation');
            mQuery(el + " *[data-toggle='confirmation']").on('click.confirmation', function (event) {
                event.preventDefault();
                WidgetyVars.ignoreIconSpin = true;
                return Widgety.showConfirmation(this);
            });
        }

        if (response.deleted && response.widgetId) {
            var el = '#Widget' + response.widgetId;
            if (mQuery(el).length) {
                mQuery(el).remove();
            }
        }
    }
};

In the javascript, I've tried adding document.location.reload(true) yet the content did not refresh. Likewise, with a PHP redirect, the modal refuses to close, even while passing closeModal = 1.

Code:

return $this->redirect($this->generateUrl('widget_page',
array(
    'passthroughVars' => array(
        'closeModal'    => 1,
    ),
    'widgetAction' => 'overview',
    'widgetId' => $widget->->getId()
    )
));

score 1 · Answer 1 · edited May 23 '17 at 12:00

1

To reload a website in Javascript you need to call the window.location.reload() function. You can also call window.location.href = window.location.href which has a similar effect (this has already been answered here and provides further detail, How to reload a page using JavaScript?).

Although I think a better solution for you would be to add the updated content to your page with Javascript (instead of reloading the page), this would be 'better' for the user experience.

edited May 23 '17 at 12:00

Community

1
1

answered Sep 17 '16 at 21:56

Peter Dempsey

485
1
9
17

Doing so would require adding a call to the template, correct? Can you point me to an example so I can better understand how to achieve such? – bottomrocks Sep 17 '16 at 22:44

score 1 · Answer 2 · answered Dec 18 '18 at 12:09

If what you are looking for is to refresh the page after the form is submitted (and therefore the modal is closed) you might want to take a look at this:

$('#yourModal').on('hide.bs.modal', function () {
    window.location.reload()
});

This should work.

Reload page with javascript or Symfony?

2 Answers2