вставить функцию jquery на страницу в yii

Question

я должен использовать функцию jquery в yii.У меня есть такой код и добавить его на странице просмотра.

   <script type="text/javascript">
   jQuery(function() {
    jQuery( "#item" ).draggable();
    jQuery( "#droppable" ).droppable({
      drop: function( event, ui ) {
        var $self = jQuery(this);
        var dropOffset = $self.offset();
        var itemOffset = ui.offset;
        var itemRelativePosition = { left: (itemOffset.left - dropOffset.left), top: (itemOffset.top - dropOffset.top) };
        console.log(itemRelativePosition);
        jQuery('#layout').val( '{ left: '+itemRelativePosition.left+', top: '+itemRelativePosition.top+'}' );
      }
    });
   });
   </script>

, но я не могу знать, почему он не работает. Есть ли другой способ использовать этот код.

Answer 1

Вам необходимо зарегистрировать код jquery

<?php
// Javascript 

Yii::app()->clientScript->registerScript('register_script_name', "
    var partner_only = '".CHTML::activeId($model,'partner_only')."';
    jQuery(function() {
        jQuery( '#item' ).draggable();
        jQuery( '#droppable' ).droppable({
            drop: function( event, ui ) {
                var $self = jQuery(this);
                var dropOffset = $self.offset();
                var itemOffset = ui.offset;
                var itemRelativePosition = { 
                    left: (itemOffset.left - dropOffset.left), top: (itemOffset.top - dropOffset.top) 
                };
                console.log(itemRelativePosition);
                jQuery('#layout').val( '{ left: '+itemRelativePosition.left+', top: '+itemRelativePosition.top+'}' );
            }
        });
    });
", CClientScript::POS_READY);

?>

Надеюсь, что это отвечает на ваш вопрос

Answer 2

Добавьте следующий код к вашему файлу просмотра:

Yii::app()->getClientScript()->registerScriptFile('//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js');
Yii::app()->getClientScript()->registerScriptFile('//ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js');