Eric Fickes » C#

Injecting javascript into asp.net via code

Eric Fickes — Sat, 19 Feb 2011 04:13:50 +0000

Microsoft has a great MSDN article on using javascript along asp.net, but they didn’t mention a technique I like to use, put it in a Literal control. While there are many ways to add javascript to a page, I find putting the javascript in a literal much less stressful. Using a Literal control placeholder is also a good way to add messaging to a page after postback, but we’re just going to look at adding javascript.

Let’s take a simple example. Say you’ve got a comment form that you want to auto close, or reload after the form was posted. Below is a simple single file style asp.net page with a simple javascript function that reloads this page.

<%@ Page Language="C#" %>







	Comments
	







	Comments
	
	



	Your name

If you look just under the form tag you’ll see the key to this technique, an asp literal wrapped by an open and close script tag.

When you load your page and view the source you’ll just see an empty script tag, so it shouldn’t interfere with the execution or rendering of your page.

The last part of this technique is simple, in your server code just set your Literal control’s .Text value to your javascript code. In this case when I post my comment form, after handling the input data I display a thank you message, then set some javascript to reload the page.

ltl_js.Text = "setTimeout('reload()', 3000);";

That’s all there is to it. Drop a literal in an empty script block and BAM!, you have an easy way to add javascript to your asp.net page.

Endless Mural wins FWA site of the day

Eric Fickes — Sat, 20 Nov 2010 06:55:25 +0000

FWA site of the day" src="http://ericfickes.com/wp-content/uploads/2010/11/endlessmural-fwa.png" alt="FWA Site of the day > Nov 22 2010" width="600" height="395" />

Endless Mural wins FWA for HTML5

I’m ecstatic to announce the Endless Mural HTML5 project has won the prestigious FWA Site of the day award. While this isn’t the first project I’ve worked on that has won the FWA, it is the first NON-Flash, HTML5 and ASP.NET project that has. No Flash, and we still got the FWA site of the day, SWEET!.

I need a SQL Ninja

On Friday July 23rd I got the chance to skateboard with my good buddy and personal hero Joshua Davis. I feel lucky being able to say we’ve actually been skating together for a few years now, but this was certainly my favorite session we’ve had so far. We started out at Broomfield’s new park because I had to show Josh the new mini bowl.

