Issue with RenderOuterTable property for .NET 4.0 controls - c#

According to the new 4.0 framework overview, one should be able to add the attribute RenderOuterTable="false" to a control that supports the attribute and see CSS friendly code be spit out - in other words no HTML tables.
To test this, I threw a login control into a basic fresh webpage with the following code:
<asp:Login ID="Login1" runat="server" RenderOuterTable="false"></asp:Login>
The result? Crappy HTML table output, which supposedly doesn't happen with this attribute set to false. Here is the output:
<table cellpadding="0">
<tr>
<td align="center" colspan="2">Log In</td>
</tr>
<tr>
<td align="right"><label for="MainContent_Login1_UserName">User Name:</label></td>
<td>
<input name="ctl00$MainContent$Login1$UserName" type="text" id="MainContent_Login1_UserName" />
<span id="MainContent_Login1_UserNameRequired" title="User Name is required." style="visibility:hidden;">*</span>
</td>...
Hopefully you get the point. How can these controls be stopped from outputting tables? This is super annoying.

Convert the Login control to a template. It will give you full control of the layout without a table in sight (including the outer table which previously got generated even if you used the template option).

It doesn't say that it will get rid of all tables, just that it will get rid of the extra outer table that was used to apply styles. Try getting rid of the property and note the extra table that wraps the one you quoted above.

Related

Keeping values in textboxes permanently until changed by user in a sharepoint webpart

I am working on a Visual Web Part for a SharePoint 2013 site that is a "scoreboard" for people to track progress on a project. Basically what I have is a lot of textboxes that users will enter values in. I want the values to stay in the textbox until someone changes it.
<tr>
<td> </td>
<td>A-Crew</td>
<td>B-Crew</td>
<td>C-Crew</td>
<td>D-Crew</td>
</tr>
<tr>
<td>Daily</td>
<td>
<input id="msaCrewDaily" type="text" />
</td>
<td>
<input id="msbCrewDaily" type="text" />
</td>
<td>
<input id="mscCrewDaily" type="text" />
</td>
<td>
<input id="msdCrewDaily" type="text" />
</td>
</tr>
A few things I have tried are using PHP inside the input tag to save the value but it doesn't keep it after closing and re-opening the page with webpart on it. I've thought about using local storage but i'm not sure if that will work.
My Question
Is there a way to keep the the input even if the page is closed? If not would it be better to set up a list as a Data Source? Is the something I could do in C# to keep the values?
Other Information
This is a temporary solution until a database is set up then the values will come from there. However its going to take some time to set that up. Also as of now all my code is HTML and CSS. Any help or ideas are very much appreciated and thank you in advanced!!!
So my understanding is each user opens the page and edits the value right? Then why not create a simple list with the required columns you create one item with default 0 values/or whatever you want. And send the display Item form url to all the users. Whoever wants to edit, will just click on edit and save the form. You can in fact just add this on the page enabling the inline editing and share the page with others.
You can use local storage "jStorage" write a javascript which will be called onkey of textbox and store value on local storage and call it on page load. Just check on page load if local storage contains any value if yes then set the textbox with that value

C# Repeaters while amending some figures

