<p>Not really an answer to your question but some thoughts..
I've tried your code with my form builder and I noticed two things (the first is really obvious) </p>

<ol>
<li><p>When you overwrite the default <code>init</code> function everything will (of course) break because all the important staff happens there, you can make your calls in the <code>afterInit()</code> function. <a href="https://github.com/craftcms/cms/blob/develop/src/web/assets/cp/dist/js/Craft.js#L3573" rel="nofollow noreferrer">Craft.js Line 3573</a></p>

<pre><code>// Give sub-classes a chance to do post-initialization stuff here
this.afterInit();
</code></pre></li>
<li><p>This function handles the sort for Craft. <code>Craft.js line 2721</code> <a href="https://github.com/craftcms/cms/blob/develop/src/web/assets/cp/dist/js/Craft.js#L2721" rel="nofollow noreferrer">link to git</a></p>

<pre><code>setStoredSortOptionsForSource: function() {
    // Default to whatever's first
    this.setSortAttribute();
    this.setSortDirection('asc');

    var sortAttr = this.getSelectedSourceState('order'),
        sortDir = this.getSelectedSourceState('sort');

    if (!sortAttr) {
        // Get the default
        sortAttr = this.getDefaultSort();

        if (Garnish.isArray(sortAttr)) {
            sortDir = sortAttr[1];
            sortAttr = sortAttr[0];
        }
    }

    if (sortDir !== 'asc' &amp;&amp; sortDir !== 'desc') {
        sortDir = 'asc';
    }

    this.setSortAttribute(sortAttr);
    this.setSortDirection(sortDir);
},
</code></pre>

<p>The important part is: <code>var sortAttr = this.getSelectedSourceState('order'),</code> (<a href="https://github.com/craftcms/cms/blob/develop/src/web/assets/cp/dist/js/Craft.js#L2726" rel="nofollow noreferrer">line 2726</a>) and since <code>sortAttr</code> (at least for me) was never null in my tests - the <code>sortAttr = this.getDefaultSort();</code> is not triggert. This is because Craft caches the sort order for the user but I don't know how/when this happens. However: when I overwrite <a href="https://github.com/craftcms/cms/blob/develop/src/web/assets/cp/dist/js/Craft.js#L2729" rel="nofollow noreferrer">line 2729</a></p>

<pre><code>if (true || !sortAttr) {
    // Get the default
    sortAttr = this.getDefaultSort();

    if (Garnish.isArray(sortAttr)) {
        sortDir = sortAttr[1];
        sortAttr = sortAttr[0];
    }
}
</code></pre></li>
</ol>

<p>And use </p>

<pre><code>getDefaultSort: function() {
    return ['dateCreated', 'asc'];
}
</code></pre>

<p>I was able to change the default sort. Hope it helps a little bit</p>

<p><strong>Note:</strong> this will break the default Craft caching. Normally the default sort options runs only once, after that is keeps the sort order that the user specified. You could overwrite the function for your tests and remove the always true condition when it goes live for a reliable way to get your function triggert. </p>

CC BY-SA 3.0
2018-01-01T10:10:56.110Z
2018-01-01T10:31:21.643Z
2018-01-01T10:31:21.643Z
Robin Schambach
<p>I have a custom Element and need to modify the Element Index page. I'm attempting to extend <code>Craft.BaseElementIndex</code> and register the extended class on my Element Index Page. I'm working on a plugin for Craft 3. Something similar seems to be working fine in Craft 2, but I'm not sure if this is really a version issue or just an issue with my implementation.</p>

<p>Something like this:</p>

<pre><code>(function($){
    Craft.MyCustomPlugin.MyElementIndex = Craft.BaseElementIndex.extend({
      getDefaultSort: function() {
          return ['elements.dateCreated', 'desc'];
      }
    });

    Craft.registerElementIndexClass('mynamespace\\elements\\MyElement', Craft.MyCustomPlugin.MyElementIndex);
})(jQuery);
</code></pre>

<p>The javascript file seems to load however doesn't have any effect on the Element Index page.</p>

<p>If I add an <code>init</code> method with a <code>console.log()</code> statement, a message gets logged but then the results on the Element Index page don't load anymore.</p>

<pre><code>(function($){
  Craft.MyCustomPlugin.MyElementIndex = Craft.BaseElementIndex.extend({
    init: function() {
      console.log('Who cooks for you?');
    },
    getDefaultSort: function() {
        return ['elements.dateCreated', 'desc'];
    }
  });

  Craft.registerElementIndexClass('mynamespace\\elements\\MyElement', Craft.MyCustomPlugin.MyElementIndex);
})(jQuery);
</code></pre>

