Rich TextBox accepting Script tags also - asp.net

I have a aspx form where we have used freetextbox as my rich text editor to make entries.
but I am able to enter <script></script> in this reach tags.
how can i validate on client side that it should not accept any scripting which ever it is included in javascript library.
EDIT:
how can i validate it for not allowing script tags into it?
how can we validate it for mandatory field?
How can i manage more than one textareas on my page. but i want only one to be as rich editor and not all???
I had tried some code but it did not helped me for proper validation. below is the snippet.
SCRITPT
<script>
$(document).ready(function () {
var $btn = $("#<%=btnSubmit.ClientID %>");
var $txtEditor = $("#<%=txtEditor.ClientID %>");
$btn.click(function () {
alert($txtEditor.html());
return false;
})
});
</script>
HTML
<div>
<asp:TextBox id="txtEditor" runat="server" TextMode="MultiLine"></asp:TextBox>
</div>
<div>
<asp:Button id="btnSubmit" runat="server" Text="Save" />
</div>

If you do need support HTML in your text, then you probably should integrate some WYSIWYG editor (TinyMCE for example).
If you don't need html there, then just html encode all user input.

I would consider using the HTML agility pack to parse the content and allow only white listed markup.
There are are numerous ways of getting script to execute in arbitrary markup (without necessarily needing <script> tags). Blacklisting isn't a viable solution if you're trying to avoid XSS attacks.

Related

Updatepanels not working when filling the CKEditor / Tinymce from the Database

I am developing website by using ASP.NET and I am using CKEditor as a richtextbox. In there everythings works fine.
I am using this code to achieve it
<asp:TextBox ID="txtDescription" runat="server" Width="100%" TextMode="MultiLine" Rows="15" AutoComplete="off" ClientIDMode="Static" MaxLength="6000"></asp:TextBox><br />
<script src="//cdn.ckeditor.com/4.5.3/basic/ckeditor.js"></script>
<script type="text/javascript">
window.onload = function () {
CKEDITOR.replace('txtJobDescription');
CKEDITOR.config.htmlEncodeOutput = true;
};
</script>
So everythings works fine.When I save the content of the textbox I am using
HttpUtility.HtmlDecode(txtDescription.Text)
to do it.
Probelem is when I read the saved text from DB and assigned it to Ckeditor text box all the updatepanels in that page are not working.(Which are working properly)
To assign it I am using this code.
DataTable dt=new DataTable
dt = objBLL.Get();
txtName=Text= dt.Rows[0]["name"].ToString();
txtDescription.Text = dt.Rows[0]["description"].ToString();
If I comment the last statement all the updatepanels are working properly.
I tried this with tinymce also. Probelem is same.
Whats wrong with my code?
I am answering to my own question.
You can either set page ValidateRequest=off at the page level. But this will make other textboxes also post HTML content.
So to avoid that use ValidateRequestMode=disabled in specific control.
This will allow only the selected control posting the HTML tags to server.

input vs .net texbox: input clears on enter pressed, asp:textbox does not

I use the jquery datepicker. I have the following input in the updatePanel:
<input id="DateMask" type="text" />
and js code:
$(".datepicker").datepicker({
changeMonth: true,
changeYear: true
});
$(document).ready(function () {
SetD();
});
Using jQuery:
<script src="/scripts/jquery-1.9.1.js" type="text/javascript"></script>
<script src="/scripts/jquery-ui.js" type="text/javascript"></script>
When I press enter on my page it clears my input, and I do not post anything to the server. I've managed to solve the problem by writing <asp:textbox> instead of <input>, but why is it so?
and found the topic here
But once again why does it work this way?
This is related to the difference between 'standard' HTML controls, and .NET server controls.
When you use a standard HTML <input> in .net, you are in charge of everything relating to it - quite simply, population of the initial value and later retrieval through Request.Form.
The advantage that the server controls - including, as you've noticed, <asp:textbox> - bring is that the ASP.Net framework now handles most of the messy parts for you. Thus, any text that you enter is available in the code-behind as a property of the object, and when control returns back to the page the textbox is re-populated with the same value it had beforehand.
I'd suggest having a read of a few background topics that discuss this, primarily the ASP.Net server controls overview at http://support.microsoft.com/kb/306459.

Access to events?

