web-dev-qa-db-ja.com

JavaScriptオブジェクトである引数を指定してajax_command_invoke（）を使用する方法

AJAXリクエストから戻るときにajax_command_invoke()を使用してjQuery UI Droppableを有効にします。

JavaScriptコンソールから次のコマンドを実行すると、jQuery UI Droppableが適切に有効になります。

jQuery('.elements-to-make-droppable').droppable({
  drop: function( event, ui ) {
    jQuery( this )
      .addClass( "ui-state-highlight" )
  }
});

ただし、このAJAXコールバックからこのコマンドを返そうとすると：

$commands = array();
$commands[] = ajax_command_invoke('.elements-to-make-droppable', 'droppable', array('{
  drop: function( event, ui ) {
    jQuery( this )
      .addClass( "ui-state-highlight" )
  }
}'));
return array('#type' => 'ajax', '#commands' => $commands);

...動作しません。

これはどうすればいいですか？

7ajaxjavascript
1
smokris

droppable()を呼び出す小さなjQueryプラグインを作成し、ajax_command_invoke()を使用してプラグインを呼び出すことで、これを解決しました。

PHPページを作成するコードに、私は追加しました：

drupal_add_js(drupal_get_path('module', 'my_module') . '/my_module.js');

my_module.js、 追加した：

jQuery.fn.my_module_make_droppable = function() {
  jQuery(this).droppable({
    drop: function(event, ui) {
      jQuery(this).addClass( "ui-state-highlight" );
    }
  });
}

そして、私のAJAXコールバックは今：

$commands = array();
$commands[] = ajax_command_invoke('.elements-to-make-droppable', 'my_module_make_droppable');
return array('#type' => 'ajax', '#commands' => $commands);
2
smokris

参照： https://drupal.stackexchange.com/a/73738/17676 -新しいjQuery関数を作成する代わりに、イベントとトリガーを使用することもできます。

1
starlocke