Problem with rendering widget inside view loaded with ajax

Hi,

I would like to render a view when clicked in div container. The view contains a widget (for example kartik-v/yii2-widget-touchspin). And the view is rendered via an ajax call that trigger an action function in the controller, rendering the view back to the ajax response and displaying it in the div container.

I tried to work with render, renderPartial and renderAjax (in combination with Pjax) but all seem to not do the job. The widget does not get rendered correctly and sometimes messes with the whole page.

Main view:




<a href="#" onclick="javascript:testContent();">load content</a>

<div id="testcon"></div>

<script>

function testContent(){

    $.ajax({

        type:\"POST\",

        cache:false,

        url:\"".Url::to(['site/content'])."\",

        success:function(data){

                 $(\"#testcon\").html(data);

        },

    })

}

</script>



Controller:




public function actionContent()

{

        if (Yii::$app->request->isAjax) {

                return $this->renderAjax('_content');

        }

}



_content view:




use kartik\touchspin\TouchSpin;


echo TouchSpin::widget([

        'name' => 'quantitySpin2',

        'pluginOptions' => ['step' => 1,

                'min' => 0,

                'verticalbuttons' => true,

                'verticalupclass' => 'glyphicon glyphicon-plus',

                'verticaldownclass' => 'glyphicon glyphicon-minus']

]);



So if anybody has some advice, please feel free to respond. Thank you.

G.