I have a very large finance table, which will be repeated 4 times on a page, across many different pages. I don't like the idea of just copying the table across pages. Am I correct in thinking that I can create a repeater which repeats it? But also at the same time amend figures in the backend?
I have looked around, but wasn't to sure whether the amending of figures was possible as well as more efficient?
<div class="span3 finance-boxes">
<table class="table table-bordered table-hover finance-table">
<tr><td>Title</td></tr>
<tr><td class="fig">Figure</td></tr>
<tr><td>Title</td></tr>
<tr><td class="fig">Figure</td></tr>
<tr><td>Launch Finance Details</td></tr>
</table>
</div>
As I understand from your explanation you need to repeat the same piece of HTML on many places with only difference of some values of some cells. So I suggest you create a new ASCX control.
Webusercontrol is very similar to asp.net page, but has .ascx extension and can be inserted onto page or other control. So to create it use Add -> New Item -> Web User Control in VisualStudio.
The web user control will have markup file .ascx and code-behind .ascx.cs file.
Place your html on markup file:
<div class="span3 finance-boxes">
<table class="table table-bordered table-hover finance-table">
<tr><td>Title</td></tr>
<tr><td class="fig" runat="server" ID="cell1"></td></tr>
<tr><td>Title</td></tr>
<tr><td class="fig" runat="server" ID="cell2"></td></tr>
<tr><td>Launch Finance Details</td></tr>
</table>
</div>
Now in the code-behind you can access your cells by cell1 and cell2 and you can change their inner html by cell1.InnerHtml property.
You can create public properties in your code behind file to have access to these cells from the page:
public string Cell1Text
{
get
{
return cell1.InnterHtml;
}
set
{
cell1.InnterHtml = value;
}
}
Then you can place your web user control on your page.
You can read more about this here:
http://weblogs.asp.net/scottgu/archive/2006/11/26/tip-trick-how-to-register-user-controls-and-custom-controls-in-web-config.aspx
Finally you will be able to access and modify your control's properties by this piece of code:
myUserControlName.Cell1Text = "NEW TEXT";

AJAX Toolkit and Listview

I am working on a web application. The process regarding the problem is that I am fetching users comments from DB using Entity Framework Model. I am using a listview to show Customers Name, Rating and Comments.
The problem is that I am using a Ajax toolkit control called HTMLEditor for storing comments in the DB, so when I have to display the comments, I need the same control ie HTML Editor. Now when I use the following code to create the ITEMTEMPLATE for the listview,
<ItemTemplate>
<tr style="background-color:#EDECB3;color: #000000;">
<td><%# Eval("CustomerName")%></td>
<td> <img src='Styles/Images/ReviewRating<%# Eval("Rating") %>.png' alt="">
<br />
</td>
<td> <cc1:Editor ID="Comments" runat="server" Text="<%#Eval("Comments") %>"/>
</td>
</tr>
</ItemTemplate>
Everything is working except the line
<td> <cc1:Editor ID="Comments" runat="server" Text="<%#Eval("Comments") %>"/>
</td>
It says that the server tag is not well formed. please help.
Updated Error: I added nounicode="true". and the error I encountered is
Could not find any resources appropriate for the specified culture or
the neutral culture. Make sure
"AjaxControlToolkit.Properties.Resources.NET4.resources" was correctly
embedded or linked into assembly "AjaxControlToolkit" at compile time,
or that all the satellite assemblies required are loadable and fully
signed.
you should try
<cc1:Editor ID="Comments" runat="server" Text="<%#Eval('Comments') %>"/>
the text proprty is not the same.
Try below code:
Text='<%#Eval("Comments") %>'
Using the ScriptManager on the page solve the problem.
As far as the problem of displaying HTML text in HTML Editor is concerned, I decided not to use the HTML Editor from Ajax Control Toolkit. Rather I displayed the html text raw on the page using the html decoding utility like this,
<%#Server.HtmlDecode(Eval("Comments").ToString()) %>
"rr_only4you" told that answer is correct, i got the error like use blow one
Text="<%#Eval("Comments") %>"
after that i change that to
Text='<%# Eval("Comments") %>'
this format it will correct,
you use this one
<cc1:Editor ID="Comments" runat="server"><%# Eval("Comments") %></cc1>

CSS access columns in table

I have html that is dynamically created when I bind my gridview to a data source. What i'm curious about is how can i use css to access an individual column and even individual cells? If i was manually creating the html i would put an id attribute in there but i'm able to because it's dynamically created when the program begins. Here is the html out put generated
<div>
<table cellspacing="0" rules="all" border="1" id="ContentPlaceHolderHome_GridView1" style="border-collapse:collapse;">
<tr>
<th scope="col">Date</th><th scope="col">Project</th><th scope="col">Amount</th>
</tr><tr>
<td>1/1/2011 12:00:00 AM</td><td>CTS</td><td>1000.99</td>
</tr><tr>
<td>2/1/2011 12:00:00 AM</td><td>ABC Company</td><td>1001.99</td>
</tr><tr>
<td>1/3/2011 12:00:00 AM</td><td>CTS</td><td>1002.99</td>
</tr><tr>
<td>4/1/2011 12:00:00 AM</td><td>CTS</td><td>1003.99</td>
</tr>
</table>
</div>
The table has an id, so you can use that to access the elements inside that table.
For example, to select the second cell on the third row, you can use:
#ContentPlaceHolderHome_GridView1 tr:nth-child(3) td:nth-child(2)
The nth-child() selector is supported on all major browsers except IE8 and earlier.
My guess here would be that you would need to modify whatever is making the tables so that it adds some kind of class or id to those cells.
You can use the CssClass property to define a css class name for the controls.

