How To Get A Return Value From A Jquery Widget Function

I have write a jquery widget with a public function $.widget('UI.MyWidget', { vars: { retvalue:0 }, options: { Orgintop:

Solution 1:

You can set getControlValue at .data() of this.element, return named function from set .data() with this set to widget which is callable by referencing .data() of element where widget is set.

$.widget("UI.MyWidget", {
  vars: {
    retvalue: 0
  },
  options: {
    Orgintop: 0,
    Orginleft: 0,
    Orginheight: 0,
    Orginwidth: 0
  },
  _create: function() {
    this.element.data("_getControlValue", this.getControlValue());
    // this._renderElement();
  },
  getControlValue: function() {
    var fn = function() {
      this.vars.retvalue = 45 + 5;
      return this.vars.retvalue;
    }
    return fn.bind(this)
  }
});

var widget = $("div").MyWidget();
console.log(widget.data()._getControlValue());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js" integrity="sha256-eGE6blurk5sHj+rmkfsGYeKyZx3M4bG+ZlFyA7Kns7E=" crossorigin="anonymous"></script>
<div></div>