Clean way to pass data to Master Page from View in ASP.NET MVC2 (set css class from view) - asp.net-mvc-2

I have a ASP.NET MVC2 application with a master page. The master page renders the site layout divs as follows:
<div id="wrapper">
<div id="column1">
{contentplaceholder}
</div>
<div id="column2">
{contentplaceholder}
</div>
</div>
In my View, I would like to apply a classname to the wrapper div, so when viewing the homepage, the wrapper div would be:
<div id="wrapper" class="homepage">
</div>
or on the contact page it would be
<div id="wrapper" class="contact">
</div>
Ideally I would like to set this variable in the view aspx page, rather than in a controller action. What would be the cleanest way to achieve this? I was thinking something along the lines of:
In Master page:
<div id="wrapper" class="<%=WRAPPER_CLASS%>">
</div>
and then in View:
<% WRAPPER_CLASS = "contact"; %>
(obviously the above example doesn't work, but does anyone have any good ideas?)

Why not try this, within the master page:
<div id="wrapper" class="<asp:ContentPlaceHolder ID="page-class" runat="server" />">
</div>
and in the aspx view
<asp:Content ID="page-class-content" ContentPlaceHolderID="page-class" runat="server">
homepage
</asp:Content>

Related

AEM anchor tag stripped out in locahost

When I use an anchor tag without an href="" all is good and the button style is there, the second a add an href it completely removes the anchor tag and leave only the text inside the parent div
without href:
<div class="container">
<a class="button"> my button</a>
</div>
result in browser devtools
<div class="container">
<a class="button"> my button</a>
</div>
with href
<div class="container">
my button
</div>
result in browser
<div class="container">
my button
</div>
Looks like this could be the work of the link checker. Try adding x-cq-linkchecker="skip":
<div class="container">
<a x-cq-linkchecker="skip" href="/content/mypage.html" class="button"> my button</a>
</div>
I guess it might be also related to xssconfig
as you add 'href' attribute to div in your example
<div href="/content/mypage.html" class="container">
<a class="button"> my button</a>
</div>
In general it is not allowed, therefore AEM can remove it
/libs/cq/xssprotection/config.xml

Metro style facebook/twitter buttons on my website

I want to show windows 8 style tiles (square buttons) for facebook like and twitter follow buttons with follower counts on my website. Which looks like below. Any suggestion?
I Have Done it With HTML And CSS But You Have To Update The Followers Count Manually.I Am Giving You The Code Here And Visit My Blog For A Live Demo And I Encoded The Images With base64 I Will try to Get Followers Count Automatically Using ApI's.
<div style="width:100px;height:100px;background:#00a0d1;color:#ffffff;">
<img src="data:image/png;base64,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" width="50px" height:50px"/>
<div style="text-align:right;padding-right:10px;padding-bottom:10px;">
296<br/>Followers
</div>
</div>
<div style="margin-top:-100px;margin-right:116px;width:100px;height:100px;background:#3B5998 ;color:#ffffff;float:right">
<img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEASABIAAD/4QCYRXhpZgAATU0AKgAAAAgABAEaAAUAAAABAAAAPgEbAAUAAAABAAAARgEoAAMAAAABAAIAAIdpAAQAAAABAAAATgAAAAAAAABIAAAAAQAAAEgAAAABAAWQAAAHAAAABDAyMTCgAAAHAAAABDAxMDCgAQADAAAAAQABAACgAgAEAAAAAQAAADKgAwAEAAAAAQAAADMAAAAA/+ECzmh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8APD94cGFja2V0IGJlZ2luPSfvu78nIGlkPSdXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQnPz4KPHg6eG1wbWV0YSB4bWxuczp4PSdhZG9iZTpuczptZXRhLyc+CjxyZGY6UkRGIHhtbG5zOnJkZj0naHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyc+CgogPHJkZjpEZXNjcmlwdGlvbiB4bWxuczpleGlmPSdodHRwOi8vbnMuYWRvYmUuY29tL2V4aWYvMS4wLyc+CiAgPGV4aWY6WFJlc29sdXRpb24+NzI8L2V4aWY6WFJlc29sdXRpb24+CiAgPGV4aWY6WVJlc29sdXRpb24+NzI8L2V4aWY6WVJlc29sdXRpb24+CiAgPGV4aWY6UmVzb2x1dGlvblVuaXQ+SW5jaDwvZXhpZjpSZXNvbHV0aW9uVW5pdD4KICA8ZXhpZjpFeGlmVmVyc2lvbj5FeGlmIFZlcnNpb24gMi4xPC9leGlmOkV4aWZWZXJzaW9uPgogIDxleGlmOkZsYXNoUGl4VmVyc2lvbj5GbGFzaFBpeCBWZXJzaW9uIDEuMDwvZXhpZjpGbGFzaFBpeFZlcnNpb24+CiAgPGV4aWY6Q29sb3JTcGFjZT5zUkdCPC9leGlmOkNvbG9yU3BhY2U+CiAgPGV4aWY6UGl4ZWxYRGltZW5zaW9uPjY0MDwvZXhpZjpQaXhlbFhEaW1lbnNpb24+CiAgPGV4aWY6UGl4ZWxZRGltZW5zaW9uPjM2MDwvZXhpZjpQaXhlbFlEaW1lbnNpb24+CiA8L3JkZjpEZXNjcmlwdGlvbj4KCjwvcmRmOlJERj4KPC94OnhtcG1ldGE+Cjw/eHBhY2tldCBlbmQ9J3InPz4K/+IMWElD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" width="50px" height:50px"/>
<div style="text-align:right;padding-right:10px;padding-bottom:10px;">
296<br/>Likes
</div>
</div>
<div style="margin-top:-100px;margin-right:11px;width:100px;height:100px;background:#dd4b39 ;color:#ffffff;float:right">
<img src="data:image/png;base64,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" width="50px" height:50px"/>
<div style="text-align:right;padding-right:10px;padding-bottom:10px;">
296<br/>Circles
</div>
</div>

Forms within Bootstrap tabs not working/submitting

I'm faced with a simple problem but just don't know how to solve it. I'm using twitter bootstrap's tabs. The tabs work but the forms within each tab don't submit. The forms submit when used without the tabs.
Below is the links I've used for the tabs
<ul class="nav nav-list affix tabs" data-tabs="tabs">
<li>
Overview
</li>
<li>
Profile
</li>
</ul>
And what follows are the tabs
<div class="tab-content span9">
<div id="overview" class="tab-pane" data-toggle="tab">
<!-- Overview Forms go here -->
</div>
</div>
<div class="tab-content span9">
<div id="profile" class="tab-pane" data-toggle="tab">
<!-- Profile Form go here -->
</div>
</div>
Finally I've added the following jquery
$('.tabs').tab();
$('.tabs a[href="#profile"]').tab('show');
Same goes for bootstrap panels, when you have a form inside panel-body and try to submit the form nothing happens. You have to remove the "panel-collapse" class from the body :)

