I am developing web application. In that i want to open one popup using thickbox after 5 seconds when user comes to entry page.
Can any one give some idea how to do this?
You can use the setTimeout() from javascript with the command from the thickbox, something like:
// when dom is ready
$(document).ready(function() {
// set a timer thats run 5sec
setTimeout(function(){
// open the pop
var me = $('#ElementToOpen');
var t = "title"
var a = "openurl";
var g = false;
tb_show(t,a,g);
},5000);
});
Related
I have a repeater that outputs javascript for a Google Map
var marker5450635326848240000000 = new google.maps.Marker({
position: new google.maps.LatLng(31.2272,-85.4072),
map: map,
title: '4/10/2014'
});
markers.push(marker5450635326848240000000);
I have the map plus a pulldown inside an updatepanel. When the user changes the pulldown the updatepanel updates everything, but the pins on the map do not change.
Here is the example: http://prod.windcreekhospitality.bkwld.onyxtek.com/Giving-Back/Good-on-the-Go.aspx
I know it is the update panel because when I take the panel out of the equation it works.
http://windcreekhospitality.com/Giving-Back/Good-on-the-Go
Where is the whole code for the ascx http://pastebin.com/FqX0PndG
This is an ascx control and it is build for use with Kentico CMS. This limits my choices.
I had a similar problem recently trying to integrate a captcha script inside of an UpdatePanel.
Script blocks inside of an UpdatePanel only get recognized by the browser on the initial page load. Due to the way UpdatePanels work, any new script tags won't be injected into the browser correctly for them to actually be executed.
One work-around will be to use the ScriptManager.RegisterStartupScript method to register the script block dynamically from code-behind. The ASP.NET's ajax library will then handle registering the javascript code correctly and calling it to execute.
If you pass an UpdatePanel control as the first paramter to RegisterStartupScript(), the code will be included in the rendering on the first page load, any full postbacks, and every partial postback if that UpdatePanel is being updated.
In code-behind, build the javascript as a string and then pass it to RegisterStartupScript. Example:
protected override void OnPreRender(EventArgs e)
{
var s = new StringBuilder();
s.Append(#"
var markers = [];
var currentWindow;
var myLatlng = new google.maps.LatLng(32.3617,-86.2792);
var mapOptions = {
zoom: 6,
center: myLatlng,
scrollwheel: false
};
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
$('#map-canvas').mouseleave(function(){
if(currentWindow)
currentWindow.close();
});
google.maps.event.addListener(map, 'mousedown', function() {
if(currentWindow)
currentWindow.close();
} );");
// TODO: manually do whatever that cms:CMSRepeater control would be done to generate the additional JS and append it to the StringBuilder.
ScriptManager.RegisterClientScriptBlock(EventsUpdatePanel, GetType(), "InitMap", s.ToString(), true);
base.OnPreRender(e);
}
Better would be to separate out your function that inits the map, move it to be OUTSIDE of the UpdatePanel, and pass it as arguments the data you want it to initialize. Have the code-behind generate JS that is just a call to that function with the data as arguments.
One way our team handle this issueis by adding the following
on the Webpart(here your Map) -> Envelope->Content before
<script type="text/javascript">
function MyFunction() {
......
}
MyFunction();
Sys.Application.add_load(MyFunction);
</script>
Also , bring the repeater outside the script tag(see your Pastbin code) and call the pageLoad method as described up.
I'm trying to work out from the Leaflet.js docs how it would be possible to open more than one popup upon showing the page. For instance, if one had three markers (each representing a building), each one would have their popup opened immediately.
http://leaflet.cloudmade.com/reference.html#popup
cryptically says:
"Use Map#openPopup to open popups while making sure that only one popup is open at one time (recommended for usability), or use Map#addLayer to open as many as you want."
but
http://leaflet.cloudmade.com/reference.html#map-addlayer
gives no hints about how this might be achievable.
Can anyone clarify if this is possible, and give any hints on how to do it?
You must add the popups as Layer.
Try with this example code:
var popupLocation1 = new L.LatLng(51.5, -0.09);
var popupLocation2 = new L.LatLng(51.51, -0.08);
var popupContent1 = '<p>Hello world!<br />This is a nice popup.</p>',
popup1 = new L.Popup();
popup1.setLatLng(popupLocation1);
popup1.setContent(popupContent1);
var popupContent2 = '<p>Hello world!<br />This is a nice popup.</p>',
popup2 = new L.Popup();
popup2.setLatLng(popupLocation2);
popup2.setContent(popupContent2);
map.addLayer(popup1).addLayer(popup2);
L.Map = L.Map.extend({
openPopup: function(popup) {
// this.closePopup();
this._popup = popup;
return this.addLayer(popup).fire('popupopen', {
popup: this._popup
});
}
});
example: http://jsfiddle.net/paulovieira/yVLJf/
found it here: https://groups.google.com/forum/#!msg/leaflet-js/qXVBcD3juL4/4pZXHTv1baIJ
marker.addTo(myMap).bindPopup('Hello popup', {autoClose:false}).openPopup();
use autoClose option
In the latest version, there is an autoClose option.
To have both marker and popup open at same time, without adding layers explicitly :
var popup1 = new L.Popup({'autoClose':false});
popup1.setLatLng([53.55375, 9.96871]);
popup1.setContent('First popup');
var popup2 = new L.Popup({'autoClose':false});
popup2.setLatLng([53.552046, 9.9132]);
popup2.setContent('Second popup');
L.marker([53.55375, 9.96871]).addTo(myMap)
.bindPopup(popup1).openPopup();
L.marker([53.552046, 9.9132]).addTo(myMap)
.bindPopup(popup2).openPopup();
This solution work for me:
L.marker([30.4160534, -87.2226216], {icon: icon_url}).bindPopup('Hello World',{autoClose:false}).addTo(map).openPopup();
here is the preview image: https://prnt.sc/NuX9Qs291IQq
triky solution is remove popup link from map object on open:
map.on('popupopen', function (e) {
delete map._popup;
});
I have a function that does some database update in asp.net. I'd like a modal popup to show a "success" message for just 5 seconds after my function has been called. In this case, the modal popup would not be triggered by any "TargetControl" but would show up for just 5 seconds once the function is done.
Thanks
You can't close standard javascript modal dialogs (alert, confirm,..) after a timeout. Only manual close works with them.
But, you can use jquery/UI dialog:
// timeOut in ms
function showMessageWithTiemout(message, timeOut){
// show dialog
var successDialog = $('<div>'+message+'</div>').dialog({modal: true});
//close it after 5 seconds
setTimeout(function(){ successDialog.dialog('close'); }, timeOut);
}
//usage:
showMessageWithTiemout('success!', 5000);
You have to manually call the show method on the panel like:
var pnl = $find("<%= modal.ClientID");
pnl.show();
So you can use window.setTimeout to call this:
window.setTimeout(function() { /* code */ }, 5000);
But it can't just happen very easily.
HTH.
Is it possible to have a link, once clicked, execute the href target, but not pop up a new window?
I presume you mean using jQuery, since you have tagged it as such. Using an ajax call will hit the page and, if you wish, you could perform actions on finish. e.preventDefault will stop the click (visiting the url) to occuring.
Something like this?
$("a#mylink").click(function(e){
var goto = $(this).attr('href'); //get the url
$.ajax({
url: goto
}); //execute the href
e.preventDefault(); //prevent click
});
Ajax jQuery reference
I have the following JQuery code in a external JS file linked into a
usercontrol in .Net 1.1 webapp.
The usercontrol is a timesheet.
When the page loads it calls MonthChange and works fine in one page.
But now I want to load the timesheet/usercontrol into aother
webpage that pops up a in a new browser window for printing.
Problem is my MonthChange is not firing.
Any ideas why???
$(function() {
MonthChange();
//TestData();
$('[class^=TSGridTB]').blur(function() {
var day = GetDay($(this).attr('id'));
var date = GetRowDate(day);
var bgcolor = GetInputFieldColor(date, false);
$(this).css("background-color", bgcolor);
$(this).parent().css("background-color", bgcolor);
//CalcHours($(this).get(0));
});
$('[class^=TSGridTB]').focus(function() {
var day = GetDay($(this).attr('id'));
var date = GetRowDate(day);
var bgcolor = GetInputFieldColor(date, true);
$(this).css("background-color", bgcolor);
$(this).parent().css("background-color", bgcolor);
});
$('[id$=lstMonth]').change(function() {
MonthChange();
});
});
without seeing further code, ensure that the selector is correct for the control in the new page.
The problem may be that the DOM has changed for the new page/window and JQuery does not yet know about it.
The change event
fires when a control loses the input
focus and its value has been modified
since gaining focus.
You might want to use the live event:
Binds a handler to an event (like
click) for all current - and future -
matched element.
When you bind a "live" event it will
bind to all current and future
elements on the page (using event
delegation). For example if you bound
a live click to all "li" elements on
the page then added another li at a
later time - that click event would
continue to work for the new element
(this is not the case with bind which
must be re-bound on all new elements).
Did you make sure that the new web page has jQuery script includes?
ensure you're using:
$(document).ready(
);
around your entire code block. The $ alone often does not do the trick.