Reading dynamically generated HTML element value in codebehind in ASP.NET

I have an asp.net page where I have the below markup. Basically this markup is generated from codebehind by reading records from a table and looping through them. For each record in table, there will be a div block.
Basically this form is to read/show settings for a user. The settings entries are stored in a table.
<div id='divContainer' runat='server'>
<div id='div1' runat='server'>
<table>
<tr>
<th>Name</th>
<td><input type='text' id='txtName1' value='something' /></td>
</tr>
</table>
</div>
<div id='div2' runat='server'>
<table>
<tr>
<th>Domain name</th>
<td><input type='text' id='txtName2' value='something' /></td>
</tr>
</table>
</div>
<div id='div3' runat='server'>
<table>
<tr>
<th>URL</th>
<td><input type='text' id='txtName3' value='something' /></td>
</tr>
</table>
</div>
<div id='div4' runat='server'>
<table>
<tr>
<th>Some other value is enabled ?</th>
<td><input type='checkbox' id='chk4' /></td>
</tr>
</table>
</div>
</div>
The id's of each input element will be unique. Now in codebehind I want to read the values of each input element to save the changes user made. How can I read the elements here? Since the mark up is generated in codebehind as a string and appended the the INNER HTML of the external div, I can't read values like we do for a control which we drag and drop in the IDE.
If these are being sent back to the page in a standard HTTP POST then you can read the values in the Request.Form NameValueCollection.
Essentially, all of the server controls that become form elements get translated into standard HTML form elements just as you have there, albeit with more markup generated by .NET to help it identify them. Then it automatically maps their values back to the server controls for you on the postback, but the values themselves are still just in a standard HTTP POST, which you can access manually.
(This is also a common method used when posting a form from one ASP .NET application to another.)
If you want to grab your values for the generated controls you have to do 2 things.
Generate the input controls with a runat='server' tag for each control (otherwise they will not be included in the Request.Forms collection.) This is probably the step your missing.
<input type='text' id='txtName1' runat='server' value='something' />
Grab your values from the Request.Form collection on postback
string txtValue1 = Request.Form["txtName1"];
It really should be that easy. I tested this against your code using a DIV as the container and a simple javascript to inject the control string into the innerHTML. If your getting any issues you may have to debug and see if the dynamic control ID has changed due to inserting them into naming container or something.
So the brunt of the story is that when you dynamically add a control after Page_Init then POSTBACK values can not be inserted back into those controls.
CF: http://www.15seconds.com/issue/020102.htm and http://msdn.microsoft.com/en-us/library/ms178472.aspx
Some of the other answers here suggest "oh, add a runat=server to the control" but when you create it in the codebehind, and not in the Page_Init, then that makes ZERO difference.
Let me know if that's not how you're creating the controls or if that's not how you're using them and I'll revise this answer on more details. It really all boils down to how you're trying to access the values.
Generally, you'd place those input controls you're creating dynamically (in this case, a TextBox) inside something like a panel control (the container). Then after the user has posted their data, you'd loop that container panel.Controls collection and retrieve each TextBox text.
Be aware that some caveats apply when working with dynamically created controls because ASP is of stateless nature.
This page shows how to implement this:
Adding Dynamic Rows in ASP.Net GridView Control with TextBoxes
I didn't test it but I can suggest that:
Add your dynamic controls with runat="server" tag inside another controls with runat="server"(such as panel control). Then you can access them like this:
Textbox t = (Textbox)panel1.controls.findControl("dynamicControlId");

Categories