How to order results when using typeahead from ngx-bootstrap?
I am using customTemplate for my typeahead which has three fields
(model.number-model.city-model.state)
using the number
as the typeaheadOptionField
, I see there is typeaheadGroupField
available which I use on the number field .... I would like to know is there anyway in which I can order
the result based on the city
field?
<ng-template #customCapTemplate let-model="item" let-index="index">
<h5>model.code-model.city-model.prov</h5>
</ng-template>
<input name="colCap" [typeahead]="capList" typeaheadGroupField="code"
typeaheadOptionField="code" [typeaheadItemTemplate]="customCapTemplate" class="form-control">
currently it is showing the result like this
bootstrap-4 typeahead ngx-bootstrap
add a comment |
I am using customTemplate for my typeahead which has three fields
(model.number-model.city-model.state)
using the number
as the typeaheadOptionField
, I see there is typeaheadGroupField
available which I use on the number field .... I would like to know is there anyway in which I can order
the result based on the city
field?
<ng-template #customCapTemplate let-model="item" let-index="index">
<h5>model.code-model.city-model.prov</h5>
</ng-template>
<input name="colCap" [typeahead]="capList" typeaheadGroupField="code"
typeaheadOptionField="code" [typeaheadItemTemplate]="customCapTemplate" class="form-control">
currently it is showing the result like this
bootstrap-4 typeahead ngx-bootstrap
add a comment |
I am using customTemplate for my typeahead which has three fields
(model.number-model.city-model.state)
using the number
as the typeaheadOptionField
, I see there is typeaheadGroupField
available which I use on the number field .... I would like to know is there anyway in which I can order
the result based on the city
field?
<ng-template #customCapTemplate let-model="item" let-index="index">
<h5>model.code-model.city-model.prov</h5>
</ng-template>
<input name="colCap" [typeahead]="capList" typeaheadGroupField="code"
typeaheadOptionField="code" [typeaheadItemTemplate]="customCapTemplate" class="form-control">
currently it is showing the result like this
bootstrap-4 typeahead ngx-bootstrap
I am using customTemplate for my typeahead which has three fields
(model.number-model.city-model.state)
using the number
as the typeaheadOptionField
, I see there is typeaheadGroupField
available which I use on the number field .... I would like to know is there anyway in which I can order
the result based on the city
field?
<ng-template #customCapTemplate let-model="item" let-index="index">
<h5>model.code-model.city-model.prov</h5>
</ng-template>
<input name="colCap" [typeahead]="capList" typeaheadGroupField="code"
typeaheadOptionField="code" [typeaheadItemTemplate]="customCapTemplate" class="form-control">
currently it is showing the result like this
bootstrap-4 typeahead ngx-bootstrap
bootstrap-4 typeahead ngx-bootstrap
asked Nov 15 '18 at 12:03
RishabhRishabh
2,22843461
2,22843461
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
Using typeaheadGroupField
should give you subheaders and group items under each subheader.
The other approach you can take is to first order "capList" before it goes into the ngx-bootstrap typeahead.
Good luck!
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53319114%2fhow-to-order-results-when-using-typeahead-from-ngx-bootstrap%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Using typeaheadGroupField
should give you subheaders and group items under each subheader.
The other approach you can take is to first order "capList" before it goes into the ngx-bootstrap typeahead.
Good luck!
add a comment |
Using typeaheadGroupField
should give you subheaders and group items under each subheader.
The other approach you can take is to first order "capList" before it goes into the ngx-bootstrap typeahead.
Good luck!
add a comment |
Using typeaheadGroupField
should give you subheaders and group items under each subheader.
The other approach you can take is to first order "capList" before it goes into the ngx-bootstrap typeahead.
Good luck!
Using typeaheadGroupField
should give you subheaders and group items under each subheader.
The other approach you can take is to first order "capList" before it goes into the ngx-bootstrap typeahead.
Good luck!
answered Jan 22 at 9:52
JelleJelle
492110
492110
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53319114%2fhow-to-order-results-when-using-typeahead-from-ngx-bootstrap%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown