Outline
I am trying to figure out how to inject or define stylesheet to iFrame in ASP.NET MVC3. I have gone through the existing threads on the above topic but none suits my case.I have one solution that define an user control (ParitalShimViewControl) which renders .CSHTML pages in aspx. Using the dll from that solution I refer it in another solution(where the main framework is) and integrate to the main solution. All the css, js files are kept in the main solution only.
Problem
What I do is, I define some functionality(creating controller,views and models) and render it using the PartialShimControl and map it to the main solution in one of the aspx pages. Here I have a case where I need to use iFrame to call some cross-domain service and render the result on the .CSHTML file (i.e. the view), however the result needs to be formatted properly using stylesheets and unfortunately I cannot refer the stylesheets in the view as they are placed in the main solution.
Question
Hope the requirement is clear. How do I refer to those css from the iFrame in the main solution or whatever way possible?
Hope I do not sound too confusing :(
Code:
<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPages/X.master"
AutoEventWireup="true" CodeBehind="X.aspx.cs" Inherits="Online.Web.Pages.X" %>
<%@ Register Assembly="Online.CommonFramework" Namespace="Online.CommonFramework.BaseClasses"
TagPrefix="CFBase" %>
<%@ Register Src="~/UserControls/Shims/PartialViewShimControl.ascx" TagName="PartialViewShim" TagPrefix="UC" %>
<%@ Register Assembly="Online.Web" Namespace="Online.Web.ProviderWebParts.DashBoard"
TagPrefix="DashBoardWebParts" %>
<%@ Register Assembly="Online.Web" Namespace="Online.Web.WebParts"
TagPrefix="WebParts" %>
<asp:Content ID="HeadContent" runat="server" ContentPlaceHolderID="Head">
<link href="/Content/css/Core.css" rel="stylesheet" type="text/css" />
<link href="/Content/css/Home.css" rel="stylesheet" type="text/css" />
<link href="/Content/css/Pods.css" rel="stylesheet" type="text/css" />
<%--<link href="/Pages/CSS/layoutHome.css" rel="stylesheet" type="text/css" />
<link href="/Pages/CSS/Master0.css" rel="stylesheet" type="text/css" />
<link href="/Pages/CSS/compNewLexis0.css" rel="stylesheet" type="text/css" />
<link href="/Pages/CSS/Search0.css" rel="stylesheet" type="text/css" />--%>
</asp:Content>
<asp:Content ID="MedLitBodyContent" ContentPlaceHolderID="LandingBody" runat="server">
<%--<script type="text/javascript" src="JS/api/N.js"></script>
<script type="text/javascript" src="JS/api/Utils.js"></script>
<script type="text/javascript" src="JS/apiWebStorage.js"></script>
<script type="text/javascript" src="JS/vendor/VendorMaster0.js"></script>
<script src="JS/api/SearchResults.js" type="text/javascript"></script>
<script src="JS/vendor/backbone.js" type="text/javascript"></script>
<script src="JS/vendor/handlebars.js" type="text/javascript"></script>
<script src="JS/vendor/jquery-1.7.1.js" type="text/javascript"></script>
<script src="JS/vendor/underscore.js" type="text/javascript"></script>--%>
<script type="text/javascript" src="/MedLit/Content/js/LA.MedLit.Core.js"></script>
<script type="text/javascript" src="/MedLit/Content/js/LA.MedLit.MedicalResearch.js">
</script>
<script type="text/javascript" src="/MedLit/Content/js/LA.MedLit.CaseValueAssessment.js"></script>
<script type="text/javascript" src="/X/Content/js/L.X.BrowseTopics.js">
</script>
<script type="text/javascript" src="/X/Content/js/L.X.ToPDF.js"></script>
<script type="text/javascript">
$LAB
.script('/JS/vendor/VendorMaster1.js')
.script('/JS/api/N.Advance.Ajax.js').wait()
.script('/JS/api/N.Advance.WebStorage.PageData.js')
.script('/JS/api/N.Advance.Popup.js')
.script('/JS/api/N.Advance.Events.js')
.script('/JS/api/N.Advance.UI.js')
.script('/JS/api/N.Advance.Transactional.js')
.script('/JS/api/N.Advance.Middleware.js')
.script('/JS/api/N.Advance.Ready.js')
.wait(function () {
$(LN.Advance.Ready.init);
});
</script>
<asp:ProxyWebPartManager ID="WProxyManager" runat="server">
<StaticConnections>
<asp:WebPartConnection ID="DashBoardWPC" ProviderID="DashBoardTabWP" ProviderConnectionPointID="TabWebPart"
ConsumerID="DashBoardPageLogicWP" ConsumerConnectionPointID="TabSystem" />
<asp:WebPartConnection ID="TabsToState" ProviderID="DashBoardTabWP" ProviderConnectionPointID="TabWebPart"
ConsumerID="dashBoardStateProvider" ConsumerConnectionPointID="TabSystem" />
<asp:WebPartConnection ID="StatePageContextToPageLogic" ProviderID="dashBoardStateProvider"
ProviderConnectionPointID="DashBoardPageContextExport" ConsumerID="DashBoardPageLogicWP"
ConsumerConnectionPointID="PageContext" />
</StaticConnections>
</asp:ProxyWebPartManager>
<div class="pg-scroll-fixed lx-clear">
<CFBase:BaseWebPartZone runat="server" ID="WPTopZone">
<ZoneTemplate>
<WebParts:TabWebPart runat="server" Description="DashBoard" ID="DashBoardTabWP" ChromType="None"
IsRMLogRequired="true" />
<DashBoardWebParts:DashBoardStateWebPart runat="server" ID="dashBoardStateProvider"
ChromeType="None" ChromeState="Minimized" />
<DashBoardWebParts:DashBoardPageLogic runat="server" ID="DashBoardPageLogicWP" ChromeType="None" />
</ZoneTemplate>
</CFBase:BaseWebPartZone>
</div>
<UC:PartialViewShim runat="server" ID="LandingPageIndex" Area="MedLit" Controller="Research"
View="ResearchView" />
</asp:Content>
Rendering css dynamically -
$(function () {
var $head = $("#frame").contents().find("head");
$head.append($("<link/>", { rel: "stylesheet", href: '/Pages/CSS/layoutMedLitHome.css', type: "text/css" }));
$head.append($("<link/>", { rel: "stylesheet", href: '/Pages/CSS/Master0.css', type: "text/css" }));
$head.append($("<link/>", { rel: "stylesheet", href: '/Pages/CSS/compNewLexis0.css', type: "text/css" }));
$head.append($("<link/>", { rel: "stylesheet", href: '/Pages/CSS/Search0.css', type: "text/css" }));
alert('head:' + $head.val());
});
` within a `` tag?
– bPratik Aug 02 '12 at 10:44