FullCalendar: Events not showing onload but show if I open IE developer - ajax

I'm using FullCalendar jquery pluging in my MVC3 project.
For some reason events aren't rendered when the calendar is first loaded. The strange thing is that they do appear if I open IE developer or if I change the agenda view.
Any suggestions?
Thanks

Looks like your calendar div is in a hidden element like a tab. You will need to render the fullCalendar on show of this hidden element to load your events properly in the calendar.
In case of jQuery tabs, you can do something like this:
$('#tabs').tabs({
show: function(event, ui) {
$('#calendar').fullCalendar('render');
}
});
Let me know if this helps!

Related

Monitor click events on bookmarks (Google Apps Script)

Is there a way to monitor click events on bookmarks in google documents with google apps script? I want to get bookmark id when someone selects a bookmark and than run some more code which needs that bookmark id to get processed.
With Brian Bennett's help I managed to solve this issue with Web Apps. There is a little bit more code to write but it works.
Write a doGet function:
doGet function is called when a user visits your Web App. With doGet function I opened a document with ID given through get parameters and displayed it as html. To get a html of the document I used this function.
Find and display bookmarks:
You can find bookmarks in the html of the document as html tag with id of the bookmark. I changed the css of all this tags so I could see them (change background, height, width or something like that).
listen to click events on bookmarks with jquery or just javascript:
Listen to click events on those tags (bookmakrs) with jquery or javascript. If you use jquery, you need to import a jquery library. When click event happens get the id of the bookmark from the id attribute of the tag.
Use that bookmark id as you wish...

Adding GA Event code to Joomla {tab}

I am trying to add a Google Analytics event to track if a tab has been clicked on in a page. I am using Joomla 2.5.7 and in the article is has this markup for the tabs extension:
<p>{tab Rates}</p>
This is the tab at the top of the page. I want to add the following universal analytics tracking event code:
onclick="ga('send', 'event', 'tab active', 'click', 'rates');"
to track when someone looks at this tab.
Currently I have only used this onclick event on an anchor, but as using Joomla this isn't working and is just showing up on the page.
Please advise the best place to get this information and how to activate it. Thanks all.

Foundation tabs don't work in modal when using ajax

I took the basic tabs html at
http://foundation.zurb.com/docs/components/tabs.html
and used it as an Ajax response.
In my index.html I have the following:
<a href="ajax/endpoint" data-reveal-ajax="true"
class="button" data-reveal-id="myModal">Login</a>
<div id="myModal" class="reveal-modal" data-reveal>
</div>
The modal comes up with the tabs, but they do not work, I cannot switch between tabs.
Any clues on what might be wrong?
Thanks in advance.
I got into a similar type of problem. It was with buttons that revealed a modal. I called button via Ajax Request and when they were clicked nothing happened.
I resolved my issue using the jquery that is intended to be used at bottom of the page to activate objects after loading.
$(document).foundation();
Use this code just after you place the responseText in your HTML. And you would be able to switch between tabs.
Hope this would help you too. Please give a feedback about the result.
I am not sure which version of Foundation you are using?
In Foundation 4 it is sections,
If you are using Sections in a Modal, or they are being loaded via AJAX, or they are hidden when Foundation is initialized, you will need to reflow the sections to get tabs to display properly:
$('#myModal').on('opened', function () {
$(this).foundation('section', 'reflow');
});
http://foundation.zurb.com/docs/v/4.3.2/components/section.html You will see the above note in the bottom of this link.
i didn't see the any note about this in foundation 5 doc http://foundation.zurb.com/docs/components/tabs.html
I had a very similar problem except for the part where you display your tabs in a modal. chinmayahd's answer helped my problem BTW.
I placed $(document).foundation('reflow'); inside the success option when calling ajax in order for foundation to work after page load. Like this one,
$.ajax({
url : 'your/url/here',
success : function(data) { // data holding HTML markup of tabs
$('div#content').html(data); // tabs are displayed here
$(document).foundation('reflow'); // perform foundation reflow
}
});

Jquery Mobile with checkboxes are slow on mobile devices

I have a mobile app where I use Jquery Mobile v. 1.3.1 and PhoneGap.
On a page there're a bunch of checkboxes. When I run the app the list with checkboxes respond very slow when you check/uncheck a checkbox.
What to do?
I used this in Cordova/PhoneGap but I wasn't using jQuery Mobile, just jQuery.
$('input[type="checkbox"]').on( 'touchstart', function(){
$(this).prop("checked", !$(this).prop("checked"));
});
$('input[type="checkbox"]').click(function(event){
event.preventDefault();
event.stopPropagation();
});
You could technically do it by using trigger() and pass custom data to the click event handler, but I couldn't get the parameters to go through for some reason. The above works tho.

ASP .NET MVC3 Razor Popup View

I am new to web development..
i have created views using Entity Framework in MVC3 Razor..
What i have done yet is,
i 1st created model(Clients) and DbContext(ClientDbContext) Classes.
then, i add controller with scaffolfind options
Template: Controller with read/Write actions and View, Using Entity Framework
Model Class: Clients
Data Context Class : ClientDbContext
Views : Razor(CSHTML)
It Creates the controller class and index, Detail, Delete, Delete Views...
After that i modified the index page for search and pagination...
All are working good...
in the index page i have create, edit, delete, detail links...
When i click the links browser loads to that page and working good...
But i need to popup those views when i click the links in the index page...
i don't know how to do this... i studied many articles but i am confused...
Please help me to solve this with an efficient manner...
Thanks in advance...
Creating a model pop-up within a page isn't something that can be done directly with ASP.NET MVC. You could do it yourself using javascript & css but I would strongly recommend using a JS UI framework to do this. jQuery UI has a pop-up modal box, except they call it a dialog.
The docs for jQuery UI's dialog can be found here. Have a look through the examples to see the fine details of how to set it up. But this is the basic flow of what you need to do:
Download the jQuery UI files needed and include them on your page (CSS/JS files)
Take the html from your create/update/delete views and put it on your index page, wrap them in a div with an appropriate id
When the page loads use jquery ui to target your div's you want to be a popup
Things such as the link you want to make a dialog popup is set by passing options to the dialog initialize method, again the exact options and examples can be found on the docs page.
Refer this : http://jqueryui.com/dialog/ to create a jQuery Dialog box.
<script>
$(function() {
$( "#dialog" ).dialog();
});
</script>
<div id="dialog">
#using(Html.BeginForm()){
#Html.EditorForModel()
<input type='submit' value ='Submit'/>
}
</div>

Resources