how to stop refresh when rendering select2 widget

[asoqa]

I create a page with an ajax button, when clicking the button, a select2 widget will be rendered. However, when rendering Select2 widget, the page is refreshed even I used an ajax request. If I change the Select2 to an ordinary widget, such as TextInput, the page will not be refreshed, everything is ok

$('.modify-tag').click(function(){
    var block = $(this).parents('span.tags');
    var url = "$updateTagsUrl&id=" + 488;
    $.getJSON(url,  function(data){
        block.html(data);
    });
});

updateTagUrl render the Select2 widget in form

    echo $form->field($model, 'tag')
        ->widget(Select2::classname(), [
        'data' => $tags,
        'theme' => Select2::THEME_BOOTSTRAP,
        'pluginOptions' => [
            'templateResult' => new JsExpression('format'),
            'templateSelection' => new JsExpression('formatSelect'),
            'escapeMarkup' => $escape,
            'tags' => true
        ],
        'options' => [
            'placeholder' => 'Select...',
            'multiple' => true
        ]
    ])
        ->label(false);

The http console tool shows all http requests during rendering, as follows: GET http://x.x.x.x/assets/7800cb75/js/select2.full.js?_=1456331029889

GET http://x.x.x.x/assets/7800cb75/js/select2-krajee.js?_=1456331029890

GET http://x.x.x.x/assets/7800cb75/js/i18n/zh-CN.js?_=1456331029891

GET http://x.x.x.x/assets/6987343/yii.activeForm.js?_=1456331029892

[kartik-v]

Not related to this extension. It is more to do with your markup. HTML by default renders a button of type SUBMIT which will submit the form (causing your page refresh). Set <button type="button"> explicitly to ensure that no form submit action is performed.