i have a question about generating images at runtime which are also links. Ok, so what i was going to do was create an ImageButton, and then set the onClick event to something such as:
window.open('http://www.themagicfinger.com/')
Which means it would look like:
newImage.Click += (window.open('http://www.themagicfinger.com/'));
But then i realised that this doesnt work, because it looks for a method which matches the event delagate.
So my question is, is this the best way to achieve what i want, and if so, how can i make it work?
Another option that came in my head would be to wrap the image in an tag, but i think this way its better.
Thanks
What you need is OnClientClick:
<asp:ImageButton id="ImageButton1" runat="server" OnClientClick="window.open('http://www.themagicfinger.com/'); return false;" ImageUrl="MyButton.png" />
This property is a string, not event, and you can also assign it from within the code behind:
ImageButton1.OnClientClick = "window.open('http://www.themagicfinger.com/'); return false;";
If you're asking how to use server-side code to tell the client to open a browser window, you can't. The server-side code has no means of telling the client to do that. The only thing you'd be able to do from server-side code is emit client-side that does this. And in that case, why use the server-side code at all?
Using jQuery for example, you can attach the click event like this:
<!-- page header (including loading jQuery), other stuff that's before the image, etc. -->
<img src="/path/to/image" alt="some text" id="imgOpenWindow" />
<!-- the rest of the page -->
<script type="text/javascript">
$(document).ready(function() {
$('#imgOpenWindow').click(function(){
window.open('http://www.themagicfinger.com/');
});
});
</script>
If for some reason you need to use an ImageButton control for this then it would look like this:
<!-- page header (including loading jQuery), other stuff that's before the image, etc. -->
<asp:ImageButton run="server" id="imgOpenWindow" ImageUrl="/path/to/image" AlternateText="some text" />
<!-- the rest of the page -->
<script type="text/javascript">
$(document).ready(function() {
$('#<%= imgOpenWindow.ClientID %>').click(function(){
window.open('http://www.themagicfinger.com/');
});
});
</script>
But I'm not sure what the behavior would be with the post-back. It might override the JavaScript handler (by posting back before your handler is executed) or post-back after the window opens, etc. I would consider that behavior to be undefined and unreliable. An Image control will do the trick, though, if you don't need the button post-back capabilities.

Can I use update panels with jQTouch?

