Answers.Body: <p>As of Craft 2.4.2688:</p>
  
  <blockquote>
    <p>It is now possible to access <code>Craft.BaseElementSelectInput</code> objects
    from their container elements, via <code>.data('elementSelect')</code>.</p>
  </blockquote>
  
  <p>On select element:</p>
  
  <pre><code>$('#theElementSelectField').data('elementSelect').on('selectElements', function(e) {
      console.log(e); // Take a look
      // Do stuff here when elements are selected...
  });
  </code></pre>
  
  <p>On remove element:</p>
  
  <pre><code>$('#theElementSelectField').data('elementSelect').on('removeElements', function(e) {
      console.log(e);
      // Do stuff here when elements are removed...
  });
  </code></pre>
  
  <p>NB. If you are using the Craft macros to build the select element inputs, make sure your javascript is run after craft has done its magic with the input field.</p>
  
  <hr>
  
  <p>Thanks to Brandon Kelly &amp; Lindsey D</p>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-09-28T20:54:06.880Z
Answers.Text: Hadn't caught this – awesome!
Answers.UserDisplayName: Mats Mikkel Rummelhoff
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-09-28T13:29:54.653Z
Answers.LastActivityDate: 2015-09-28T13:29:54.653Z
Answers.UserDisplayName: Sam Hibberd
Answers.Body: <p><strong>Edit</strong> 
  For Craft installs 2.4.2688 or later, see Sam Hibberd's answer!</p>
  
  <hr>
  
  <p>@AaronBerkowitz is correct – unfortunately there's no way, currently.</p>
  
  <p><a href="https://gist.github.com/mmikkel/e24e379faad6fd3fbde5" rel="nofollow">Here's a workaround</a>, which uses <code>setInterval</code> to poll the elementselects in the DOM for changes. If any of the elementselects have changed, the container will trigger a custom <code>elementselectchange</code> event, which you can listen for:</p>
  
  <pre><code>$('.elementselect').on('elementselectchange', onElementSelectChange);
  </code></pre>
  
  <p>This is hardly an elegant or best practice solution, but in this case it's the best I can think of. Instead of polling it might be better to bind a click listener to the elementselect's add/delete buttons, however as elementselects can exist in so many different contexts, writing a reliable event listener is really tricky. In any case, should P&amp;T add a "elementChange" event or the like down the line, you'd likely be able to rip out the poller and keep your event handler.</p>
  
  <p>The code in the Gist can be copy pasted as-is to a JS file and added to the Craft CP like this (in your plugin's main class):</p>
  
  <pre><code>if (!craft()-&gt;request-&gt;isAjaxRequest() &amp;&amp; craft()-&gt;request-&gt;isCpRequest())
  {
      craft()-&gt;templates-&gt;includeJsResource('myplugin/js/elementSelectChange.js');
  }
  </code></pre>
  
  <p>The test for AJAX requests is important, if you leave it out the script will execute every time an Assets modal opens etc, which will make your event handlers fire multiple times.</p>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-09-25T21:16:25.010Z
Answers.Text: This is possible without a workaround, I'm currently away but will post the detailed solution over the weekend.
Answers.UserDisplayName: Sam Hibberd
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-09-25T21:17:06.163Z
Answers.Text: @SamHibberd Awesome!
Answers.UserDisplayName: Mats Mikkel Rummelhoff
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-09-24T08:38:41.560Z
Answers.LastActivityDate: 2015-09-28T20:55:57.067Z
Answers.LastEditDate: 2015-09-28T20:55:57.067Z
Answers.UserDisplayName: Mats Mikkel Rummelhoff
Body: <p>Is there any way to access an event, and trigger some function, when an element is added / removed with the Craft Element Selector logic available in Garnish?</p>
  
  <p>I am working on a custom field type and to keep everything tidy I only want to show a set of options when an asset is selected. </p>
  
  <p><a href="https://i.sstatic.net/HWEN1.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/HWEN1.png" alt="Example"></a></p>
  
Comments.ContentLicense: CC BY-SA 3.0
Comments.CreationDate: 2015-09-24T03:45:40.967Z
Comments.Text: There is no built-in way to tap into these front-end events. I recommend adding this as a [feature request](http://feedback.buildwithcraft.com/forums/285221-feature-requests)!
Comments.UserDisplayName: Aaron Berkowitz
Tags: <plugin-development><javascript><garnish>
Title: Access add and remove events with the Craft Element Selector?
ThreadText: # Access add and remove events with the Craft Element Selector?
  
  (Asked by: username_0 on 2015-09-23)
  
  Is there any way to access an event, and trigger some function, when an element is added / removed with the Craft Element Selector logic available in Garnish?
  
  I am working on a custom field type and to keep everything tidy I only want to show a set of options when an asset is selected.
  
  [![Example](https://i.sstatic.net/HWEN1.png)](https://i.sstatic.net/HWEN1.png)
  
  **Tags:** plugin-development, javascript, garnish
  
  > **Comments:**
  > **username_1**: There is no built-in way to tap into these front-end events. I recommend adding this as a [feature request](http://feedback.buildwithcraft.com/forums/285221-feature-requests)!  
  
  ---
  
  ## 2 answers
  
  ### Answer by username_0 on 2015-09-28. Score: 7
  
  As of Craft 2.4.2688:
  
  > It is now possible to access `Craft.BaseElementSelectInput` objects
  > from their container elements, via `.data('elementSelect')`.
  
  On select element:
  
  ```
  $('#theElementSelectField').data('elementSelect').on('selectElements', function(e) {
      console.log(e); // Take a look
      // Do stuff here when elements are selected...
  });
  
  ```
  
  On remove element:
  
  ```
  $('#theElementSelectField').data('elementSelect').on('removeElements', function(e) {
      console.log(e);
      // Do stuff here when elements are removed...
  });
  
  ```
  
  NB. If you are using the Craft macros to build the select element inputs, make sure your javascript is run after craft has done its magic with the input field.
  
  ---
  
  Thanks to Brandon Kelly & Lindsey D
  
  > **Comments:**
  > **username_2**: Hadn't caught this – awesome!  
  
  ---
  
  ### Answer by username_2 on 2015-09-24. Score: 2
  
  **Edit**
  For Craft installs 2.4.2688 or later, see Sam username_0's answer!
  
  ---
  
  @username_1 is correct – unfortunately there's no way, currently.
  
  [Here's a workaround](https://gist.github.com/mmikkel/e24e379faad6fd3fbde5), which uses `setInterval` to poll the elementselects in the DOM for changes. If any of the elementselects have changed, the container will trigger a custom `elementselectchange` event, which you can listen for:
  
  ```
  $('.elementselect').on('elementselectchange', onElementSelectChange);
  
  ```
  
  This is hardly an elegant or best practice solution, but in this case it's the best I can think of. Instead of polling it might be better to bind a click listener to the elementselect's add/delete buttons, however as elementselects can exist in so many different contexts, writing a reliable event listener is really tricky. In any case, should P&T add a "elementChange" event or the like down the line, you'd likely be able to rip out the poller and keep your event handler.
  
  The code in the Gist can be copy pasted as-is to a JS file and added to the Craft CP like this (in your plugin's main class):
  
  ```
  if (!craft()->request->isAjaxRequest() && craft()->request->isCpRequest())
  {
      craft()->templates->includeJsResource('myplugin/js/elementSelectChange.js');
  }
  
  ```
  
  The test for AJAX requests is important, if you leave it out the script will execute every time an Assets modal opens etc, which will make your event handlers fire multiple times.
  
  > **Comments:**
  > **username_0**: This is possible without a workaround, I'm currently away but will post the detailed solution over the weekend.  
  > **username_2**: @username_0 Awesome!  
  
  ---
  
  