Select field that does an AJAX

[bilogic]

Hi,

I have a heavily customized SlickGrid based off from mleibman.

One of heavily stuff was implementing a dropdown column that does a database lookup, i.e. a select that list its values based on a lookup back to the database table.

I looked around but thought it is easier and faster to ask, Is there anything similar in this repo? Thank you.

[6pac]

How about this one?
http://6pac.github.io/SlickGrid/examples/example-select2-editor.html

[bilogic]

Ah ok, I think it's similar to where I first found it. The issue is some tables have huge records, loading them all doesn't make sense, what helped was a search on the database. Maybe we need a select3 🤣

[bilogic]

I just googled, will this https://select2.org/data-sources/ajax work in http://6pac.github.io/SlickGrid/examples/example-select2-editor.html ?

[6pac]

Certainly. However you'd need to modify the editor to work with the Select2 Ajax loading code. You could put together a new example and submit it to the repo.

[bilogic]

Sure, let me give it shot. Let's leave this issue open first. Thank you.

[bilogic]

@6pac I actually finished half the example, but facing an old issue (and I'm not keen to re-visit my old messy code).

Let's assume that we have 100k rows of dataSource, which makes it not feasible to send via HTML entirely.

What is the best way in your opinion to provide the formatter with the proper values when loading the HTML for the first time?

[6pac]

They approach I have taken in the past is to store the data source for the dropdown (a DataView or a js object) as a member of the column object. You could do this for both AJAX and non-AJAX datasources, the only difference being that the AJAZ datasource would have rows dynamically added to it by code.

…

_____ From: bilogic [mailto:notifications@github.com] Sent: Thursday, 18 February 2021 3:01 AM To: 6pac/SlickGrid Cc: Ben McIntyre; Mention Subject: Re: [6pac/SlickGrid] Select field that does an AJAX (#578) @6pac <https://github.com/6pac> I actually finished half the example, but facing an old issue (and I'm not keen to re-visit my old messy code). What is the best way in your opinion to provide the formatter with the proper values when loading the HTML for the first time? - You are receiving this because you were mentioned. Reply to this email directly, view <#578 (comment)> it on GitHub, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AABDEVKMJLQHXFG6FQALBRDS7 P4NXANCNFSM4XX5YHYQ> . <https://github.com/notifications/beacon/AABDEVKAXZU4OG7K4UTTTD3S7P4NXA5CNFS M4XX5YHY2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOF2ENZFA .gif>

[ghiscoding]

The other option is to use jQueryUI Autocomplete since jQueryUI is a dependency anyway but that would work only for 1 value not multiple.

I'm moving this issue as a "Discussion" (the new GitHub tab) since this is not an issue but really a Discussion

[bilogic]

Thanks @ghiscoding

I'm not really able to connect the approaches to the problem.
Perhaps let me elaborate on the problem I see so we are all on the same page.

For the a select2, I see that we have

• ID
• Value
• Formatted Value

Normally, what we want to edit is the Value, or rather, we change the ID to "edit" the Value, or in some cases, we add a new ID-Value pair, and change to that new ID.

When we load the example, this is basically what happens:

1. JS loads all ID-Value pairs
2. Formatter shows Value or Formatted Value based on ID
3. However, .1 is likely to have performance issues if all pairs >1 million
4. Next issue is, we can't do .2 if we don't have all the pairs loaded
5. Doing an AJAX for every field in each SlickGrid entry is even worse

I could go on about my thought process, but boiled down, I think the issue lies with Formatter, is there a way for Formatter to display the formatted value efficiently without relying on ID? (While still having the ability to edit, which requires the ID)

Slick.Data.RemoteModel is also affected by this, so I feel we should consider them together.

I'm more than happy to code the example, but I think I could really use your expertise/help to architect this. Thank you.

[6pac]

If you looke at example-select2-editor.html, the datasource for the lookup is js object countryIsoAndNameList. This is stored against the column in the 'datasource' property:

  var columns = [
    {id: "title", name: "Title", field: "title", width: 80, cssClass: "cell-title", editor: Slick.Editors.Text},
      {id: "duration", name: "Duration", field: "duration", editor: Slick.Editors.Text},
      {id: "start", name: "Start", field: "start", minWidth: 60, editor: Slick.Editors.Date},
      {id: "finish", name: "Finish", field: "finish", minWidth: 60, editor: Slick.Editors.Date},
      {id: "CountryOfOrigin", name: "Country Of Origin", field: "country", minWidth: 200, formatter: Select2Formatter, 
	editor: Select2Editor, dataSource: countryIsoAndNameList }
  ];

and uses select2Formatter:

function Select2Formatter(row, cell, value, columnDef, dataContext) {
    return columnDef.dataSource[value] || '-';
}	

What you want is to tweak the formatter so it checks for a local lookup, then gets AJAX of that fails, so somthing like:

function Select2Formatter(row, cell, value, columnDef, dataContext) {
    var rtn = typeof columnDef.dataSource[value];
    if (typeof rtn !== 'undefined') { return rtn; }
    // retrieve value for ID 'value' into rtn using AJAX
    ..
    return rtn;
}	

[bilogic]

@6pac

ok, but I think that will still incur high overheads (i.e. a lot of AJAX calls) in Select2Formatter especially if we are talking about 1M possible values.

I'm thinking, is there a way for value to be a JSON object/string such as {"id" => 1, "value" => "value to be displayed"}?

function Select2Formatter(row, cell, value, columnDef, dataContext) {
    return value.value || '-';
}

[bilogic]

I have nightmares just thinking of that old code. I will see what I can dig out, but to set your expectation, much of it is heavily customized and bear no resemblance to decent JSON.

Meanwhile the gist of how it worked is:

1. The grid first query for the column definitions via AJAX, e.g. column definitions for the table skus
2. The response also contains a URL to another endpoint, grid will query it for skus records say 30 of them, and perform further querying via infinite scrolling (this is handled by SlickGrid's RemoteData)
3. Thinking back, my bad UI experiences always came from the dropdowns, i.e. select2
4. In the case of skus, it has 6 columns, all of which look up to the table options

Together with this issue, my grid also had a type of column which allows upload and displaying of images in each cell of the column. I'm mentioning this because I'm assessing if earlier mentioned JSON approach will also scale to handle it.

Going further, I thought that if we could find some solution to make https://bilogic.github.io/SlickGrid/examples/example-select3.html work with the GitHub API, it will probably address most of the concerns I raised. This will probably be easier to work on instead of bringing my old JSON examples back to life.

[6pac]

I'm not interested in code behind, just the interface. I just need the input and output.

For example, with the Git API, the call is

 https://api.github.com/search/repositories?q=repoName&page=2

where q is the repo search string, and page is the page number.
It returns

{
  "id": 1296269,
  "node_id": "MDEwOlJlcG9zaXRvcnkxMjk2MjY5",
  "name": "Hello-World",
  "full_name": "octocat/Hello-World",
  "owner": {
    "login": "octocat",
    "id": 1,
    "node_id": "MDQ6VXNlcjE=",
    "avatar_url": "https://github.com/images/error/octocat_happy.gif",
    "gravatar_id": "",
    "url": "https://api.github.com/users/octocat",
    "html_url": "https://github.com/octocat",
    "followers_url": "https://api.github.com/users/octocat/followers",
    "following_url": "https://api.github.com/users/octocat/following{/other_user}",
    "gists_url": "https://api.github.com/users/octocat/gists{/gist_id}",
    "starred_url": "https://api.github.com/users/octocat/starred{/owner}{/repo}",
    "subscriptions_url": "https://api.github.com/users/octocat/subscriptions",
    "organizations_url": "https://api.github.com/users/octocat/orgs",
    "repos_url": "https://api.github.com/users/octocat/repos",
    "events_url": "https://api.github.com/users/octocat/events{/privacy}",
    "received_events_url": "https://api.github.com/users/octocat/received_events",
    "type": "User",
    "site_admin": false
  },
  "private": false,
  "html_url": "https://github.com/octocat/Hello-World",
  "description": "This your first repo!",
  "fork": false,
  "url": "https://api.github.com/repos/octocat/Hello-World",
  "archive_url": "https://api.github.com/repos/octocat/Hello-World/{archive_format}{/ref}",
  "assignees_url": "https://api.github.com/repos/octocat/Hello-World/assignees{/user}",
  "blobs_url": "https://api.github.com/repos/octocat/Hello-World/git/blobs{/sha}",
  "branches_url": "https://api.github.com/repos/octocat/Hello-World/branches{/branch}",
  "collaborators_url": "https://api.github.com/repos/octocat/Hello-World/collaborators{/collaborator}",
  "comments_url": "https://api.github.com/repos/octocat/Hello-World/comments{/number}",
  "commits_url": "https://api.github.com/repos/octocat/Hello-World/commits{/sha}",
  "compare_url": "https://api.github.com/repos/octocat/Hello-World/compare/{base}...{head}",
  "contents_url": "https://api.github.com/repos/octocat/Hello-World/contents/{+path}",
  "contributors_url": "https://api.github.com/repos/octocat/Hello-World/contributors",
  "deployments_url": "https://api.github.com/repos/octocat/Hello-World/deployments",
  "downloads_url": "https://api.github.com/repos/octocat/Hello-World/downloads",
  "events_url": "https://api.github.com/repos/octocat/Hello-World/events",
  "forks_url": "https://api.github.com/repos/octocat/Hello-World/forks",
  "git_commits_url": "https://api.github.com/repos/octocat/Hello-World/git/commits{/sha}",
  "git_refs_url": "https://api.github.com/repos/octocat/Hello-World/git/refs{/sha}",
  "git_tags_url": "https://api.github.com/repos/octocat/Hello-World/git/tags{/sha}",
  "git_url": "git:github.com/octocat/Hello-World.git",
  "issue_comment_url": "https://api.github.com/repos/octocat/Hello-World/issues/comments{/number}",
  "issue_events_url": "https://api.github.com/repos/octocat/Hello-World/issues/events{/number}",
  "issues_url": "https://api.github.com/repos/octocat/Hello-World/issues{/number}",
  "keys_url": "https://api.github.com/repos/octocat/Hello-World/keys{/key_id}",
  "labels_url": "https://api.github.com/repos/octocat/Hello-World/labels{/name}",
  "languages_url": "https://api.github.com/repos/octocat/Hello-World/languages",
  "merges_url": "https://api.github.com/repos/octocat/Hello-World/merges",
  "milestones_url": "https://api.github.com/repos/octocat/Hello-World/milestones{/number}",
  "notifications_url": "https://api.github.com/repos/octocat/Hello-World/notifications{?since,all,participating}",
  "pulls_url": "https://api.github.com/repos/octocat/Hello-World/pulls{/number}",
  "releases_url": "https://api.github.com/repos/octocat/Hello-World/releases{/id}",
  "ssh_url": "git@github.com:octocat/Hello-World.git",
  "stargazers_url": "https://api.github.com/repos/octocat/Hello-World/stargazers",
  "statuses_url": "https://api.github.com/repos/octocat/Hello-World/statuses/{sha}",
  "subscribers_url": "https://api.github.com/repos/octocat/Hello-World/subscribers",
  "subscription_url": "https://api.github.com/repos/octocat/Hello-World/subscription",
  "tags_url": "https://api.github.com/repos/octocat/Hello-World/tags",
  "teams_url": "https://api.github.com/repos/octocat/Hello-World/teams",
  "trees_url": "https://api.github.com/repos/octocat/Hello-World/git/trees{/sha}",
  "clone_url": "https://github.com/octocat/Hello-World.git",
  "mirror_url": "git:git.example.com/octocat/Hello-World",
  "hooks_url": "https://api.github.com/repos/octocat/Hello-World/hooks",
  "svn_url": "https://svn.github.com/octocat/Hello-World",
  "homepage": "https://github.com",
  "license": {
    "key": "mit",
    "name": "MIT License",
    "url": "https://api.github.com/licenses/mit",
    "spdx_id": "MIT",
    "node_id": "MDc6TGljZW5zZW1pdA==",
    "html_url": "https://github.com/licenses/mit"
  },
  "language": null,
  "forks_count": 9,
  "forks": 9,
  "stargazers_count": 80,
  "watchers_count": 80,
  "watchers": 80,
  "size": 108,
  "default_branch": "master",
  "open_issues_count": 0,
  "open_issues": 0,
  "is_template": false,
  "topics": [
    "octocat",
    "atom",
    "electron",
    "api"
  ],
  "has_issues": true,
  "has_projects": true,
  "has_wiki": true,
  "has_pages": false,
  "has_downloads": true,
  "archived": false,
  "disabled": false,
  "visibility": "public",
  "pushed_at": "2011-01-26T19:06:43Z",
  "created_at": "2011-01-26T19:01:12Z",
  "updated_at": "2011-01-26T19:14:43Z",
  "permissions": {
    "pull": true,
    "push": false,
    "admin": false
  },
  "allow_rebase_merge": true,
  "template_repository": {
    "id": 1296269,
    "node_id": "MDEwOlJlcG9zaXRvcnkxMjk2MjY5",
    "name": "Hello-World-Template",
    "full_name": "octocat/Hello-World-Template",
    "owner": {
      "login": "octocat",
      "id": 1,
      "node_id": "MDQ6VXNlcjE=",
      "avatar_url": "https://github.com/images/error/octocat_happy.gif",
      "gravatar_id": "",
      "url": "https://api.github.com/users/octocat",
      "html_url": "https://github.com/octocat",
      "followers_url": "https://api.github.com/users/octocat/followers",
      "following_url": "https://api.github.com/users/octocat/following{/other_user}",
      "gists_url": "https://api.github.com/users/octocat/gists{/gist_id}",
      "starred_url": "https://api.github.com/users/octocat/starred{/owner}{/repo}",
      "subscriptions_url": "https://api.github.com/users/octocat/subscriptions",
      "organizations_url": "https://api.github.com/users/octocat/orgs",
      "repos_url": "https://api.github.com/users/octocat/repos",
      "events_url": "https://api.github.com/users/octocat/events{/privacy}",
      "received_events_url": "https://api.github.com/users/octocat/received_events",
      "type": "User",
      "site_admin": false
    },
    "private": false,
    "html_url": "https://github.com/octocat/Hello-World-Template",
    "description": "This your first repo!",
    "fork": false,
    "url": "https://api.github.com/repos/octocat/Hello-World-Template",
    "archive_url": "https://api.github.com/repos/octocat/Hello-World-Template/{archive_format}{/ref}",
    "assignees_url": "https://api.github.com/repos/octocat/Hello-World-Template/assignees{/user}",
    "blobs_url": "https://api.github.com/repos/octocat/Hello-World-Template/git/blobs{/sha}",
    "branches_url": "https://api.github.com/repos/octocat/Hello-World-Template/branches{/branch}",
    "collaborators_url": "https://api.github.com/repos/octocat/Hello-World-Template/collaborators{/collaborator}",
    "comments_url": "https://api.github.com/repos/octocat/Hello-World-Template/comments{/number}",
    "commits_url": "https://api.github.com/repos/octocat/Hello-World-Template/commits{/sha}",
    "compare_url": "https://api.github.com/repos/octocat/Hello-World-Template/compare/{base}...{head}",
    "contents_url": "https://api.github.com/repos/octocat/Hello-World-Template/contents/{+path}",
    "contributors_url": "https://api.github.com/repos/octocat/Hello-World-Template/contributors",
    "deployments_url": "https://api.github.com/repos/octocat/Hello-World-Template/deployments",
    "downloads_url": "https://api.github.com/repos/octocat/Hello-World-Template/downloads",
    "events_url": "https://api.github.com/repos/octocat/Hello-World-Template/events",
    "forks_url": "https://api.github.com/repos/octocat/Hello-World-Template/forks",
    "git_commits_url": "https://api.github.com/repos/octocat/Hello-World-Template/git/commits{/sha}",
    "git_refs_url": "https://api.github.com/repos/octocat/Hello-World-Template/git/refs{/sha}",
    "git_tags_url": "https://api.github.com/repos/octocat/Hello-World-Template/git/tags{/sha}",
    "git_url": "git:github.com/octocat/Hello-World-Template.git",
    "issue_comment_url": "https://api.github.com/repos/octocat/Hello-World-Template/issues/comments{/number}",
    "issue_events_url": "https://api.github.com/repos/octocat/Hello-World-Template/issues/events{/number}",
    "issues_url": "https://api.github.com/repos/octocat/Hello-World-Template/issues{/number}",
    "keys_url": "https://api.github.com/repos/octocat/Hello-World-Template/keys{/key_id}",
    "labels_url": "https://api.github.com/repos/octocat/Hello-World-Template/labels{/name}",
    "languages_url": "https://api.github.com/repos/octocat/Hello-World-Template/languages",
    "merges_url": "https://api.github.com/repos/octocat/Hello-World-Template/merges",
    "milestones_url": "https://api.github.com/repos/octocat/Hello-World-Template/milestones{/number}",
    "notifications_url": "https://api.github.com/repos/octocat/Hello-World-Template/notifications{?since,all,participating}",
    "pulls_url": "https://api.github.com/repos/octocat/Hello-World-Template/pulls{/number}",
    "releases_url": "https://api.github.com/repos/octocat/Hello-World-Template/releases{/id}",
    "ssh_url": "git@github.com:octocat/Hello-World-Template.git",
    "stargazers_url": "https://api.github.com/repos/octocat/Hello-World-Template/stargazers",
    "statuses_url": "https://api.github.com/repos/octocat/Hello-World-Template/statuses/{sha}",
    "subscribers_url": "https://api.github.com/repos/octocat/Hello-World-Template/subscribers",
    "subscription_url": "https://api.github.com/repos/octocat/Hello-World-Template/subscription",
    "tags_url": "https://api.github.com/repos/octocat/Hello-World-Template/tags",
    "teams_url": "https://api.github.com/repos/octocat/Hello-World-Template/teams",
    "trees_url": "https://api.github.com/repos/octocat/Hello-World-Template/git/trees{/sha}",
    "clone_url": "https://github.com/octocat/Hello-World-Template.git",
    "mirror_url": "git:git.example.com/octocat/Hello-World-Template",
    "hooks_url": "https://api.github.com/repos/octocat/Hello-World-Template/hooks",
    "svn_url": "https://svn.github.com/octocat/Hello-World-Template",
    "homepage": "https://github.com",
    "language": null,
    "forks": 9,
    "forks_count": 9,
    "stargazers_count": 80,
    "watchers_count": 80,
    "watchers": 80,
    "size": 108,
    "default_branch": "master",
    "open_issues": 0,
    "open_issues_count": 0,
    "is_template": true,
    "license": {
      "key": "mit",
      "name": "MIT License",
      "url": "https://api.github.com/licenses/mit",
      "spdx_id": "MIT",
      "node_id": "MDc6TGljZW5zZW1pdA==",
      "html_url": "https://api.github.com/licenses/mit"
    },
    "topics": [
      "octocat",
      "atom",
      "electron",
      "api"
    ],
    "has_issues": true,
    "has_projects": true,
    "has_wiki": true,
    "has_pages": false,
    "has_downloads": true,
    "archived": false,
    "disabled": false,
    "visibility": "public",
    "pushed_at": "2011-01-26T19:06:43Z",
    "created_at": "2011-01-26T19:01:12Z",
    "updated_at": "2011-01-26T19:14:43Z",
    "permissions": {
      "admin": false,
      "push": false,
      "pull": true
    },
    "allow_rebase_merge": true,
    "temp_clone_token": "ABTLWHOULUVAXGTRYU7OC2876QJ2O",
    "allow_squash_merge": true,
    "delete_branch_on_merge": true,
    "allow_merge_commit": true,
    "subscribers_count": 42,
    "network_count": 0
  },
  "temp_clone_token": "ABTLWHOULUVAXGTRYU7OC2876QJ2O",
  "allow_squash_merge": true,
  "delete_branch_on_merge": true,
  "allow_merge_commit": true,
  "subscribers_count": 42,
  "network_count": 0,
  "organization": {
    "login": "octocat",
    "id": 1,
    "node_id": "MDQ6VXNlcjE=",
    "avatar_url": "https://github.com/images/error/octocat_happy.gif",
    "gravatar_id": "",
    "url": "https://api.github.com/users/octocat",
    "html_url": "https://github.com/octocat",
    "followers_url": "https://api.github.com/users/octocat/followers",
    "following_url": "https://api.github.com/users/octocat/following{/other_user}",
    "gists_url": "https://api.github.com/users/octocat/gists{/gist_id}",
    "starred_url": "https://api.github.com/users/octocat/starred{/owner}{/repo}",
    "subscriptions_url": "https://api.github.com/users/octocat/subscriptions",
    "organizations_url": "https://api.github.com/users/octocat/orgs",
    "repos_url": "https://api.github.com/users/octocat/repos",
    "events_url": "https://api.github.com/users/octocat/events{/privacy}",
    "received_events_url": "https://api.github.com/users/octocat/received_events",
    "type": "Organization",
    "site_admin": false
  },
  "parent": {
    "id": 1296269,
    "node_id": "MDEwOlJlcG9zaXRvcnkxMjk2MjY5",
    "name": "Hello-World",
    "full_name": "octocat/Hello-World",
    "owner": {
      "login": "octocat",
      "id": 1,
      "node_id": "MDQ6VXNlcjE=",
      "avatar_url": "https://github.com/images/error/octocat_happy.gif",
      "gravatar_id": "",
      "url": "https://api.github.com/users/octocat",
      "html_url": "https://github.com/octocat",
      "followers_url": "https://api.github.com/users/octocat/followers",
      "following_url": "https://api.github.com/users/octocat/following{/other_user}",
      "gists_url": "https://api.github.com/users/octocat/gists{/gist_id}",
      "starred_url": "https://api.github.com/users/octocat/starred{/owner}{/repo}",
      "subscriptions_url": "https://api.github.com/users/octocat/subscriptions",
      "organizations_url": "https://api.github.com/users/octocat/orgs",
      "repos_url": "https://api.github.com/users/octocat/repos",
      "events_url": "https://api.github.com/users/octocat/events{/privacy}",
      "received_events_url": "https://api.github.com/users/octocat/received_events",
      "type": "User",
      "site_admin": false
    },
    "private": false,
    "html_url": "https://github.com/octocat/Hello-World",
    "description": "This your first repo!",
    "fork": false,
    "url": "https://api.github.com/repos/octocat/Hello-World",
    "archive_url": "https://api.github.com/repos/octocat/Hello-World/{archive_format}{/ref}",
    "assignees_url": "https://api.github.com/repos/octocat/Hello-World/assignees{/user}",
    "blobs_url": "https://api.github.com/repos/octocat/Hello-World/git/blobs{/sha}",
    "branches_url": "https://api.github.com/repos/octocat/Hello-World/branches{/branch}",
    "collaborators_url": "https://api.github.com/repos/octocat/Hello-World/collaborators{/collaborator}",
    "comments_url": "https://api.github.com/repos/octocat/Hello-World/comments{/number}",
    "commits_url": "https://api.github.com/repos/octocat/Hello-World/commits{/sha}",
    "compare_url": "https://api.github.com/repos/octocat/Hello-World/compare/{base}...{head}",
    "contents_url": "https://api.github.com/repos/octocat/Hello-World/contents/{+path}",
    "contributors_url": "https://api.github.com/repos/octocat/Hello-World/contributors",
    "deployments_url": "https://api.github.com/repos/octocat/Hello-World/deployments",
    "downloads_url": "https://api.github.com/repos/octocat/Hello-World/downloads",
    "events_url": "https://api.github.com/repos/octocat/Hello-World/events",
    "forks_url": "https://api.github.com/repos/octocat/Hello-World/forks",
    "git_commits_url": "https://api.github.com/repos/octocat/Hello-World/git/commits{/sha}",
    "git_refs_url": "https://api.github.com/repos/octocat/Hello-World/git/refs{/sha}",
    "git_tags_url": "https://api.github.com/repos/octocat/Hello-World/git/tags{/sha}",
    "git_url": "git:github.com/octocat/Hello-World.git",
    "issue_comment_url": "https://api.github.com/repos/octocat/Hello-World/issues/comments{/number}",
    "issue_events_url": "https://api.github.com/repos/octocat/Hello-World/issues/events{/number}",
    "issues_url": "https://api.github.com/repos/octocat/Hello-World/issues{/number}",
    "keys_url": "https://api.github.com/repos/octocat/Hello-World/keys{/key_id}",
    "labels_url": "https://api.github.com/repos/octocat/Hello-World/labels{/name}",
    "languages_url": "https://api.github.com/repos/octocat/Hello-World/languages",
    "merges_url": "https://api.github.com/repos/octocat/Hello-World/merges",
    "milestones_url": "https://api.github.com/repos/octocat/Hello-World/milestones{/number}",
    "notifications_url": "https://api.github.com/repos/octocat/Hello-World/notifications{?since,all,participating}",
    "pulls_url": "https://api.github.com/repos/octocat/Hello-World/pulls{/number}",
    "releases_url": "https://api.github.com/repos/octocat/Hello-World/releases{/id}",
    "ssh_url": "git@github.com:octocat/Hello-World.git",
    "stargazers_url": "https://api.github.com/repos/octocat/Hello-World/stargazers",
    "statuses_url": "https://api.github.com/repos/octocat/Hello-World/statuses/{sha}",
    "subscribers_url": "https://api.github.com/repos/octocat/Hello-World/subscribers",
    "subscription_url": "https://api.github.com/repos/octocat/Hello-World/subscription",
    "tags_url": "https://api.github.com/repos/octocat/Hello-World/tags",
    "teams_url": "https://api.github.com/repos/octocat/Hello-World/teams",
    "trees_url": "https://api.github.com/repos/octocat/Hello-World/git/trees{/sha}",
    "clone_url": "https://github.com/octocat/Hello-World.git",
    "mirror_url": "git:git.example.com/octocat/Hello-World",
    "hooks_url": "https://api.github.com/repos/octocat/Hello-World/hooks",
    "svn_url": "https://svn.github.com/octocat/Hello-World",
    "homepage": "https://github.com",
    "language": null,
    "forks_count": 9,
    "stargazers_count": 80,
    "watchers_count": 80,
    "size": 108,
    "default_branch": "master",
    "open_issues_count": 0,
    "is_template": true,
    "topics": [
      "octocat",
      "atom",
      "electron",
      "api"
    ],
    "has_issues": true,
    "has_projects": true,
    "has_wiki": true,
    "has_pages": false,
    "has_downloads": true,
    "archived": false,
    "disabled": false,
    "visibility": "public",
    "pushed_at": "2011-01-26T19:06:43Z",
    "created_at": "2011-01-26T19:01:12Z",
    "updated_at": "2011-01-26T19:14:43Z",
    "permissions": {
      "admin": false,
      "push": false,
      "pull": true
    },
    "allow_rebase_merge": true,
    "temp_clone_token": "ABTLWHOULUVAXGTRYU7OC2876QJ2O",
    "allow_squash_merge": true,
    "delete_branch_on_merge": true,
    "allow_merge_commit": true,
    "subscribers_count": 42,
    "network_count": 0,
    "license": {
      "key": "mit",
      "name": "MIT License",
      "url": "https://api.github.com/licenses/mit",
      "spdx_id": "MIT",
      "node_id": "MDc6TGljZW5zZW1pdA==",
      "html_url": "https://api.github.com/licenses/mit"
    },
    "forks": 1,
    "open_issues": 1,
    "watchers": 1
  },
  "source": {
    "id": 1296269,
    "node_id": "MDEwOlJlcG9zaXRvcnkxMjk2MjY5",
    "name": "Hello-World",
    "full_name": "octocat/Hello-World",
    "owner": {
      "login": "octocat",
      "id": 1,
      "node_id": "MDQ6VXNlcjE=",
      "avatar_url": "https://github.com/images/error/octocat_happy.gif",
      "gravatar_id": "",
      "url": "https://api.github.com/users/octocat",
      "html_url": "https://github.com/octocat",
      "followers_url": "https://api.github.com/users/octocat/followers",
      "following_url": "https://api.github.com/users/octocat/following{/other_user}",
      "gists_url": "https://api.github.com/users/octocat/gists{/gist_id}",
      "starred_url": "https://api.github.com/users/octocat/starred{/owner}{/repo}",
      "subscriptions_url": "https://api.github.com/users/octocat/subscriptions",
      "organizations_url": "https://api.github.com/users/octocat/orgs",
      "repos_url": "https://api.github.com/users/octocat/repos",
      "events_url": "https://api.github.com/users/octocat/events{/privacy}",
      "received_events_url": "https://api.github.com/users/octocat/received_events",
      "type": "User",
      "site_admin": false
    },
    "private": false,
    "html_url": "https://github.com/octocat/Hello-World",
    "description": "This your first repo!",
    "fork": false,
    "url": "https://api.github.com/repos/octocat/Hello-World",
    "archive_url": "https://api.github.com/repos/octocat/Hello-World/{archive_format}{/ref}",
    "assignees_url": "https://api.github.com/repos/octocat/Hello-World/assignees{/user}",
    "blobs_url": "https://api.github.com/repos/octocat/Hello-World/git/blobs{/sha}",
    "branches_url": "https://api.github.com/repos/octocat/Hello-World/branches{/branch}",
    "collaborators_url": "https://api.github.com/repos/octocat/Hello-World/collaborators{/collaborator}",
    "comments_url": "https://api.github.com/repos/octocat/Hello-World/comments{/number}",
    "commits_url": "https://api.github.com/repos/octocat/Hello-World/commits{/sha}",
    "compare_url": "https://api.github.com/repos/octocat/Hello-World/compare/{base}...{head}",
    "contents_url": "https://api.github.com/repos/octocat/Hello-World/contents/{+path}",
    "contributors_url": "https://api.github.com/repos/octocat/Hello-World/contributors",
    "deployments_url": "https://api.github.com/repos/octocat/Hello-World/deployments",
    "downloads_url": "https://api.github.com/repos/octocat/Hello-World/downloads",
    "events_url": "https://api.github.com/repos/octocat/Hello-World/events",
    "forks_url": "https://api.github.com/repos/octocat/Hello-World/forks",
    "git_commits_url": "https://api.github.com/repos/octocat/Hello-World/git/commits{/sha}",
    "git_refs_url": "https://api.github.com/repos/octocat/Hello-World/git/refs{/sha}",
    "git_tags_url": "https://api.github.com/repos/octocat/Hello-World/git/tags{/sha}",
    "git_url": "git:github.com/octocat/Hello-World.git",
    "issue_comment_url": "https://api.github.com/repos/octocat/Hello-World/issues/comments{/number}",
    "issue_events_url": "https://api.github.com/repos/octocat/Hello-World/issues/events{/number}",
    "issues_url": "https://api.github.com/repos/octocat/Hello-World/issues{/number}",
    "keys_url": "https://api.github.com/repos/octocat/Hello-World/keys{/key_id}",
    "labels_url": "https://api.github.com/repos/octocat/Hello-World/labels{/name}",
    "languages_url": "https://api.github.com/repos/octocat/Hello-World/languages",
    "merges_url": "https://api.github.com/repos/octocat/Hello-World/merges",
    "milestones_url": "https://api.github.com/repos/octocat/Hello-World/milestones{/number}",
    "notifications_url": "https://api.github.com/repos/octocat/Hello-World/notifications{?since,all,participating}",
    "pulls_url": "https://api.github.com/repos/octocat/Hello-World/pulls{/number}",
    "releases_url": "https://api.github.com/repos/octocat/Hello-World/releases{/id}",
    "ssh_url": "git@github.com:octocat/Hello-World.git",
    "stargazers_url": "https://api.github.com/repos/octocat/Hello-World/stargazers",
    "statuses_url": "https://api.github.com/repos/octocat/Hello-World/statuses/{sha}",
    "subscribers_url": "https://api.github.com/repos/octocat/Hello-World/subscribers",
    "subscription_url": "https://api.github.com/repos/octocat/Hello-World/subscription",
    "tags_url": "https://api.github.com/repos/octocat/Hello-World/tags",
    "teams_url": "https://api.github.com/repos/octocat/Hello-World/teams",
    "trees_url": "https://api.github.com/repos/octocat/Hello-World/git/trees{/sha}",
    "clone_url": "https://github.com/octocat/Hello-World.git",
    "mirror_url": "git:git.example.com/octocat/Hello-World",
    "hooks_url": "https://api.github.com/repos/octocat/Hello-World/hooks",
    "svn_url": "https://svn.github.com/octocat/Hello-World",
    "homepage": "https://github.com",
    "language": null,
    "forks_count": 9,
    "stargazers_count": 80,
    "watchers_count": 80,
    "size": 108,
    "default_branch": "master",
    "open_issues_count": 0,
    "is_template": true,
    "topics": [
      "octocat",
      "atom",
      "electron",
      "api"
    ],
    "has_issues": true,
    "has_projects": true,
    "has_wiki": true,
    "has_pages": false,
    "has_downloads": true,
    "archived": false,
    "disabled": false,
    "visibility": "public",
    "pushed_at": "2011-01-26T19:06:43Z",
    "created_at": "2011-01-26T19:01:12Z",
    "updated_at": "2011-01-26T19:14:43Z",
    "permissions": {
      "admin": false,
      "push": false,
      "pull": true
    },
    "allow_rebase_merge": true,
    "temp_clone_token": "ABTLWHOULUVAXGTRYU7OC2876QJ2O",
    "allow_squash_merge": true,
    "delete_branch_on_merge": true,
    "allow_merge_commit": true,
    "subscribers_count": 42,
    "network_count": 0,
    "license": {
      "key": "mit",
      "name": "MIT License",
      "url": "https://api.github.com/licenses/mit",
      "spdx_id": "MIT",
      "node_id": "MDc6TGljZW5zZW1pdA==",
      "html_url": "https://api.github.com/licenses/mit"
    },
    "forks": 1,
    "open_issues": 1,
    "watchers": 1
  }
}

which is rather ridiculously heavy.
I don't think the Git API is really suited to what we want. It can't return less than the full dataset, and it can't filter by id.

I'll put together a public API we can use for testing.

[bilogic]

@6pac

Yea we can't filter by ID, but I have some new thoughts:

1. GitHub API, as with most other APIs have calling limits, so minimizing AJAXs is kind of high on the list
2. It does send a huge payload, much of which we do not need, however, we can just discard them, right?
3. It certainly makes sense to have SlickGrid easily integrated with more APIs than less, provided there are no compromises on SlickGrid's architecture

Anyway, I figured the damage is limited if I don't go outside the example, so I went ahead and updated the example with the JSON approach https://bilogic.github.io/SlickGrid/examples/example-select3.html

It was much easier than I thought and did not have to affect any SlickGrid core.
It is able to display repository on first load and drop down for a >1M selection from GitHub.
I will file a PR if you are ok with it.

Thank you.

[6pac]

glad you found a solution, but I would never encourage doing it this way, so I don't think it's worth your time doing a PR

[bilogic]

Sure thanks :)