Two hot dogs ( http://yfrog.com/n3hs5j )

After Broomfield we made a quick stop for lunch, and then on to the Denver Skatepark in downtown. It was great showing Josh the lines at my hometown skateparks, as well as a few radical maneuvers.

Now that Josh had seen my non-frontside airs, it was time to wrap things up. As we were saying our goodbyes I decided to ask about work. Normally I don’t talk about work at the skatepark, but I was thinking about going indie again, and figured what the heck.

Turns out Josh was about to start a project for Microsoft ( WHAT?!?! ) and he need to “find a SQL Ninja” ( DOUBLE WHAT?!?! ). I’ve been actively working with MS SQL Server since version 6.5, so I let him know he was looking at his sql ninja. Josh was interested, but gave me the “just cause we’re bros, doesn’t put you on the team”.

HTML5 drawing tool in one night

Driving home from the skatepark I called my wife super giddy. ”Honey, I may be going indie sooner than we planned”. I gave her the rundown of the potential project Josh and I just spoke about, and let her know I had some homework to do. That night I went home and built out a distant cousin of the endless mural project.

HTML5 drawing tool powered by ASPX and MySQL

EFDRAW is a really simple HTML5 drawing tool powered by ASP.NET and MySQL. It has most of the features of the mural ( draw, save, replay, share ), but this was only a proof of concept. This was my first dive into HTML5 development, and it’s pretty sweet.

If you’re interested in HTML5 drawing tools, feel free to play around with EFDRAW, view source, help yourself.

There’s one thing…. Azure

A few days after building EFDRAW my band The Compilers played at Ignite Denver 7. Right before starting our first set my phone rings and it’s Josh! OMG I think, this is either the “you got it” or the “sorry bud, we’ll skate again” call. I decide to take the call even though we were locked and loaded, standing on stage with our gear waiting for the house music to go down. I answer and it’s Josh, but not the usual hyperactive Josh I’m accustomed to. I ask about the gig and he says “Well, there’s one thing. We have to use Azure”.

I let him know I’ve worked with other cloud platforms already, just not Microsoft’s. So we talk a little more and Josh passes the phone to Branden so we can talk 0s and 1s. After talking to Branden “mega brain” Hall for a few minutes he asks if I can do this. I tell him yes, he says yes, I get excited, he gets excited. Branden passed me back to Josh and I’m in shock at this point.

Now the boring stuff

So that’s the story of how I landed the Endless Mural gig, now the boring technical details.

The drawing portion of the mural was built by Branden Hall of Automata Studios. I did the backend which is made up of ASP.NET ( C# ), SQL Azure, and Windows Azure. We’re using Azure blob storage to save and serve up the PNGs created at the mural. To access SQL server, I wrote a super lightweight data access library using all native .NET.

For the most part the backend was very much like every other .NET SQL Server project I build, but Azure did introduce a few gotchas.

The publishing and management of your cloud site mainly goes through http://windows.azure.com/.
You can deploy your site from Visual Studio which proved to be immensely helpful after my Azure deploy package grew beyond 100 MB.
You can access SQL Azure directly from SQL 2008+ management tools.
You can not FTP single files up to the cloud, only the full ball of wax.
You can still use web.config for configuration storage, but Azure also has it’s own version of web.config.
If you need to edit your settings after deploying, store those settings in your Azure service config, not web.config
SQL Azure requires all tables to use clustered indexes
SQL Azure has it’s own TSQL restrictions ( not many, but be aware )
On average, doing a full republish of an Azure site took a full hour.

I could probably ramble on and on about Azure, but I’ll cut it short. If you happen to have any questions about Azure feel free to hit me up or leave a comment. I would also like to say that I know Microsoft is and has been actively improving Azure by the day. The state of Azure today is most likely even better than when we built the mural, so my experiences may not be your own.

The toolbox

Windows Azure SDK
Windows Azure Platform Kit June 2010
Windows Azure Tools for Visual Studio ( v1.2 )
Microsoft Seadragon Ajax library
Microsoft SQL Server 2008 R2
Microsoft SQL Azure
ASP.NET 4 ( C# )
Windows Azure
Azure Storage Explorer

Here is the toolbox that Branden used on the client side.

Hotlinks from the server guy

It’s a wrap

This project was the most concentrated five weeks I’ve had in quite some time. I still wonder if we were only given five weeks because this was an HTML5 project. Either way, the mural team made some magic and now you can too. If you’re like me and just want to doodle, go make some art at the mural. If you’re a developer interested in HTML5 and Javascript programming, go check out the javascript library okapi.js which Branden Hall recently open sourced.

Also be sure to visit the magicians, I mean artists, who made the amazing patterns you see when using the mural. I’m a life long doodler, but can’t art myself out of a paper bag.

Evgeny Kiselev

Evgeny Kiselev - www.ekiselev.com

Guilherme Marconi

Guilherme Marconi - brain.marconi.nu

Joshua Davis

Joshua Davis - www.joshuadavis.com

Matt Lyon

Matt Lyon - www.c8six.com

And lastly I put up a photo album on Facebook of all my camera phone pictures from the trip. Check out the endlessmural photo album.

Upload to ASP.NET from HTML, Flash, or Flex clients

Eric Fickes — Thu, 12 Aug 2010 03:18:49 +0000

File uploading has been a hot topic during my time as an internet programmer. In the classic ASP days this was a bit of a task to build and get correct. Nowadays both Adobe’s Coldfusion and Microsoft’s ASP.NET both have built in file uploader tags ( server controls ) that handle this with ease.

This is great, but what happens when you have a mixed bag of clients that all need to upload to the same location? Sometimes I work with completely ASP.NET or CF web apps, but more often than not I’m dealing with Flash clients as well as HTML clients.

Recently I ran into this upload scenario and built this simple ASP.NET uploader script. This feels a bit old school since it uses .NET’s built in Request.Files collection, instead of a fancy new ‘all in one’ server control, but I actually prefer this method.

Here’s all you need :

// Check for posted files
for (int xx = 0; xx < Request.Files.Count; xx++)
{
    // UPLOAD FILE
    HttpPostedFile _file = Request.Files[xx];

    // make sure we're not finding empty filename
    if (_file.FileName.Trim() != string.Empty)
    {
        // NOTE : IE < 8 reports full path of file, not just filename
        // Parse out filename, then create full upload path
        var fileName = _file.FileName;
        if (fileName.Contains("\\"))
        {
            var aFile = fileName.Split('\\');
            fileName = aFile[ aFile.Length - 1 ].ToString();
        }

        // create full save path for uploaded file
        var full_file_path = Server.MapPath( UP_FOLDER ) + "\\" + fileName;

        try
        {
            // save file to server
            _file.SaveAs(full_file_path);
        }
        catch (Exception exc)
        {
            var emsg = "Unable to upload file : " + exc.Message;

            Response.Write( emsg );
            Response.Flush();
            Response.End();
        }

        // show result
        Response.Write( _file.FileName + " uploaded! 
" );
    }
}

That’s all there is to it codewise. Before using this code you will need to give the NETWORK SERVICES user write permissions to your upload folder. Other than that, that’s all she wrote!

Here is a zip of all the code for you to download.

Inside this zip you will find :

flashclient.fla – Flash upload client ( *be sure to update the upload path before building )
flexclient.mxml – Flex upload client ( *also update upload path before building )
uploader.aspx - ASP.NET file upload handler
uploadform.html - sample HTML upload form ( again, update path )

Hope somebody finds this useful.

How to show line numbers in Visual Studio 2010

Eric Fickes — Tue, 03 Aug 2010 19:11:35 +0000

I’ve been using Visual Studio since forever, yet it always takes me a while to remember how to show line numbers. It’s especially hard to remember after a fresh install of Visual Studio. Assuming you have it installed and open, here’s how to display line numbers in your code.

Click Tools in the menu bar
Options
Expand Text Editor ( in the popup window )
Click ‘All Languages’
Check the ‘Line numbers’ box under the Display heading ( on the right )
Click OK
Happy Happy Joy Joy!

DataBind a List of custom classes to an ASP:ListBox control

Eric Fickes — Fri, 09 Apr 2010 20:09:16 +0000

Recently I was scratching my head at this error from the .NET Framework

DataBinding: ‘MyApp.vo.customVO’ does not contain a property with the name ‘Name’

I was stumped because my custom VO class did in fact have a public property called Name. After many trials and tribulations I figured out that .NET didn’t like how I structured my custom class.

Here is what my original custom class looked like.

namespace MyApp.vo
{
    public class customVO
    {
        public Int32 id  = 0;
        public DateTime time  = new DateTime();
        public string Name  = string.Empty;
        public string DeviceType  = string.Empty;
        public string ObjectIDs  = string.Empty;
    }
}

Luckily I have JetBrains ReSharper installed, and it suggested using C#’s Auto-Implemented properties. This is the one thing I hadn’t thought about trying, and it ended up being the fix! My new custom VO class now looks like this.

namespace MyApp.vo
{
    public class customVO
    {
        public Int32 id { get; set; }
        public DateTime time { get; set; }
        public string DeviceType { get; set; }
        public string ObjectIDs { get; set; }
        public string Name { get; set; }
    }
}

So if you find yourself running into this error while trying to DataBind a collection of custom classes to a ListBox or similar control, have a look at your custom class and see if you can convert it over to using auto-implement properties as well.

Now I’m not suggesting this is the only way to DataBind a List of custom classes to a ListBox, but it solved my problem and let me do direct databinding from my service call without having to do any pre-processing on my list.

Hope this helps someone else.

How to TWEET from a SQL CLR Stored Procedure

Eric Fickes — Thu, 04 Mar 2010 01:10:58 +0000

Here’s another SQL Server 2005 geek out moment, a CLR SPROC that tweets to Twitter. Big shoutout to Danny Battison for sharing the C# code to post to Twitter. This is what got me started on the C# side of things. Also, you can skip all my ramblings here and just download code here and fire it up. The zip file contains all the source code, the compiled assembly file, and install.sql that shows you how to hook this up.

Being the SQL junky that I am, I was interested in trying out SQL Server’s new CLR Stored Procedures. A CLR sproc is a stored procedure that is able to use .net code that you’ve compiled into an assembly file. For you classic ASP heads out there, think of the ASP page being the sproc, and the .net assembly being your COM object ( cringe, let’s talk about classic ASP ). While there are plenty of great articles on writing CLR stored procedures, I’m going to breeze through the code that makes up this project.

First make a .net class library that will be compiled into an assembly file.

using System;
using Microsoft.SqlServer.Server;
using System.Data.SqlTypes;
using System.Net;
using System.IO;
using System.Text.RegularExpressions;

/// 
/// This assembly will be used by a SQL2005 SPROC to communicate
/// with twitter.com
/// 
public sealed class tweetsproc
{
    /*
     * TWITTER CODE BORROWED FROM :
     *  http://www.dreamincode.net/code/snippet2556.htm
     *
     * A function to post an update to Twitter programmatically
     * Author: Danny Battison
     * Contact: gabehabe@hotmail.com
     */

    /// 
    /// Post an update to a Twitter acount
    /// 
    /// The username of the account
    /// The password of the account
    /// The status to post
    [Microsoft.SqlServer.Server.SqlProcedure(Name = "PostTweet")]
    //public static void PostTweet( string username, string password, string tweet)
    public static void PostTweet(   SqlString username,
                                    SqlString password,
                                    SqlString tweet)
    {
        try
        {
            // encode the username/password
            string user = Convert.ToBase64String(System.Text.Encoding.UTF8.GetBytes(username.ToString() + ":" + password.ToString()));
            // determine what we want to upload as a status
            byte[] bytes = System.Text.Encoding.ASCII.GetBytes("status=" + tweet.ToString());

            // Create a WebPermission.
            WebPermission myWebPermission1 = new WebPermission();

            // Allow Connect access to the specified URLs.
            myWebPermission1.AddPermission(NetworkAccess.Connect,new Regex("http://www\\.twitter\\.com/.*",
              RegexOptions.Compiled | RegexOptions.IgnoreCase | RegexOptions.Singleline));

            myWebPermission1.Demand();

            // connect with the update page
            HttpWebRequest request = (HttpWebRequest)WebRequest.Create("http://twitter.com/statuses/update.xml");

            // set the method to POST
            request.Method = "POST";
            request.ServicePoint.Expect100Continue = false; // thanks to argodev for this recent change!
            // set the authorisation levels
            request.Headers.Add("Authorization", "Basic " + user);
            request.ContentType = "application/x-www-form-urlencoded";
            // set the length of the content
            request.ContentLength = bytes.Length;

            // set up the stream
            Stream reqStream = request.GetRequestStream();
            // write to the stream
            reqStream.Write(bytes, 0, bytes.Length);
            // close the stream
            reqStream.Close();

            // Let's get the Response from Twitter
            var webresp = request.GetResponse();
            // Let's read the Response
            var sread = new StreamReader( webresp.GetResponseStream() );

            // Use SqlContext to return data to the QueryAnalyzer results window
            SqlContext.Pipe.Send( sread.ReadToEnd() );

        }
        catch (Exception exc)
        {
            // send error back
            SqlContext.Pipe.Send(exc.Message);
        }
    }
}

Here’s the app.config for this assembly.

Once you build this project, you should have your assembly ( tweetsproc.dll ) which will be used by your CLR Sproc. Now it’s time to do some SQL server work.

Enable CLR access for SQL server

EXEC sp_configure @configname = 'clr enabled', @configvalue = 1
RECONFIGURE WITH OVERRIDE
GO

Create the SQL Assembly

CREATE ASSEMBLY tweetsproc_clr_assembly from 'C:\Users\eric\Desktop\blog\tweetsproc.dll'
WITH PERMISSION_SET = EXTERNAL_ACCESS
GO

Create your SPROC

CREATE PROC tweetsproc_tweet(	@username as nvarchar(50),
								@password as nvarchar(50),
								@tweet as nvarchar(140)
							)
AS
	-- [Assembly Name].[Class Name].[CLR function Name]
	EXTERNAL NAME tweetsproc_clr_assembly.tweetsproc.PostTweet
GO

Tweet from a sproc

EXEC tweetsproc_tweet 'TwitterUsername', 'TwitterPassword', 'Hey @ericfickes, I''m tweeting from my database too!'

Running this sproc returns the XML response from Twitter.

Tweetsproc returns the full Twitter response

That’s one sample CLR SPROC in the bank! Feel free to download this code and try it out yourself. I’d love to get some feedback on anybody looking to use this for real. While tweeting from a stored procedure probably isn’t a hot topic for anybody, this is a nice teaser for what you can do with CLR sprocs now.

Download code here.

Inside this zip you’ll find this.

install.sql is everything you need to install this on your database
tweetsproc.dll is the twitter assembly used by the sproc
tweetsproc folder is the .net class library project

Everything you need to get TWEETING from a sproc

How to JOIN two tables using LINQ to SQL

Eric Fickes — Fri, 12 Feb 2010 01:27:53 +0000

Wanted to share this since it gave me so much trouble figuring out. It’s a simple SQL query ported to LINQ to SQL that joins two tables to return a filtered listed of data.

Here are the tables from my schema

Here is a basic SQL statement I could fire to retrieve my user videos.

select  *
from    video v, user_videos uv
where   v.vid = uv.vid
and     uv.uid = 2

Here is how you would run the same query using .net’s LINQ to SQL.

// create DB connection
var db = new DBCONN();
// run query
List uvids = (
    from c in db.video
    join o in db.user_videos
    on c.vid equals o.vid
    where o.uid == 2
    select c
).ToList();

This query differs slightly from the screenshot below because I used it in a WCF Service.

The variable DBCONN is my database connection that I established when mapping my DB. If you are not familiar with how to set this up, use the Visual Studio’s “Add the ADO.NET Entity Data Model” wizard. With your .net project open, right click your project, left click on “Add the ADO.NET Entity Data Model”. This wizard will walk you through setting up everything you need to setup your DB model file ( edmx ), as well as setting up your database connection and saving it in web.config.

Jesse Liberty did a simple tutorial that uses this wizard in a WCF service application.

I hope this helps somebody out.

Come have a 360Flex chat with me and Jun Heider

Eric Fickes — Wed, 10 Feb 2010 23:16:52 +0000

Chat is @ Thursday Feb 11th, 11:30am MST

Jun Heider and myself will be talking to the 360|Flex guys tomorrow about our session. It’s actually going to be a back-to-back mega session comparing the latest and greatest on both the Flash Platform and the Silverlight Platform.

Come check it out and feel free to ask questions…although for the good stuff you’ll have to wait until our talks.

Here’s the full details: http://www.360flex.com/blog/2010/02/360flex-speaker-chat-eric-fickes-and-jun-heider/

I hope to see you online tomorrow or at 360 Flex in March.

I'm speaking at 360 Flex 2010

Invalid token ‘void’ in class, struct, or interface member declaration

Eric Fickes — Sun, 07 Feb 2010 23:32:34 +0000

EDIT :

After finishing this post I ran into all sorts of other strange issues and restarted using a Web Appliction instead of a plain old Website. Between IntelliSense not showing any classes, to project reference issues, I couldn’t figured it out in time. I’m sure there’s a way, I just had to move on. So maybe this ramble below will be helpful for someone.

Just ran into something quirky with Visual Studio 2008′s new ADO.NET Entity Data Model wizard. While working on an ASP.NET 3.5 website ( not a codebehind web application ) I was trying to get the ADO.NET Entity Data model wizard to work with MySQL and ran into a probable Visual Studio bug. To sum up the issue, if you are going to add a new edmx to your project, do NOT save it to the App_Code folder initially. Put it in your root folder, compile your project, then move the edmx where you’d like.

Assuming you’ve already created your ASP.NET Website project, here’s how you reproduce this issue.

Right click your project and left click ‘Add New Item’

Add New Item

Select ADO.NET Entity Data Model, name it, select your language of preference

ADO.NET Entity Data Model

Click Yes to the ‘Store in App_Code’ prompt

Place file in 'App_Code' folder

Complete the new Entity Data Model wizard

See this tutorial if you have not done this before

Compile project after completing wizard

Invalid token 'void' in class, struct, or interface member declaration

At this point your project should have a new.edmx file located inside of the App_Code folder, but the project won’t build without failing. If you are stuck in this predicament, follow this workaround.

Move .edmx to root folder and rebuild

WORKAROUND : move edmx to root folder, then recompile

After moving your edmx file to the root folder you should be able to compile without problem. Assuming this solves your problem, you should be able to move your edmx file to the App_Code folder without problem. Seems like an initial compile problem.

Find out why Visual Studio’s publish fails

Eric Fickes — Thu, 06 Aug 2009 18:51:26 +0000

Have you ever had Visual Studio tell you your web application publish failed, but never gives you a reason why? You’re not alone. I’ve been putting off looking into this issue on a project and just found a way to get my answer right away.

Visual Studio 2008's Publish Failed message

Here’s what you should do inside of Visual Studio to find out why your publish failed.

Click the Tools menu > then Options to bring up the Options dialog.
Expand ‘Projects and Solutions’ on the left and click General
On General, click ‘Show Output window when build starts’
Now click on ‘Build and Run’ in the left tree
Next select a value from the ‘MSBuild project build output verbosity’ drop down menu
OK your way back to the main Visual Studio window
The next time you Build or Publish your project, you should see the Output panel pop up. If your publish is still failing, the answer will live inside the Output panel

Here’s a visual walkthrough of these instructions.

Options > Projects and Solutions > General" width="300" height="172" />

Tools > Options > Projects and Solutions > General

Options > Projects and Solutions > Build and Run" width="300" height="171" />

Tools > Options > Projects and Solutions > Build and Run

Visual Studio's Output Panel