Changing HTML element's style property from code behind - c#

I have a HTML page which is dynamically generating by server. The application has an IDE to generate and design pages then deploy the server. The server displaying this pages in an iframe. We can use all c# methods as well as Page_Load and Page_PreRender events in pages. But I can't modify source code of the asp.net page (I mean can't add runat="server").
What I want to do, finding a html tag by css class (#form1 > span) before pre-render then add a new css property in code behind.
<form id="form1" action="DocumentViewer.aspx" method="post" autocomplete="off">
<span>
<table>
<tr>
<td></td>
</tr>
</table>
</span>

Without runat="server" you cannot access the control in code behind. Best way to do it is to inject the jquery script from code behind to do the same work.
Please take a look at this answer.

Related

ASP.NET C# how to Ignore certain styling in MasterPage

So I created a master page which serves as the Header and Footer template for every other template, the problem however, in one of the form, I put all the HTML that I wanted, CSS and JS when I load it theres some problem with the result. I figure out the problem is caused by this code
<form id="form1" runat="server">
If I remove that code, then the output will be what I want, the problem is that I dont want to remove that code in the MasterPage, is there a way to set that the Web form that follow that masterPage will ignore the
<form id="form1" runat="server">
Thanks and have a great day

CKeditor on Textarea implementation

I have implemented a CKeditor from the below link:-
CKEditor But the issue is that, As soon as I register the editor on my page, it gets reflected. I want the same editor just only for my asp.net textbox. What should I do and make change so that It can only be visible to my textbox only. Please help.
See my textbox
<asp:TextBox ID="txtPostdesc" CssClass="form-control" runat="server" ValidationGroup="AddNew" TextMode="MultiLine"></asp:TextBox>
As per the article CKEditor in ASP.Net it described the way of implementing CKEditor with dll.
You would require following things
1. Two dll : CkEditor.dll and CKEditor.NET.dll.
2. CKEditor folder containing all js, css and images.
Register the CKEditor control at the top of your .aspx page such as
<%# Register Assembly="CKEditor.NET" Namespace="CKEditor.NET" TagPrefix="CKEditor" %>
Now you will be able to write the CKEditor server control markup such as below
<CKEditor:CKEditorControl ID="txtPostdesc" BasePath="/ckeditor/" runat="server">
</CKEditor:CKEditorControl>
In above I just change the ID as per your textarea ID. Now you can set and get its content via .Text Property in your code behind file i.e.
string str = txtPostdesc.Text;
Hope above explanation works for you.

post a <FORM> to sharepoint page

I am doing following in one of my webpart .ascx file.
<FORM action="https://illustration.sagicorlifeusa.com/fse5/main/FormPost.aspx" id="frmLogin" method="post" target=blank>
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<%= CompleteRequest %>
<input type="submit" name="__exclude__Submit" value="Run Sagicor Life Illustration Software Online" />
Notice the method="post"; However, looks like when I add this web-part, The hosting page already has a <FORM/> . How can I do the above POST?
posting to a new window from inside an ASPX web form (which SharePoint is) is tricky, because the framework wraps everything in a <form> it keeps track of. If you are required to post to the target page (i.e. get isn't good enough), you might have to:
create a separate .aspx page entirely to produce the form
open that form from within your Web Part with a JS call to window.open or an <a href="..." target="blank"
auto-post that form, with JavaScript, as soon as it loads.
(I have no firsthand experience with sharepoint; take this answer with a grain of salt.)

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");

How to edit CSS style of a div using C# in .NET

I'm trying to grab a div's ID in the code behind (C#) and set some css on it. Can I grab it from the DOM or do I have to use some kind of control?
<div id="formSpinner">
<img src="images/spinner.gif" />
<p>Saving...</p>
</div>
Add the runat="server" attribute to it so you have:
<div id="formSpinner" runat="server">
<img src="images/spinner.gif">
<p>Saving...</p>
</div>
That way you can access the class attribute by using:
formSpinner.Attributes["class"] = "classOfYourChoice";
It's also worth mentioning that the asp:Panel control is virtually synonymous (at least as far as rendered markup is concerned) with div, so you could also do:
<asp:Panel id="formSpinner" runat="server">
<img src="images/spinner.gif">
<p>Saving...</p>
</asp:Panel>
Which then enables you to write:
formSpinner.CssClass = "classOfYourChoice";
This gives you more defined access to the property and there are others that may, or may not, be of use to you.
Make sure that your div is set to runat="server", then simply reference it in the code-behind and set the "class" attribute.
<div runat="server" id="formSpinner">
...content...
</div>
Code-behind
formSpinner.Attributes["class"] = "class-name";
This question makes me nervous. It indicates that maybe you don't understand how using server-side code will impact you're page's DOM state.
Whenever you run server-side code the entire page is rebuilt from scratch. This has several implications:
A form is submitted from the client to the web server. This is about the slowest action that a web browser can take, especially in ASP.Net where the form might be padded with extra fields (ie: ViewState). Doing it too often for trivial activities will make your app appear to be sluggish, even if everything else is nice and snappy.
It adds load to your server, in terms of bandwidth (up and down stream) and CPU/memory. Everything involved in rebuilding your page will have to happen again. If there are dynamic controls on the page, don't forget to create them.
Anything you've done to the DOM since the last request is lost, unless you remember to do it again for this request. Your page's DOM is reset.
If you can get away with it, you might want to push this down to javascript and avoid the postback. Perhaps use an XmlHttpRequest() call to trigger any server-side action you need.
Add the runat="server" attribute to the tag, then you can reference it from the codebehind.
Add runat to the element in the markup
<div id="formSpinner" runat="server">
<img src="images/spinner.gif">
<p>Saving...</p>
</div
Then you can get to the control's class attributes by using
formSpinner.Attributes("class")
It will only be a string, but you should be able to edit it.
How do you do this without runat="server"? For example, if you have a
<body runat="server" id="body1">
...and try to update it from within an Updatepanel it will never get updated.
However, if you keep it as an ordinary non-server HTML control you can. Here's the Jquery to update it:
$("#body1").addClass('modalBackground');
How do you do this in codebehind though?
If you do not want to make your control runat server in case you need the ID or simply don't want to add it to the viewstate,
<div id="formSpinner" class="<%= _css %>">
</div>
in the back-end:
protected string _css = "modalBackground";
If all you want to do is conditionally show or hide a <div>, then you could declare it as an <asp:panel > (renders to html as a div tag) and set it's .Visible property.
To expand on Peri's post & why we may not want to use viewstate the following code:
style="<%= _myCSS %>"
Protected _myCSS As String = "display: none"
Is the approach to look at if you're using AJAX, it allows for manipulating the display via asp.net back end code rather than jquery/jscript.

Categories