I'm trying to block a div (with id="blockme") in my page that contains a gridview while the gridview is loading. I found the code below at Github but this code blocks the whole page.
<script type="text/javascript">
Page = Sys.WebForms.PageRequestManager.getInstance();
Page.add_beginRequest(OnBeginRequest);
Page.add_endRequest(endRequest);
function OnBeginRequest(sender, args) {
$.blockUI();
}
function endRequest(sender, args) {
$.unblockUI();
}
</script>
I looked into stackoverflow and I found this answer which shows how to block a certain div on button click.
My problem is that I don't want to use the button click event but use page begin request and end request instead events to block my div.
I tried doing this but it doesn't work:
function OnBeginRequest(sender, args) {
$('#blockme').blockUI();
}
function endRequest(sender, args) {
$('#blockme').unblockUI();
}
These two links helped me solve it here and this SO question
Here's how it worked:
<script type="text/javascript">
Page = Sys.WebForms.PageRequestManager.getInstance();
Page.add_beginRequest(OnBeginRequest);
Page.add_endRequest(endRequest);
function OnBeginRequest(sender, args) {
$('div#blockme').block({
message: '' ,
overlayCSS: { backgroundColor: '#fff' }
});
}
function endRequest(sender, args) {
$('div#blockme').unblock();
}
</script>
Related
I have a trigger button on my page that activate to load code from another htmldoc into a div on my page.
Works great like here:
https://blog.kulturbanause.de/2012/12/inhalte-per-ajax-jquery-nachladen/
I take this code:
<script>
function kb_source_2_target() {
$.get('source.html', function(data) {
$('#target').html(data);
})
}
</script>
Now I want my trigger-button to start a second function after loading the code in the div.
in the loading code there is a div, f.e. class="divtofadeoutafter loading"
i want to trigger now the loading and then the fadeout of an other div in the loaded content.
Can I do this with a callback?
I tried this:
<script>
function kb_source_2_target() {
$.get('source.html', function(data) {
$('#target').html(data,
function callback(){
$(".divtofadeoutafterloading").fadeOut();
}
);
})
}
</script>
thanks for any idea
stefan
There is no callback in html() so you just need to do it inline since it is a synchronous operation.
function kb_source_2_target() {
$.get('source.html', function(data) {
$('#target').html(data)
$(".divtofadeoutafterloading").fadeOut();
})
}
I am building a form on a website, and I am having and issue getting a function to run when the ReCaptcha is submitted. This function removes the disabled attribute on the submit button.
There is also a chance that multiple forms may be used on one page so I implemented the following solution to allow multiple captacha forms on one page:
https://stackoverflow.com/a/33535769/2506219
It seems I can either allow multiple ReCaptcha forms or have the submit button allowed but not both.
Here is the code:
HTML
<div class="g-recaptcha" data-callback="verifyCallback"></div>
<script src="https://www.google.com/recaptcha/api.js?onload=CaptchaCallback&render=explicit" async defer></script>
JavaScript
<script>
var CaptchaCallback = function() {
$('.g-recaptcha')
.each(function(index, el) {
grecaptcha.render(el, { 'sitekey': 'XXXX' });
});
};
function verifyCallback() {;
$('#submitBtn').prop('disabled', false);
}
</script>
Thank-you.
Worked it out!
I needed to call the function from the callback, having it in the HTML doesn't work
var CaptchaCallback = function() {
$('.g-recaptcha')
.each(function(index, el) {
grecaptcha.render(el, { 'sitekey': 'XXXX', 'callback': verifyCallback });
});
};
My goal is to trigger a pop up function meanwhile the user is going out from my website.
So I want to show a exit popup and in the background show my pop up at the same time.
I already have found different code on internet but no one works well.
Code :
<script type="text/javascript">
function PopUp() { return 'Do you wnat to leave my site?'; }
function UnPopIt() { /* no data */ }
$(document).ready(function() {
window.onbeforeunload = PopUp;
});
</script>
Is it possible to trigger a function like a pop up in the background ?
I am trying this code but it doesn't work :
function PopUp()
{
alert ('Do you wnat to leave my site?'); triggerpopup();
}
1,not very understand your needs,but i can't add a comment right now.
2,suppose you want a selfdefined pop(not another alert),then this goes well
function PopUp() {
triggerpopup();
return 'Do you?';
}
function triggerpopup() {
console.info('called with default pop')
}
$(document).ready(function() {
window.onbeforeunload = PopUp;
});
How to enable chrome extension without clicking it.
I need to perform a certain function from my extension every time i reload a page(no clicking)
is there a way to do it.
My code which contains the on click method
chrome.extension.onMessage.addListener(function(request, sender) {
if (request.action == "getSource") {
message.innerText = request.source;
}
});
function onWindowLoad() {
var message = document.querySelector('#message');
chrome.tabs.executeScript(null, {
file: "getPagesSource.js"
}, function() {
// If you try and inject into an extensions page or the webstore/NTP you'll get an error
if (chrome.extension.lastError) {
message.innerText = 'There was an error injecting script : \n' + chrome.extension.lastError.message;
}
});
}
window.onload = onWindowLoad;
and
chrome.extension.sendMessage({
action: "getSource",
source: started(document)
});
To include jQuery:
<head>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
/*all your normal JavaScript (or include as link)*/
</script>
</head>
Using only pure JavaScript you can do this with:
window.onload = function(){/*your JavaScript code*/};
only the code within that function will be immediately executed.
In jQuery you can wrap the code you want executed upon loading of page inside of $(document).ready(function(){, e.g.
$(document).ready(function(){
/*code goes here*/
});
$(document).ready() checks for when a page is loaded enough to have functionality.
What causes the following pageLoad to not execute in a master page? The first alert executes as expected, but the pageLoad function is not being invoked. How can I use the function within a master/content page?
<script type="text/javascript">
alert('test');
function pageLoad(sender, args) {
alert('pageLoad');
}
</script>
I'm assuming a script manager control is present in your master page? I'm not sure if the client-side pageLoad method is only called on the initial page load. I do know that if you're looking for ajax postback page load hooks, try the client-side PageRequestManager.
MAke sure that the code below is place inside the script manager.
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<script type="text/javascript" >
(function() {
var prm = Sys.WebForms.PageRequestManager.getInstance();
if (prm)
{
prm.add_endRequest(
function (sender, args) {
// do your stuff
// Handle a weird occurence where an error is returned but the error code is 0, i.e. no error.
if(args.get_error() && args.get_error().name === 'Sys.WebForms.PageRequestManagerServerErrorException')
{
args.set_errorHandled(args._error.httpStatusCode == 0);
}
});
}
})();
</script>
<%-- Other markup --%>
</asp:ScriptManager>
Window Load Event
window.onload = function() {
alert('pageLoad');
}
Self Executing Function
(function() {
alert('pageLoad');
})();