gmaps4rails in partial twitter bootstrap modal - ruby-on-rails

I'm building a site where there is only one page and then a modal display. The modal shows various pages and has the core functionality of the app. Each page in the modal is rendered via ajax so I have two problems I'm encountering
I need to render a map in a partial on the modal. I've searched all over and no answer has solved the problem since the modal div itself exists from page load, but the partial does not.
Any thoughts?

The partial is loaded with ajax so the js dependencies included are not loaded.
You should add these manually in your source page.
To know which one are needed, display your modal and look at the html source.

Related

Templating a secondary menu with linking pages

I'm using ASP.NET MVC with Razor C# and I have implemented a main menu appearing on every page through _Layout.cshtml.
One of the pages linked to this menu opens a page that includes a secondary menu.
This page with the secondary menu links to several different pages which are navigated via the same secondary menu.
I've used Partial views to hold each secondary menu page, and I'm wondering what is the easiest/preferred way to output these partial pages via the page with the secondary menu? (Or perhaps I shouldn't even be using Partial views to save having to add the secondary menu to each page).
Thanks.
Ok, A friend, who is also working on the same problem, just showed me this: https://www.youtube.com/watch?v=SrlU8sr5Tqc
So the answer seems to be Nested Layouts.

How to overlay a jQuery UI Dialog over a Skillbuilders modal page?

I am using the SkillBuilders Modal Page within my Oracle APEX application, i.e.
SkillBuilders Modal Page
to present the user with a tabular form, where they can enter specific values via select lists.
What I also have is validation based on another thread that I raised in Stackoverflow:
How to perform row by row validation on an Oracle APEX Tabular form using Ajax?
The problem that I am having is within my SkillBuilders Modal Page, I have some validation by where I want to make a call to jQueryUI dialog, in order to present the user a message. I do this by calling:
$('#dialogbox').dialog('open');
Unfortunately it doesn't actually seem to appear on screen and I believe it's something to do with the fact that I am trying to overlay a modal dialog over a modal page (skillbuilders modal plugin).
How can I solve this problem?

jQueryMobile page transition not loading page as it should

I am trying to load a page with transition effect on click of a link. I have used jQuery Mobile.
Below is my code.
Transition
On click of Transition link index.html page should be loaded showing transition effect.
Below is the output of index.html that I am trying to load.
But problem is that when I click Transition link the index page is not loaded as expected. The loaded page looks like below.
When I looked through firebug what is happening, I found that instead of loading complete page what transition is doing that it is putting output of linked page( i.e index.html) into first page and applying css of first page to it.
I want transition to load index page properly with its all css not to embed it into the page link is called from.
Can you please tell me how to achieve this.
In JQM by default when you link to another page JQM looks for the first JQM page (without any of the scripts or styles on that page)on that page (data-role="page") and then via ajax pulls it and enhances it and attaches it to the DOM of the current page. If you want to fully load the second page instead then you need to either set ajax-enabled to false (this is a global setting) or on the link to the second page add the attribute data-rel="extrenal".
Add in your html link tag the following attribute: rel="external"
Transition

ASP.NET MVC loading multiple partial views into a single div using JQuery

I am working on a help page which is composed of a navigation tree, content box, and search box. The navigation tree has links to Frequently Asked Questions and Glossary, each of which are linked to an Action which return partial views.
To the right of the navigation tree I have a single content div that I would like to contain whichever partial view is selected in the navigation tree.
Success case (what I want to accomplish): clicking on one of the FAQ links calls the FAQ() method in my controller, then returns a partial view which is then displayed in my content div to the right of the navigation tree. Clicking on another item would cause another partial view to be loaded.
How do I go about this? I've read a ton of ASP.NET MVC JQuery loading blog posts and tutorials but can't find anyone who's done exactly this.
Many thanks!
You should be able to use the jQuery method .load() to load HTML into your div.
http://api.jquery.com/load/
You can create an action that returns the partial view as HTML.
ASP.NET MVC Returning Partial View as a full View Page
jQuery:
one easy way you can do is load all partial views in "Container Div" at page load in one go (if performance is not a issue)
then assign each partial div with different div id inside "container", than use jquery to control show(); hide(); for each div.
MVC:
however if i were you, "Glossary" and "FAQ" looks same model to me it shouldn't be put in different partial view in first place.
if they did designed in separate model, in this scenario, i would recommend you to create a proxy class as a ViewModel above models you want to display, and then load it with one partial view only

binding fields in a dialog popup in my view

i have an html table in my asp.net mvc view an i am running into some real estate issues with screen space.
I think in one area of my view i am going to have a button in a column of an html table that says "Details" which, when clicked, loads up some dialog ui. what i am trying to get my head around is that i want the fields in the dialog to also be part of data binding object in the overall form which i am passing to the controller when i submit the form.
is there anything that i should be worried about or anything that you need to do special if you have a form where inside your form you have a button that create a popup with some more details elements. I am just trying to see from a data binding view if there are any issues.
also any examples of doing anything similar would be great.
EDIT
So i tried doing this an ran into a binding issue. i have a follow up question with the specifics about this binding issue with jquery ui dialog here:
why does jquery ui dialog break asp.net mvc's default model binding .
There shouldn't be any issues if you are binding elements from your popup dialog to corresponding hidden elements in your main view. These hidden elements will bind correctly like any other control in your main form.
Of course, you might be POSTing the form elements from your popup form to its own controller method directly, and that is also a perfectly good approach.

Resources