Facebook like button not rendering in div with display:none

I am well aware that there are almost 10 duplicates of this question. But solutions of none of them work for me. So here are the details:
I am using carousel from bootstrap. I use carousel to display set of 3 divs on each cycle.
The structure is as follows:
<div id="myCarousel" class="carousel slide">
<div class="carousel-inner">
<div class="active item">
<div class="span4>content along with FB like button </div>
<div class="span4>content along with FB like button </div>
<div class="span4>content along with FB like button </div>
</div>
<div class="item"> <!-- this div has display:none -->
<div class="span4>content along with FB like button </div>
<div class="span4>content along with FB like button </div>
<div class="span4>content along with FB like button </div>
</div>
</div>
<a class="carousel-control left" href="#myCarousel" data-slide="prev">‹</a>
<a class="carousel-control right" href="#myCarousel" data-slide="next">›</a>
</div>
Above is the stripped down version, just to leave out the unnecessary stuff. The problem is, all the Facebook like buttons inside the div which has display:none set have width and height set to 0.
This problem occurs in Firefox(the latest version).
I am using the HTML5 version of like button generated using FB like button configurator.
Below is the resultant like button code in the hidden div:
<div data-show-faces="true" data-width="450" layout="box_count" data-send="false" class="fb-like fb_edge_widget_with_comment fb_iframe_widget" fb-xfbml-state="rendered">
<span style="height: 0px; width: 0px;">
<iframe scrolling="no" style=" height: 0px; width: 0px; class="fb_ltr fb_iframe_widget_lift" src="">
</iframe>
</span>
</div>
The like buttons in the active divs are the only ones visible. Even those in the modals (which are hidden initially) are not visible too.
How do I make it visible when div has display:none?
I had the exact same issue you are having and my code solution is below. The key thing to note is that anytime you see the facebook generated code having a height and width of 0 it means that the facebook button is loaded while the CSS on it is display:none. You can't just force it to be displayed because it is possible that the facebook button hasn't fully loaded by the time the bootstrap carousel has loaded. The trick is to display all your items in the carousel using active on the initial load then once your facebook buttons have loaded you can remove active from your non-starting slide.
<div id="myCarousel" class="carousel slide">
<div class="carousel-inner">
<div class="active item">
<div class="span4>content along with FB like button </div>
<div class="span4>content along with FB like button </div>
<div class="span4>content along with FB like button </div>
</div>
<div class="active item"> <!-- this div also is active for initial load -->
<div class="span4>content along with FB like button </div>
<div class="span4>content along with FB like button </div>
<div class="span4>content along with FB like button </div>
</div>
</div>
<a class="carousel-control left" href="#myCarousel" data-slide="prev">‹</a>
<a class="carousel-control right" href="#myCarousel" data-slide="next">›</a>
</div>
window.fbAsyncInit = function () {
FB.Event.subscribe('xfbml.render', function () {
$('.carousel-inner>.item:not(:first-child)').removeClass('active');
});}
If you set a div to display:none; by default all of the child objects will have display:none which means they wont show up. Same if you set the size to zero.
IMHO it's not the right way to do it, but try setting the child object to display: block; or display: inline; and giving it a defined size.
Put iframe version of Like button in any hidden content and it will work.
worked for me like a charm
I had similar issue but only in IE. I saw that iframe width and height stayed 0. This solved my problem:
.fb-like.fb_iframe_widget iframe{
width:60px !important;
height:60px !important;
}

