Thursday, May 29, 2008

Implement Code Format in Asp.net Application

Implement Code Format in Asp.net Application


Lets understand how to embed code formatting in Asp.net Application. This can be useful while user enters the code online, and we need to format the code and able the preview the same. Example, on online forum or blog if user enters code, application should be smart to understand the part of code and able to format.

This Code Format utility used Manoli Csharp Format, I have used the sourcecode and demonstrate how this can be useful to implement code format in asp.net application.

Step1: Download Sourcecode from Manoli Online Code Format
To accomplish this task, download source code of manoli csharpformat.
Direct link for downloading Sourcecode of Manoli CsharpFormat

Step2: Compile the Class Library Project to generate binaries.

Step3: Create an asp.net application, while will be used to display Formatted Code.

Step4: Right Click project and Add Reference.
- Add Reference of binaries generated by Manoli Code Format Class Library Project

Step5: Add csharp.css file available with Manoli Code Format Sourcecode.
- Right Click and Add Existing Item and browse through location where csharp.css file is located. (This file will be available with sourcecode)
- And add link reference in default.aspx
<link href="csharp.css" rel="stylesheet" type="text/css" />

After adding .dll file and .css file your solution explorer.




Step6: Add the 2 textbox controls, 1 button control and 1 label control.
2 – Textbox control, 1 for taking input and other for displaying generated html code.
1 – Label control for displaying preview.



Step7: Add ValidateRequest=”false” in page derective for taking HTML Input
<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs"
Inherits="_Default"
ValidateRequest="false" %>

Step8: Looking class diagram of Manoli Code Formatter
- You can create object for each language you wish to format.



Step9: Writing a Code to make everything works.

protected
void btnPreview_Click(object sender, EventArgs e)
{
string InputCode = txtInputCode.Text;
string HTMLCode = SmartFormat(InputCode, "C#", true, true);
lblPreview.Text = HTMLCode;
txtCode.Text = HTMLCode;
}

/// <summary>
/// SmartFormat - Takes InputCode as string
/// and returns Generated HTML Code.
/// </summary>
/// <param name="InputCode"></param>
/// <returns></returns>
private string SmartFormat(string InputCode, string Language,
bool LineNumber,bool AlternateBackground)
{
string OutputHTML = string.Empty;
if (InputCode != string.Empty)
{
SourceFormat FormatCode;
Language = Language.ToUpper();
switch (Language)
{
case "C#":
FormatCode = new CSharpFormat();
break;
case "JS":
case "JavaScript":
FormatCode = new JavaScriptFormat();
break;
case "VB":
FormatCode = new VisualBasicFormat();
break;
case "HTML":
case "XML":
case "ASPX":
FormatCode = new HtmlFormat();
break;
case "SQL":
FormatCode = new TsqlFormat();
break;
case "MSH":
FormatCode = new MshFormat();
break;
default:
FormatCode = new CSharpFormat();
break;
}
FormatCode.LineNumbers = LineNumber;
FormatCode.Alternate = AlternateBackground;
OutputHTML = FormatCode.FormatCode(InputCode);
}
return OutputHTML;
}
Output


Download Example Demo Application

Similarly you can use different combination of language and output can use the code format utility in asp.net application.

2 comments:

Federico Medrano (FedExX) said...

Hello, is a very good article. I use that to format my source code to paste it into my blog. Thank you!!!

FedExX

DotNetGuts said...

If you are looking for How to Remove Manoli Code Format and revert the code back to original content than you should refer following post
http://dotnetguts.blogspot.com/2009/06/remove-html-from-string-remove-manoli.html

Most Recent Post

Community Updates

Subscribe Blog via Email

Enter your email address:



Disclaimers:We have tried hard to provide accurate information, as a user, you agree that you bear sole responsibility for your own decisions to use any programs, documents, source code, tips, articles or any other information provided on this Blog.
Page copy protected against web site content infringement by Copyscape