Develop Reference

C# Access asp control from Parent page

I have a parent page containing an iframe, an ASP label and a button.
When the user click on the parent button, it will display some table results inside the iframe.
Now i would like to display the parent label with different text and color depending on the results of the iframe.
So i m trying in the code behind (C#) of the iframe to retrieve the label from the parent and assign it a CssClass. But no matter what i do it always come back with a null reference when trying to find the control from the parent.
Can someone please help?
Parent page code:
<div class="search-row">
<div class="search">
<button id="btnSearch" type="submit" class="button button-block">Search</button>
</div>
<div class="search" style="padding-top: 20px;">
<asp:Label ID="wrapperResponse" CssClass="resp" runat="server">TEST</asp:Label>
</div>
</div>
<div id="iframeDiv">
<iframe name="my_frame" width="100%" height="350px" src="Results.aspx" scrolling="no" frameborder="0"></iframe>
</div>`
The Results.aspx will display a table with some html build dynamically.
Now let s say if resulting Table has one row, i would like Label WrapperReponse to be in Green and says "1 row" but if 2 rows then i would like it to be in Red and says "2 Rows"
In my Results.aspx.cs i tried
String test= String.Format("{0}", Request.Form["wrapperResponse"]);
Label statusResponse = (Label)this.FindControl("wrapperResponse");
Label statusResponse2 = (Label)Parent.FindControl("wrapperResponse");
Any ideas are welcome!
thanks

Well, just a couple of points needed mentioning here. Food for thought.
In order to access the asp label control, you need to do it on the parent page instead of on the results page.
I would suggest you reconsider the design of the page. Do you really have to use the iframe here? Why not place your button and label controls on the results.page directly? Or perhaps make results.aspx as an ASCX user control, so you can embed it on the parent page.
Hope it helps

Left align text but right align button inside of a panel using Bootstrap and ASP.NET

I am writing my first web application using Twitter Bootstrap and ASP.NET with C# on the back-end. I have buttons and labels inside of a Bootstrap panel. I would like to align the labels to the left and the buttons to the right. Here is my code so far:
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title">Overview</h3>
</div>
<div class="panel body">
<p>
<asp:Label ID="BandsProducedLabel" runat="server" Text="Bands Produced:"></asp:Label>
<asp:Button class="btn btn-default" ID="BandsProducedBtn" runat="server" Text="Hello" style="text-align:right" />
</p>
<\div>
<\div>
How can I accomplish this task? This is only a small snippet of code. I have about 15 other panels that I would like to apply the same styling to.

If you want to use standard Bootstrap styles, you can give the label the CSS class "pull-left" and the button "pull-right".
For the correct result, you might have to reverse the source order, that is, have the button come first and then the label, in the markup.
Another option would be to use the Bootstrap grid system to place these two elements side by side.

Saving dynamically generated html attributes in a database (Asp.Net, Jquery)

I am working on a self design dashboard page. Users drag&drop custom sized boxes in a div element and place some data inside boxes. Once they finish, I would like to save the certain attributes of these boxes in a db, instead of saving whole html code.
<div id="widget0" class="box span2">
<div class="box-header well" style="padding-left: 3px;" data-original-title="">
<div style="float:left">
<i class=" icon-chevron-left"></i>
<i class=" icon-chevron-down"></i>
<i class=" icon-chevron-up"></i>
<i class=" icon-chevron-right"></i>
</div>
<div style="float: right !important; margin-right: -15px;">
<i class="icon-remove"></i>
</div>
</div>
<div class="box-content">
<div id="boxContent0" style="width:100%;height:250px;border-collapse:collapse;" class="ui-droppable">
</div>
</div>
</div>
Above is a sample html code of my box. I'll just save div id, class and contents.
What I've done so far is, I saved required values in an asphiddenfield on a button click event in this format:
"2|widget0,span4,content1,content2|widget1,span3,0,0"
I did this by handling form submit event using jquery, triggered by asp button click. But the db write operations required in my server button click function didn't work. I think this is because I handled the form submit event before btnSaveDashboard_Click(object sender, EventArgs e) function handles and submit the form from jquery..
What I would like to do is, when user click on "save dashboard" button, before redirecting to the dashboard view page, to save these values in my db then redirect.
I just couldn't find a way how to do this with one button click;
get the required html values
save them in a hidden field or somewhere else reachable like viewstate
save these values in my database
I can more provide more details in case needed.
Thanks.

You could use the Button's OnClientClick client side event to populate the HiddenField with the values you need before the Postback occurs.
If you accomplish that, you should have the values you want on the Button's OnClick server side event. You should be able to do whatever you want with them at this point.

JQuery Tabs in asp.net to stay on reload

i'm having a JQuery tab on my page and currently when i reload or run some serverside codes , the tab would go back to the first one, is there a way to make the tabs stay?
I would like my tab to stay on the current selected tab rather than go back to the first tab when the page reloads
My JQuery:
$(function () {
var tabContainers = $('div.tabs > div');
$('div.tabs ul.tabNavigation a').click(function () {
tabContainers.hide();
tabContainers.filter(this.hash).show();
$('div.tabs ul.tabNavigation a').removeClass('selected');
$(this).addClass('selected');
return false;
}).filter(':first').click();
});
My tabs:
<div class="tabs">
<ul class="tabNavigation">
<li>Annoucments</li>
<li>Events</li>
<li>Photos</li>
<li>Job Opportunities</li>
<li>Contacts</li>
<li>Videos</li>
</ul>
<div id="Annoucments" class="ContentDIV">
..
</div>
<div id="Events" class="ContentDIV">
..
</div>
<div id="Photos" class="ContentDIV">
..
</div>
<div id="JobOpportunities" class="ContentDIV">
..
</div>
<div id="Contacts" class="ContentDIV">
...
</div>
<div id="Videos" class="ContentDIV">
..
</div>
</div>

You need to save user state somewhere:
Url - parse url and determine whether it's yours tab secion or not.
Cookies - write to cookie user information (e.g. selected tab).
Session - same as for cookie.
Custom Hidden field or asp.net ViewState.

One thing you can try is to keep a hidden field that maintains the href value of the currently selected tab. This way, when there is a postback, you can read the value from that hidden field and select the correct tab.

Put a get parameter in your page url. So you could have yourpage.aspx?page=1 for example. Then just pull that parameter out of the querystring and either apply the 'selected' class in your server side code (which would be best) or in jQuery on the page directly (not as good a solution but it'll work too) to the appropriate tab.
EDIT (Code Sample)
$('#[formID]').onSubmit(function () {
var tab = $('.selected').prop('href');
// Append a hidden field to the form containing tab. Example below
return true;
}
...and then when you load your page from the server, simply look at the value passed and apply the 'selected' class to the element.
Example:
jQuery - add additional parameters on submit (NOT ajax)

How do I include the id of a Jquery UI Tab in the url?

I have three tabs on a page called Main.aspx. I want it so that when the user first accesses Main.aspx, the url changes to the default tab and when a different tab is clicked, the url changes to refer to the id of that tab. So for example, if they click Second Tab, I want the url to be Main.aspx#secondTab. That way, if they refresh the page, it will remain on the current tab.
How would I accomplish this?
<div id="everyNavigationTabID" class="everyNavigationTabClass">
<ul class="singleTabNavigationClass">
<li>First Tab</li>
<li>Second Tab</li>
<li>Third Tab</li>
</ul>
<div id="firstTab" class="tabContent">
First Tab
</div>
<div id="secondTab" class="tabContent">
Second Tab
</div>
<div id="thirdTab" class="tabContent">
Third Tab
</div>

You can use the document.location.hash property to add # fragments to your current URL.
Something like -
$("div.tabContent").on('click',function(evt){
document.location.href = document.location.href + "#" + $(this).attr('id');
evt.preventDefault();
});
Then on your $(function() (document.ready) function you can examine the document.location.hash variable and take appropriate actions.