select2 and axios: success is not a function
I am new to javascript, callback functions and select2. Thanks in advance for your help :)
I am looking at implementing select2 to search against an API but I will have to use axios instead of the default jQuery method. Below is my code. I am able to send and retrieve results but I am not sure how to use the success callback.
I get "TypeError: success is not a function"
$("#profile-select").select2({
ajax: {
transport: function(params, success, failure){
axios.post("/rest/vue/1.0/profile/search", {query: $("#profile-select").val()})
.then(function(response){
success(response);
})
.catch(function(error){
alert(error);
});
},
processResults: function(data){
var processedArray = ;
data.profiles.forEach(function(item){
processedArray.push({id: item.ID, text: item.name});
});
return processedArray;
}
},
minimumInputLength: 2,
placeholder: "Select a profile",
allowClear: true
});
Questions
- How do I return the response data to processResults in the .then function on the axios request? The documentation is at https://select2.org/data-sources/ajax
- What is the best way to pass the input from the select list to the post request? Currently I am using jQuery.val() function which doesn't seem to work.
javascript callback jquery-select2
asked Nov 14 '18 at 3:56
bhushan154bhushan154
84
add a comment |
I am new to javascript, callback functions and select2. Thanks in advance for your help :)
I am looking at implementing select2 to search against an API but I will have to use axios instead of the default jQuery method. Below is my code. I am able to send and retrieve results but I am not sure how to use the success callback.
I get "TypeError: success is not a function"
$("#profile-select").select2({
ajax: {
transport: function(params, success, failure){
axios.post("/rest/vue/1.0/profile/search", {query: $("#profile-select").val()})
.then(function(response){
success(response);
})
.catch(function(error){
alert(error);
});
},
processResults: function(data){
var processedArray = ;
data.profiles.forEach(function(item){
processedArray.push({id: item.ID, text: item.name});
});
return processedArray;
}
},
minimumInputLength: 2,
placeholder: "Select a profile",
allowClear: true
});
Questions
- How do I return the response data to processResults in the .then function on the axios request? The documentation is at https://select2.org/data-sources/ajax
- What is the best way to pass the input from the select list to the post request? Currently I am using jQuery.val() function which doesn't seem to work.
javascript callback jquery-select2
asked Nov 14 '18 at 3:56
bhushan154bhushan154
84
Have you added Axios CDN file or installed on your root project?
– Jaymin
Dec 31 '18 at 12:57
add a comment |
I am new to javascript, callback functions and select2. Thanks in advance for your help :)
I am looking at implementing select2 to search against an API but I will have to use axios instead of the default jQuery method. Below is my code. I am able to send and retrieve results but I am not sure how to use the success callback.
I get "TypeError: success is not a function"
$("#profile-select").select2({
ajax: {
transport: function(params, success, failure){
axios.post("/rest/vue/1.0/profile/search", {query: $("#profile-select").val()})
.then(function(response){
success(response);
})
.catch(function(error){
alert(error);
});
},
processResults: function(data){
var processedArray = ;
data.profiles.forEach(function(item){
processedArray.push({id: item.ID, text: item.name});
});
return processedArray;
}
},
minimumInputLength: 2,
placeholder: "Select a profile",
allowClear: true
});
Questions
- How do I return the response data to processResults in the .then function on the axios request? The documentation is at https://select2.org/data-sources/ajax
- What is the best way to pass the input from the select list to the post request? Currently I am using jQuery.val() function which doesn't seem to work.
javascript callback jquery-select2
asked Nov 14 '18 at 3:56
bhushan154bhushan154
84
I am new to javascript, callback functions and select2. Thanks in advance for your help :)
I am looking at implementing select2 to search against an API but I will have to use axios instead of the default jQuery method. Below is my code. I am able to send and retrieve results but I am not sure how to use the success callback.
I get "TypeError: success is not a function"
$("#profile-select").select2({
ajax: {
transport: function(params, success, failure){
axios.post("/rest/vue/1.0/profile/search", {query: $("#profile-select").val()})
.then(function(response){
success(response);
})
.catch(function(error){
alert(error);
});
},
processResults: function(data){
var processedArray = ;
data.profiles.forEach(function(item){
processedArray.push({id: item.ID, text: item.name});
});
return processedArray;
}
},
minimumInputLength: 2,
placeholder: "Select a profile",
allowClear: true
});
Questions
- How do I return the response data to processResults in the .then function on the axios request? The documentation is at https://select2.org/data-sources/ajax
- What is the best way to pass the input from the select list to the post request? Currently I am using jQuery.val() function which doesn't seem to work.
javascript callback jquery-select2
javascript callback jquery-select2
asked Nov 14 '18 at 3:56
bhushan154bhushan154
84
asked Nov 14 '18 at 3:56
bhushan154bhushan154
84
asked Nov 14 '18 at 3:56
bhushan154bhushan154
84
asked Nov 14 '18 at 3:56
bhushan154bhushan154
84
asked Nov 14 '18 at 3:56
bhushan154bhushan154
84
84
Have you added Axios CDN file or installed on your root project?
– Jaymin
Dec 31 '18 at 12:57
add a comment |
Have you added Axios CDN file or installed on your root project?
– Jaymin
Dec 31 '18 at 12:57
Have you added Axios CDN file or installed on your root project?
– Jaymin
Dec 31 '18 at 12:57
Have you added Axios CDN file or installed on your root project?
– Jaymin
Dec 31 '18 at 12:57
add a comment |
1 Answer
1
active
oldest
votes
You can create callback functions just like any other functions.
For example:
function success(response) {
//do with response data what's necessary
}
Callback means that you pass this function as parameter for later execution.
When you create select2 ajax transport, then you pass your function name as parameter (as callback function).
When code execution meets line "success(response);" then your success function is actually executed.
answered Nov 14 '18 at 5:37
Arturs MednisArturs Mednis
614
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%2f53292986%2fselect2-and-axios-success-is-not-a-function%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
You can create callback functions just like any other functions.
For example:
function success(response) {
//do with response data what's necessary
}
Callback means that you pass this function as parameter for later execution.
When you create select2 ajax transport, then you pass your function name as parameter (as callback function).
When code execution meets line "success(response);" then your success function is actually executed.
answered Nov 14 '18 at 5:37
Arturs MednisArturs Mednis
614
add a comment |
You can create callback functions just like any other functions.
For example:
function success(response) {
//do with response data what's necessary
}
Callback means that you pass this function as parameter for later execution.
When you create select2 ajax transport, then you pass your function name as parameter (as callback function).
When code execution meets line "success(response);" then your success function is actually executed.
answered Nov 14 '18 at 5:37
Arturs MednisArturs Mednis
614
add a comment |
You can create callback functions just like any other functions.
For example:
function success(response) {
//do with response data what's necessary
}
Callback means that you pass this function as parameter for later execution.
When you create select2 ajax transport, then you pass your function name as parameter (as callback function).
When code execution meets line "success(response);" then your success function is actually executed.
answered Nov 14 '18 at 5:37
Arturs MednisArturs Mednis
614
You can create callback functions just like any other functions.
For example:
function success(response) {
//do with response data what's necessary
}
Callback means that you pass this function as parameter for later execution.
When you create select2 ajax transport, then you pass your function name as parameter (as callback function).
When code execution meets line "success(response);" then your success function is actually executed.
answered Nov 14 '18 at 5:37
Arturs MednisArturs Mednis
614
answered Nov 14 '18 at 5:37
Arturs MednisArturs Mednis
614
answered Nov 14 '18 at 5:37
Arturs MednisArturs Mednis
614
answered Nov 14 '18 at 5:37
Arturs MednisArturs Mednis
614
614
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%2f53292986%2fselect2-and-axios-success-is-not-a-function%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
Have you added Axios CDN file or installed on your root project?
– Jaymin
Dec 31 '18 at 12:57