We Keep Coding

How to call function inside ajaxComplete from document ready in jquery?

I want to execute function inside .ajaxComplete() from document ready.
$(function() {
$(document).on('click', '.woof_radio_label', function(e) {
if($(this).siblings('.woof_radio_term').is(':checked')) {
$('.page-secondary-content').removeClass('open');
$('.page-primary-content').removeClass('close');
$(this).siblings('.woof_radio_term_reset').click();
refineUrl();
} else {
$('.page-primary-content').addClass('close');
$('.page-secondary-content, .bottom-content').addClass('open');
}
});
});
$(document).ajaxComplete(function() {
function refineUrl() {
console.log('it works');
}
});
I am prompted with an error below:
Uncaught ReferenceError: refineUrl is not defined
at HTMLLabelElement. (scripts-custom.js?ver=4.9.7:15)
at HTMLDocument.dispatch (jquery.js?ver=1.12.4:3)
at HTMLDocument.r.handle (jquery.js?ver=1.12.4:3)
When I click the class woof_radio_label it will trigger an ajax event(Product Filter), I want to call a function on ajaxComplete().
Do you know how to do this?

You should declare function refineUrl() globally and then it can be called from anywhere. From ajaxComplete and from document.ready as well.
Like:
$(function () {
$(document).on('click', '.woof_radio_label', function (e) {
if ($(this).siblings('.woof_radio_term').is(':checked')) {
$('.page-secondary-content').removeClass('open');
$('.page-primary-content').removeClass('close');
$(this).siblings('.woof_radio_term_reset').click();
refineUrl();
} else {
$('.page-primary-content').addClass('close');
$('.page-secondary-content, .bottom-content').addClass('open');
}
});
});
$(document).ajaxComplete(function () {
//DO another stuff
});
function refineUrl() {
console.log('it works');
}

Declare your refineUrl() at the top of your script to prevent from such type of errors like,
function refineUrl() {
console.log('it works');
}
$(function(){
.....
});
$(document).ajaxComplete(function() {
refineUrl();
});

Trigger function only on "onclick"

Hello I need a function to run when an a tag is clicked. I am using the onclick="" but it seems that the function runs on page load, instead of waiting to run when the a tag is clicked on. How do I make it so the function only runs when the a tag is clicked?
Here is my code.
HTML:
<a class="req_btn" onclick="conversionOne()">text</a>
<script type='text/javascript'>
(function conversionOne() {
alert("something");
})();
</script>
Thanks!

You are invoking the function when the script loads using an IIFE. Instead of this:
(function conversionOne() {
alert("something");
})();
Do this:
function conversionOne() {
alert("something");
}

You are using a self-executing function.
Declare the function in the global scope without executing it.
function conversionOne() {
alert("something");
}

Doing this
(function(){
/** code **/
})();
Means the code will be executed imediatelly.
in your case you want to create a function so you need this :
function conversionOne() {
/** code **/
}
or
var conversionOne = function () {
/** code **/
}

(function conversionOne() {
alert("something");
})();
calling function like this will work onload
Change this to
function conversionOne() {
alert("something");
};
More info

(document).ready is a global scope?

Guys i have this function inside my script.js:
$(document).ready(function() {
function alert() {
alert('AAAAAAAA');
}
});
And i am trying to call here in my index.html:
$('.something').on('click', function() {
e.preventDefault();
alert();
});
But is showing my this error - alert is not defined.
But when i take off the document ready in the external script, the click handler will work. Why is that?
The document ready is creating a separate scope?

Using $(document).ready() creates a new function scope (note the function() after the .ready), so when you call
$(document).ready(function() {
function alert() {
alert('AAAAAAAA');
}
});
alert is only defined within the document.ready block. There are two ways to solve this issue:
Define the function outside of the document.ready block:
function customAlert() {
alert('AAAAAAAA');
}
Attach the function to the window object:
$(document).ready(function() {
window.customAlert = function() {
alert('AAAAAAAA');
};
});

Include the click event into the document.ready
Check it here http://jsfiddle.net/fbrcm45q/1/
$(document).ready(function() {
function showAlert() {
alert('AAAAAAAA');
}
$('.something').on('click', function(e) {
e.preventDefault();
showAlert();
});
});

First of all e.preventDefault is a function so you have to add braces at the end:
e.preventDefault()
Second alert is a function in javascrpt, so you need to rename your function to something else, for example:
$(document).ready(function() {
function special_alert() {
alert('AAAAAAAA');
}
});
and:
$('.something').on('click', function() {
e.preventDefault();
special_alert();
});

How to call javascript function from ScriptManager.RegisterStartupScript?

I have the following javascript code:
<script type="text/javascript" language="javascript">
$(document).ready(
function () {
// THIS IS FOR HIDE ALL DETAILS ROW
$(".SUBDIV table tr:not(:first-child)").not("tr tr").hide();
$(".SUBDIV .btncolexp").click(function () {
$(this).closest('tr').next('tr').toggle();
//this is for change img of btncolexp button
if ($(this).attr('class').toString() == "btncolexp collapse") {
$(this).addClass('expand');
$(this).removeClass('collapse');
}
else {
$(this).removeClass('expand');
$(this).addClass('collapse');
}
});
function expand_all() {
$(this).closest('tr').next('tr').toggle();
};
});
</script>
I want to call expand_all function via code-behind .
I know I can use something like this, but it does not work and I don't understand used parameters:
ScriptManager.RegisterStartupScript(Me, GetType(String), "Error", "expand_all();", True)
Can you help me?

Because you have your expand_all function defined within anonymous $.ready event context. Put your code outside and it should work.
function expand_all(){
alert('test B');
}
$(document).ready(
function () {
// this won't work
function expand_all() {
alert('test A');
};
});
// will show test B
expand_all();
check this:
http://jsfiddle.net/jrrymg0g/

Your method expand_all only exists within the scope of the function inside $(document).ready(...), in order for you to call it from ScriptManager.RegisterStartupScript it needs to be at the window level, simply move that function outside the $(document).ready(...)
<script type="text/javascript" language="javascript">
$(document).ready(
function () {
....
});
function expand_all() {
$(this).closest('tr').next('tr').toggle();
};
</script>

Reference error: myFunc is not a function

I'm having a problem with my function that is showing type error. In summary I've the code like below:
function myFunc(){
alert('test');
}
//if I run myFunc() here then it runs
myFunc();//alerts test
$('.selector').click(function(){
myFunc();//type error:: how to call the function?
});
Sorry, if this is a stupid question.
Update
I've just reproduced my key problem:
demo
window.onload = function(){
function myFunc(){
alert('test');
}
}
$('.test').click(function(){
myFunc();//doesn't alert test
});

myFunc is scoped to the function it is declared inside.
Move it outside or move the event handler assignment inside.
// Define this in a script element after the element you are trying to select
function myFunc(){
alert('test');
}
$('.test').click(function(){
myFunc();
});
// or use this anywhere
window.onload = function(){
function myFunc(){
alert('test');
}
$('.test').click(function(){
myFunc();
});
}
// but if you are going to use jQuery, you might as well go the whole hog
// and also just wait for the DOM to be ready instead of allowing time for images
// and other external resources to load too.
$(function(){
function myFunc(){
alert('test');
}
$('.test').click(function(){
myFunc();
});
});

Your function is defined in the scope of another function and is unreachable. You should put it in the scope of the calling function, e.g.:
function myFunc() {
alert('test');
}
$(function() {
$('.test').click(function() {
myFunc();
});
});