When I use normal return this->render(\'create\', [\'model\' => $model]) my pop-up window goes all haywire. When I change to return $this->render
To know the difference between render() and renderAjax() first you need to understand how render() works.
Basically when render() is called every piece of JS and CSS code and file references registered with the view is gathered in several arrays to be rendered later on in proper places - these places are stored in the layout and their code is rendered by calling beginPage(), head(), beginBody(), endBody() and endPage().
You can point where the JS code should be rendered by setting the second parameter in related methods - like for example:
$this->registerJs("alert()", \yii\web\View::POS_HEAD);
renders
in layout where the method $this->head() is.
Everything is working fine until you want to render only a main part of view without the layout. Without it (and its methods like beginPage()) the JS and CSS references cannot be rendered in the previous way and that is why this fancy jQuery code rotating the square does not work - JS library has not been included there.
When you are calling $this->render() from within the view or just calling $this->renderPartial() from the controller exactly this is happening - layout is not applied.
renderAjax() comes now to the rescue.
This method doesn't care about layout because it calls beginPage(), head(), beginBody(), endBody() and endPage() methods by itself. Thanks to this every JS piece of code can be attached to the rendered view and the jQuery library can rotate this square once again even when it needs to be done inside an AJAX popup.