<p>Any ideas on what I'm missing?</p>

CC BY-SA 3.0
2018-01-09T07:36:59.360Z
Would you mind sharing your solution if my answer didn't solve the problem? I'm interested how you were able to do it - maybe I'll need it in the future.
Robin Schambach
CC BY-SA 3.0
2018-01-09T14:36:48.657Z
I'll try to circle back when I test things out, Robin. Haven't had a chance to dig into this further yet. I appreciate your thoughts.
Ben Parizek
<javascript><elementtype>
How to extend Craft.BaseElementIndex for a custom Element Type
# How to extend Craft.BaseElementIndex for a custom Element Type

(Asked by: username_0 on 2017-12-31)

I have a custom Element and need to modify the Element Index page. I'm attempting to extend Craft.BaseElementIndex and register the extended class on my Element Index Page. I'm working on a plugin for Craft 3. Something similar seems to be working fine in Craft 2, but I'm not sure if this is really a version issue or just an issue with my implementation.
Something like this:
(function($){
    Craft.MyCustomPlugin.MyElementIndex = Craft.BaseElementIndex.extend({
      getDefaultSort: function() {
          return ['elements.dateCreated', 'desc'];
      }
    });

    Craft.registerElementIndexClass('mynamespace\\elements\\MyElement', Craft.MyCustomPlugin.MyElementIndex);
})(jQuery);

The javascript file seems to load however doesn't have any effect on the Element Index page.
If I add an init method with a console.log() statement, a message gets logged but then the results on the Element Index page don't load anymore.
(function($){
  Craft.MyCustomPlugin.MyElementIndex = Craft.BaseElementIndex.extend({
    init: function() {
      console.log('Who cooks for you?');
    },
    getDefaultSort: function() {
        return ['elements.dateCreated', 'desc'];
    }
  });

  Craft.registerElementIndexClass('mynamespace\\elements\\MyElement', Craft.MyCustomPlugin.MyElementIndex);
})(jQuery);

Any ideas on what I'm missing?

**Tags:** javascript, elementtype
> **Comments:**
> **username_1**: Would you mind sharing your solution if my answer didn't solve the problem? I'm interested how you were able to do it - maybe I'll need it in the future.  
> **username_0**: I'll try to circle back when I test things out, Robin. Haven't had a chance to dig into this further yet. I appreciate your thoughts.  

---

## 1 answers

### Answer by username_1 on 2018-01-01. Score: 1

Not really an answer to your question but some thoughts..
I've tried your code with my form builder and I noticed two things (the first is really obvious) 

When you overwrite the default init function everything will (of course) break because all the important staff happens there, you can make your calls in the afterInit() function. Craft.js Line 3573
// Give sub-classes a chance to do post-initialization stuff here
this.afterInit();

This function handles the sort for Craft. Craft.js line 2721 link to git
setStoredSortOptionsForSource: function() {
    // Default to whatever's first
    this.setSortAttribute();
    this.setSortDirection('asc');

    var sortAttr = this.getSelectedSourceState('order'),
        sortDir = this.getSelectedSourceState('sort');

    if (!sortAttr) {
        // Get the default
        sortAttr = this.getDefaultSort();

        if (Garnish.isArray(sortAttr)) {
            sortDir = sortAttr[1];
            sortAttr = sortAttr[0];
        }
    }

    if (sortDir !== 'asc' && sortDir !== 'desc') {
        sortDir = 'asc';
    }

    this.setSortAttribute(sortAttr);
    this.setSortDirection(sortDir);
},

The important part is: var sortAttr = this.getSelectedSourceState('order'), (line 2726) and since sortAttr (at least for me) was never null in my tests - the sortAttr = this.getDefaultSort(); is not triggert. This is because Craft caches the sort order for the user but I don't know how/when this happens. However: when I overwrite line 2729
if (true || !sortAttr) {
    // Get the default
    sortAttr = this.getDefaultSort();

    if (Garnish.isArray(sortAttr)) {
        sortDir = sortAttr[1];
        sortAttr = sortAttr[0];
    }
}


And use 
getDefaultSort: function() {
    return ['dateCreated', 'asc'];
}

I was able to change the default sort. Hope it helps a little bit
Note: this will break the default Craft caching. Normally the default sort options runs only once, after that is keeps the sort order that the user specified. You could overwrite the function for your tests and remove the always true condition when it goes live for a reliable way to get your function triggert.


---