Need help laying out a site with dojo

basically guys i will like to layout a website with dojo where by i will have a header, content area ( this is divided in two with some accordions in the left pane and the right for the main content) then a footer.
since i need the site to always have this layout i decided to put it in the master layout. however when i view the site, i see the default index page alright but its not in the pane as i was hoping and none of the dijit widgets gets rendered.
not sure if pasting large code in a post is allowed if not i am sorry but below is the code for the master layout. i have not done much to the default zend tool structure. i have only created a couple of modules:
<?php
Zend_Dojo::enableView($this);
$this->dojo()->setCdnBase(Zend_Dojo::CDN_BASE_GOOGLE)
->addStyleSheetModule('dijit.themes.tundra')
->setDjConfigOption('parseOnload', TRUE)
->setDjConfigOption('locale', 'en-GB')
->setDjConfigOption('isDebug', TRUE);
echo $this->dojo();
?>
<script type="text/javascript">
dojo.require("dijit.layout.ContentPane");
dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.TabContainer");
dojo.require("dijit.layout.AccordionContainer");
</script>
</head>
<body>
<div dojoType="dijit.layout.BorderContainer" gutters="true" id="borderContainer">
<div id="header" dojoType="dijit.layout.ContentPane" region="top" splitter="false">
<div id="logo">
<img src="/images/logo.gif" />
</div>
<div id="menu">
HOME
SERVICES
CONTACT
</div>
</div><!-- end header -->
<div dojoType="dijit.layout.BorderContainer" liveSplitters="false" design="sidebar"
region="center" id="content">
<div dojoType="dijit.layout.AccordionContainer" minSize="20" style="width: 300px;"
id="leftAccordion" region="leading" splitter="true">
<div dojoType="dijit.layout.AccordionPane" title="One fancy Pane">
</div>
<div dojoType="dijit.layout.AccordionPane" title="Another one">
</div>
<div dojoType="dijit.layout.AccordionPane" title="Even more fancy" selected="true">
</div>
<div dojoType="dijit.layout.AccordionPane" title="Last, but not least">
</div> <!-- end AccordionContainer -->
</div>
<div dojoType="dijit.layout.TabContainer" region="center" tabStrip="true">
<div dojoType="dijit.layout.ContentPane" title="My first tab" selected="true">
<?php echo $this->layout()->content ?>
</div>
<div dojoType="dijit.layout.ContentPane" title="My second tab">
Lorem ipsum and all around - second...
</div>
<div dojoType="dijit.layout.ContentPane" title="My last tab" closable="true">
Lorem ipsum and all around - last...
</div>
</div>
</div>
<div id="footer">
<p>Created with Zend Framework. Licensed under Creative Commons.</p>
</div><!-- end footer -->
</div>
You have a typo when setting your dojo config options. Instead of
->setDjConfigOption('parseOnload', TRUE)
it needs to be
->setDjConfigOption('parseOnLoad', TRUE)
Watch the uppercase 'L'. If you fix this then at least the dojo parser will do it's job.
Didn't check if your layout is OK, see the comment of Ken.