I am using ASP.NET controls to fill in HTML for my jQTouch application, but I am having trouble with my hrefs ceasing to function as intended on my search page. The jQuery function for my anchor class evidently does not get called; it simply links back to the default page, even though the link is built similarly on other pages without any problems.
This is where my links are breaking:
<form id ="form1" runat="server" class="form">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel runat="server" ID="up1">
<ContentTemplate>
<ul class="rounded">
<li><asp:TextBox ID="txtSearchString" runat="server" name="search-articles" placeholder="Search GROK"></asp:TextBox></li>
<li><asp:Button ID="btnSearch" runat="server" Text="Search" type="rounded" OnClick="btnSearch_Click"></asp:Button></li>
</ul>
<asp:Literal ID="litSearchResults" runat="server"></asp:Literal> <%--HTML for jQTouch inserted here--%>
</ContentTemplate>
</asp:UpdatePanel>
</form>
This is an example of the HTML generated by code behind.
<ul class="edgetoedge"><li class="sep">Found 101 articles</li><li>PAWS: How to Access the Sample Test Database</li><li>Mac OS X: Hardware Test</li><li>The JavaScript Test</li><li>PAWS: Emergency Text Message Test</li><li>Definition: remote digital loopback test</li><li>Definition: power-on self test</li><li>Definition: power-on self test</li><li>AVG 9.0 Free Edition: Setting Scan Process Priority</li><li>Microsoft Office 2007: Diagnostics</li><li>Moodle: Description of Aggregation Methods</li><li>AVG 9.0 Free Edition: How can I run the complete scan of whole computer?</li><li>LSU A-Z: Office of Assessment and Evaluation</li><li>Linux: sed Insert a Newline Into the RHS of a Substitution</li><li>Microsoft PowerPoint 2007: Narrating a Slide</li><li>Ubuntu: Deleting Undeletable Files In the Trash</li><li>Linux: Remove All Digits/ Input From Inputs</li><li>SQL: Create a MySQL DocDB Databse</li><li>Linux Gnome: Screens and Graphics</li><li>Linux Xfce: Adjust keyboard settings</li></ul>
jQTouch handles every other tag normally, it is just the anchors that have ceased to function as intended by being placed inside this form. Can I keep using update panels here or will it inevitably break? Is there a work-around? Or am I approaching the problem incorrectly?
Keep in mind I want to retain the AJAXical animations produced by jQTouch. If you find that I am unclear or you would like to see more code (I only included what I believe to be necessary), please let me know.
Bonus points if you can tell me how to get jQTouch to replace the ugly the ASP.NET button control with an iPhoney button. :)
I think you are going to have to do a ton of hacks to get ASP.Net working with jqtouch with update panels, as you are going to be fighting the JavaScript inserted by ASP.Net with the JavaScript that jqtouch inserts. In your example all your links are going to the same anchor (#article). To do this in a jQtouch kind of way, you would have all the the links going to '#' and handle the tap of the articleLinkClass and then adjust as you need to.
$('.articleLink').tap(function()
{
var id = $(this).val('id');
// Pseudo CODE HERE FOR Setting up the article based on id... E.g.
$.json(jsonServiceUrl, { article_id: id }, function(data)
{
$('#article data).html(data);
});
jQt.goTo('article'); // Display the article page...
});
The iPhoney buttons are created in jQtouch as 's with their class as "whiteButton", i.e.:
<a id="myTestButton" class="whiteButton">Test Button</a>
Hope this helps...

Including Javascript with a custom control in an ASP.Net website

I have a custom date control which is essentially a text box and the ajaxToolKit calendarExtender. I want to include Javascript in the control and have it work properly no matter what page the control is on. The control is called DateControl.ascx
So I have two Javascript functions, dateEditor_OnShown and dateEditor_OnHiding. They get tied up in the page load of DateControl.ascx via...
CalendarExtender.OnClientShown = "dateEditor_OnShown";
CalendarExtender.OnClientHiding = "dateEditor_OnHiding";
The DateControl tool is used on two separate pages. If I put the straight Javascript directly into the DateControl's HTML it will work only on the default page but crashes when I load up the next page with the control. The error is a js runtime error 'dateEditor_OnHiding' is undefined.
If I try to link to the Javascript file from my DateControl's html via...
<script type="text/javascript" src="../JavaScript/IE6CalendarExtenderFix.js"></script>
... instead of having the Javascript directly in the page, it crashes immediately with the same error. I should note that the path to the js is correct.
The only way I can really get it to work is if I link to the javascript on every page that the control is used.
UPDATE: I feel the need to clarify a little bit. The solutions suggested are much appreciated, but either I am not understanding or they just will not work in my case for whatever reason (quite possibly the former).
So, this is basically what my control looks like...
<div id="CustomDateControl" style="<%# ControlStyle %>">
<div id="TextBox" style="display:inline; white-space:nowrap;">
<asp:TextBox runat="server" ID="txtCalender" Style="<%# TextBoxStyle %>" />
</div>
<div id="Calendar" runat="server">
<ajaxToolkit:CalendarExtender
runat="server"
ID="CalendarExtender"
Format="MM/dd/yyyy"
TargetControlID="txtCalender"
PopupButtonID="CalenderImage" />
</div>
</div>
In the aspx page, with that exact code, if I put the exact javascript in script tags so the page looks about like so...
<script type="text/javascript">
function dateEditor_OnShown(dateControl, emptyEventArgs) {
...
}
function dateEditor_OnHiding(dateControl, emptyEventArgs) {
...
}
</script>
<div id="CustomDateControl" style="<%# ControlStyle %>">
<div id="TextBox" style="display:inline; white-space:nowrap;">
<asp:TextBox runat="server" ID="txtCalender" Style="<%# TextBoxStyle %>" />
</div>
<div id="Calendar" runat="server">
<ajaxToolkit:CalendarExtender
runat="server"
ID="CalendarExtender"
Format="MM/dd/yyyy"
TargetControlID="txtCalender"
PopupButtonID="CalenderImage" />
</div>
</div>
This still crashes when accessing the control in the second page (not the first which is the default page) saying 'dateEditor_OnHiding' is undefined. Now, if I link to a js file with the same code using a relative path as suggested below I still get the same results.
Also, if as suggested below, I override OnPreRender and run RegisterClientScriptInclude, I once again get the same results. The control always works on the default page but never on the second page even though as far as I can tell the script is included in the control.
Any ideas?
append following code in your User Control.
protected override void OnPreRender(EventArgs e)
{
Page.ClientScript.RegisterClientScriptInclude("DateControl", this.ResolveClientUrl("~/JavaScript/IE6CalendarExtenderFix.js"));
base.OnPreRender(e);
}
Problem with control-relative file paths
You are probably having problems with relative paths to your JS file. You are specifying relative path to your custom control. You should probably write user control. Anyway. Your JS file is relative path to your custom control, but not relative to the containing page, so your JS file actually never loads. That's why your event handlers are undefined.
The easiest way would be to use absolute paths. Since you're working with user controls you can easily prepend application root folder.

Resources