CODEWITHSUNDEEP
javascriptphpsymfony-2.8
bottomrocks
bottomrocks

Reputation: 21

Reload page with javascript or Symfony?

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()
    )
));

Upvotes: 0

Views: 2654

Answers (2)

SpicyTacos23
SpicyTacos23

Reputation: 550

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.

Upvotes: 1

Peter Dempsey
Peter Dempsey

Reputation: 495

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.

Upvotes: 1

Related Questions