File this under "Why?" but I wanted to see if a child could talk to a parent and then receive information back from the parent to update itself with. As usual, my lack of intelligent wording probably has you scratching your head... if you do that. Personally I don't get that expression as when I'm confused I more than likely will grab a jar of peanut butter and start lathering up with it, but to each his own.

So here's the idea, and this post is only the start.

You have a parent page, Parent.htm, with an iframe and you want the parent to do something and alert the child that something happened. For now, it's actually really simple.

On the parent I have a method:

  function callMethod(text, methodDelgate) {
    if (methodDelgate != null) {
      methodDelgate(text);
    }
  }

And this simple markup:

  <iframe id="myFrame" src="Child.htm"></iframe>

Wow huh? Well on the child I have this:

  function callParent(text) {
    if (top.callMethod != null) {
	  top.callMethod(text, changeText);
    }
  }

This is easy. If the parent has the method, send the text through and a method to call when finished. What is this method? Well its:

  function changeText(text) {
    jQuery('#returnText').text(text);
  }

Which simply sets the text on some div to show it actually worked.

What happens when I click a button that calls callParent? It talks to the parent, the parent calls the passed in method, and the child updates itself.

Not sure this is rocket science, but there will be more on it as I add in the idea of a dynamically created pop up on the parent being used by the child. Until then, try not to be yourself. You embarrass your mother.

• jQuery Validation – How to Use to Get Rid Of Even The Toughest Stains
• jQuery: Add a Pop Up Div to a Link Dynamically
• JQuery, Position : Absolute, and How to Make It All Work
• Get the jQuery DatePicker to Work With jQuery Modal Dialog
• jQuery Modal Dialog : Hide That Stupid X Button / Windows Close Button

• No Related Posts

So here's the issue:  You have a date picker, a modal dialog, and you can't see the calendar when you click on the icon and/or textbox. First thought, 'WHY DOES THIS HAPPEN TO ME???!?!' Second though, 'I wonder if that tool knows how to get past this.' Good news! I do. Turns out it has to do with the z-index. The modal dialog by default has a z-index of 1000ish when showing. (And any modal dialog "above that" will increase it's z-index to match.) If the calendar isn't higher than that, no go.

Now you might be using the jquery styles from the jquery site and might be putting your through your keyboard thinking about having to deal with that mess. However, it's actually a simple fix in there... there being the ui.datepicker.css file.

  .ui-datepicker { width: 17em; padding: .2em .2em 0; z-index:9000; }

And there you have it. Now the calendar will show up in front of anything lower than 9000, and as everyone knows: Anything over 9000 is impossible.

• Child IFrame Page Interacting with Parent Page… Yeah I went there.
• jQuery Modal Dialog : Hide That Stupid X Button / Windows Close Button
• jQuery – Check All Checkboxes Toggle Method Thingy
• jQuery Validation: Adding Errors to the Error Containter… With Love!
• jQuery Grab Bag – Whole bunch of jQuery Functionality

What we need from you:
Name:
E-Mail:
What would you like to write about:
How often would you like to write:

Please submit this simple information, along with an example blog post to iwanttowrite [at] byatool [dot] com

• No Related Posts

Sincerely,

Sean

• No Related Posts

Want to get rid of that X at the top right of the modal "Control"? Well here it is: (The bold part, moron)

     jQuery('#WaitingDiv').dialog({
          autoOpen: false,
          bgiframe: false,
          height: 150,
          width: 200,
          modal: true,
          open: function(event, ui) { jQuery('.ui-dialog-titlebar-close').hide(); }
        });

And that's really it. Just thought I'd pass that on to you, the consumer.

On a side note, the big movie thing is the canceling of Spiderman 4 or at least going in a new direction. As much as I don't care, it might lead to my dream come true:

A spiderman movie based on the SNES classic: Spider-Man & Venom: Maximum Carnage. Uwe Boll, are you out there?

• Child IFrame Page Interacting with Parent Page… Yeah I went there.
• Get the jQuery DatePicker to Work With jQuery Modal Dialog
• jQuery – Check All Checkboxes Toggle Method Thingy
• jQuery Validation: Adding Errors to the Error Containter… With Love!
• jQuery Grab Bag – Whole bunch of jQuery Functionality

Special people like me do it in one.

    function toggleCheckboxes(buttonId, checkBoxNamePrefix, checked)
    {
      //Get all checkboxes with the prefix name and check/uncheck
      jQuery('[id*=' + checkBoxNamePrefix + ']').attr('checked', checked);

      //remove any click handlers from the button
      //  Why?  Because jQuery(buttonId).click() will just add another handler
      jQuery(buttonId).unbind('click'); 

      //Add the new click handler
      jQuery(buttonId).click(
        function() {
          toggleCheckboxes(buttonId, checkBoxNamePrefix, !checked);
        }
      );
    }

And POW! What? You want to know how to use it? Fine, but only because I'm nice.

   jQuery('#buttonName').click(
     function() {
       toggleCheckboxes('#buttonName', 'someCheckBoxName', true);
     }
   );

And in case you were still wondering why I used .unbind and didn't understand the comment, it's because using just .click will add another handler to the button. So next click you will get both check and uncheck all. Kind of hurts the effectiveness.

And there you have it. Once again I have filled your life with meaning. Couldn't be easier. Or maybe it could but that's not my problem now is it? Go back to doing something useful.

• Child IFrame Page Interacting with Parent Page… Yeah I went there.
• Get the jQuery DatePicker to Work With jQuery Modal Dialog
• jQuery Modal Dialog : Hide That Stupid X Button / Windows Close Button
• jQuery Validation: Adding Errors to the Error Containter… With Love!
• jQuery Grab Bag – Whole bunch of jQuery Functionality

Hello again, my wonderful audience, I have something great and fun planned for this post. If you read this post you might have been left wondering how to add custom messages to the error holder. It's ok if you did, there's nothing wrong with being confused all the time. It's what makes you so adorable.

Say you have a form like this, and if you don't I cry endlessly for your loss. My heart goes out to you.

<form id="ILoveEverythingForm">
    <div id="NotSoNiceThingsDiv" style="display:none;"></div>
	...
</form>

As you can see, there is an error div to hold mean things that we have to print out because the system just doesn't like the user. As we both know, the user can't help but be dumb. It's just in his cute little nature. And that nature is just so darned cute.

Now let's assume that you have something that sent back a bunch of mean messages when you tried to validate server side after all the cute client side validation was done. You might have a method to take in those jerk face messages. How do you display them in the bad place?

  function updateErrorDivContentWithLove(messages)
  {
    if(messages.length > 0)
    {
      var validator = jQuery('#ILoveEverythingForm').validate();

      for(var loopCounter = 0; loopCounter < messages.length; loopCounter ++)
      {
        validator.showErrors
        (
          {
             'SomeWonderfulElementName' : messages[loopCounter].Message
          }
        );
      }
    }
  }

Awwww kitties!

Only thing that may seem odd (And if it doesn't, don't worry you are still very special and loved in this world):

  'SomeElementName' : messages[loopCounter].Message

Not sure what element really needs to be here, basically anything in the form with a name tag. So if you're good like I know you are, you have at least one element in that little old form with a name property set. I would say that this is pretty useless in situations where all the errors are shown in one div, as opposed to right next to the element, but that would be mean and I don't do that.

Now I know you wanted something special from this post so I just wanted you to know that even though most of the world considers you hideous, I say you should be proud of being hideous because it makes you who you are. A unique miracle that only really has issues with dogs and small children. Embrace yourself in whatever way you take that!

• jQuery Validation – How to Use to Get Rid Of Even The Toughest Stains
• Child IFrame Page Interacting with Parent Page… Yeah I went there.
• Get the jQuery DatePicker to Work With jQuery Modal Dialog
• jQuery Modal Dialog : Hide That Stupid X Button / Windows Close Button
• jQuery – Check All Checkboxes Toggle Method Thingy

Now what I can swear is that I was no where near the Baxter Building between 1-3 am on Saturday the 15th. I was in fact I was sleeping and have 20 witnesses that can testify. What I can't swear is this is the best way to go about it but it seems to work AND make sense. It's not common for me to come up with solutions that do both.

  [AttributeUsage(AttributeTargets.Class)]
  public class PropertiesMatchAttribute : ValidationAttribute
  { 

    public String FirstPropertyName { get; set; }
    public String SecondPropertyName { get; set; } 

    //Constructor to take in the property names that are supposed to be checked
    public PropertiesMatchAttribute(String firstPropertyName, String secondPropertyName )
    {
      FirstPropertyName = firstPropertyName;
      SecondPropertyName = secondPropertyName ;
    } 

    public override Boolean IsValid(Object value)
    {
      Type objectType = value.GetType();
      //Get the property info for the object passed in.  This is the class the attribute is
      //  attached to
      //I would suggest caching this part... at least the PropertyInfo[]
      PropertyInfo[] neededProperties =
        objectType.GetProperties()
        .Where(propertyInfo => propertyInfo.Name == FirstPropertyName || propertyInfo.Name == SecondPropertyName)
        .ToArray();

      if(neededProperties.Count() != 2)
      {
        throw new ApplicationException("PropertiesMatchAttribute error on " + objectType.Name);
      }

      Boolean isValid = true;

      //Convert both values to string and compare...  Probably could be done better than this
      //  but let's not get bogged down with how dumb I am.  We should be concerned about
      //  dumb you are, jerkface.
      if(!Convert.ToString(neededProperties[0].GetValue(value, null)).Equals(Convert.ToString(neededProperties[1].GetValue(value, null))))
      {
        isValid = false;
      }

      return isValid;
    }
  }
}

And then the use:

  [PropertiesMatchAttribute("Password", "ConfirmPassword", ErrorMessage = "Match the passwords, dumb--s.")]
  public class UserCreateModel
  {
     public String ConfirmPassword{ get; set; }
     public String Password { get; set; }
  }

Wasn't so hard was it? Normally this would be the part where I degrade you for being bumb because you didn't figure this out but I'm above that now. I guess it must be the holiday season or that I've been told by the board that I should be more gentle with my readers. Guess some were crying after reading some of my posts. Yeah whatever. Bunch of [Removed by Andre].

• jQuery Validation: Adding Errors to the Error Containter… With Love!
• Data Annotations, MVC, and Why You Might Like Them
• jQuery Validation – How to Use to Get Rid Of Even The Toughest Stains

Now the fun part about this post is that I might have to admit I was wrong. Why would that be? Well in this post I suggested that validation rules would be set in the controller. Turns out, there is possibly a better place, on the model itself. How can this be done??? Well that's what you're about to find out.

Say you have a user create model:

  public class AddUserModel
  {
    public String UserName { get; set; }
    public String Password { get; set; }
    public String RepeatPassword { get; set; }
  }

Now you could have a method on the controller like:

  public ActionResult AddUser(AddUserModel model)
  {
    if(IsValid(model))
    {
      ...
    }
  }

Where you have to create the IsValid method for every model on the controller that you need to validate (And possibly on other controllers if you are sharing models between them...) Or you can have this:

  public ActionResult AddUser(AddUserModel model)
  {
    if(ModelState.IsValid)
    {
      ...
    }
  }

And that is already built in so no validation method needed. But how is that possible? Attributes on the model or namely the ValidationAttribute class.

First off you have to include the System.ComponentModel dll in the project. Simple enough. Please say you know how to do that or do me a favor and remind yourself to blink. OK done? Good.

Now you can use some of the built in attributes which is good. Things like required are nice:

  public class AddUserModel
  {
    [Required]
    public String UserName { get; set; }
    ...
  }

There you go. Now if the UserName is null or empty, the ModelState will no longer be valid and will fail this check:

  ModelState.IsValid

Now you might wonder what the error message will be for that? Honest answer: I have no f--king clue. That's why you can actually set it. Those guys at Microsoft thought of everything.

  public class AddUserModel
  {
    [Required(ErrorMessage = "ENTER A USERNAME IDIOT!"]
    public String UserName { get; set; }
    ...
  }

The guys in the legal department have told me I have to note that your error message should change depending on your use and you shouldn't use the one above. Whatever.

Now you might want to actually pass the errors back, and why wouldn't you? You're a fine, upstanding, and thoughtful person and I lie like a crook. The errors, if there are any, are in here:

  ViewData.ModelState.Values

And you can use two loops to get to all of them, but I think the parent loop will only run once.

  foreach (ModelState state in ViewData.ModelState.Values)
  {
    foreach (ModelError error in state.Errors)
    {
      messageList.Add(error.ErrorMessage);
    }
  }

Pretty nice huh? Maybe if you're an idiot who just learned about this. For cool people like me, it's old news.

What's the point this? If "this" is data annotations: Well it helps move some of the validation off the controller if you are looking for a more "Fat model, skinny controller" design which I'm told is a good idea. This also gets rid of all the validation methods and saves time because of it.

If "this" is your life? I have no idea. But if you're to the point that you're asking me about the meaning of your life, you are in some serious trouble.

• Custom Data Annotations With MVC: How to Check Multiple Properties at One Time
• Random Add-On – Automapper
• State List in Dictionary Form
• ASP.Net MVC: Quick Overview of Controller Structure
• ASP.Net MVC: Attibute to Check if Route Value Exists and… and Means Something!

Or you could see it as a knowledge transfer that you the reader can learn from because I am a generous and giving tool.

Whatever, I really don't care. I won't sleep any differently. I just don't feel like making 1000 posts of jquery stupidity.

I'll add more as I come across them.

Checkbox

How To Check a CheckBox

  jQuery('#CheckBoxId').attr('checked', false);

How To Know if a Checkbox is Checked

  jQuery('#CheckBoxId').is(':checked')

How To Find a Bunch of Like Named Checkboxes that are Checked

  jQuery('[id*=someCheckBox_]:checked');

Drop Down Lists

How to Add an Item/Option to a Drop Down List

 jQuery('#DropDownListId').append(jQuery('<option>').val(1).html("SomeText"));

Odd Note: Apparently jquery is smart enough to set the attributes on the option AND close the option with </option>

How to Remove an Item/Option from a Drop Down List

  jQuery('#DropDownListId option[value=\'3\']').remove();

How to Sort a Drop Down List by Option Text

  var sortedList = jQuery('#someDropDownList option').sort(
    function (first, second) {
      return first.text == second.text ? 0 : first.text < second.text ? -1 : 1;
    }
  );

  jQuery('#someDropDownList').html(sortedList);

Elements

How to Filter Out an Element in a List

  someElementList.filter('[id=someId]');

Example:

  //Uncheck all id like someId_ and check only where id = someId_1
  var someElementList = someElement.children('[id*=someId_]');
  someElementList.attr('checked', false);
  someElementList.filter('[id=someId_1]').attr('checked', true);

How To Find an Element Based on a Like Name/Using Wildcards

  jQuery('#SomeTable').children('tr[id*=SomeRowId]');

How To Know if a Something is Hidden

  jQuery('#CheckBoxId').is(':hidden')

Possible Use:

 function showOrHide(element) {
    if(jQuery(element).is(':hidden')) {
      jQuery(element).show();
    }
    else {
      jQuery(element).hide();
    }
  }

How to Disable an Input/Select

  jQuery('#DropDownListId').attr('disabled', 'disabled');

How to Enable an Input/Select

  jQuery('#DropDownListId').removeAttr('disabled');

How to Know if an Element Exists

  jQuery('#ElementId').length > 0

Possible use:

  function elementExists(elementId) {
    return jQuery(elementId).length > 0;
  }

String

How To Remove the First Character from a String

  someString.substring(1, someString.length)

Tables

How to Add a Row to a Table

  jQuery('#TableId > tbody:last').append('<tr>...</tr>')

How to Remove a Table Row

  jQuery('#TableId > tbody:last').children(someSortOfRowId).remove();

Methods

How to Post With a Link

  function postToUrl(path, params)
  {
    var method = "post"; 

    var form = document.createElement("form");
    form.setAttribute("method", method);
    form.setAttribute("action", path);
    for(var key in params)
    {
        var hiddenField = document.createElement("input");
        hiddenField.setAttribute("type", "hidden");
        hiddenField.setAttribute("name", key);
        hiddenField.setAttribute("value", params[key]);
        form.appendChild(hiddenField);
    }
    document.body.appendChild(form);    

    form.submit();
  }

Use:

<a href="javascript:postToUrl('/SomeController/SomeAction/', { 'id', '1' })">link</a>

• Child IFrame Page Interacting with Parent Page… Yeah I went there.
• Get the jQuery DatePicker to Work With jQuery Modal Dialog
• jQuery Modal Dialog : Hide That Stupid X Button / Windows Close Button
• jQuery – Check All Checkboxes Toggle Method Thingy
• jQuery Validation: Adding Errors to the Error Containter… With Love!

What is it? Something that was added to the holy jquery site and is an easy way to validate input from users. Now this should in no way take over for server side validation, but it helps to at least catch a few things without having to send anything to the server. So how do ya do it?

Well to start, you need some files:

jquery-1.3.2.js and jquery.validate.js.

Now oddly enough the validation file isn't hosted on the holy jquery site but how to use it is.

Ok now you have the files, what's next? Well you need form, and I can do that for you.

So basically it's a simple form with one input that is required.

jQuery(document).ready
    (
      function()
      {
        jQuery("#PrimaryForm").validate
        (
          {
            errorLabelContainer: "#ErrorDiv",
            wrapper: "div",
            rules:
            {
              FirstName :
              {
                required : true
              }
            },
            messages:
            {
              FirstName:
              {
                required : 'First Name is required.'
              }
            },
            onfocusout : false,
            onkeyup: false,
            submitHandler: function(label)
            {
              postSubmit();
            }
          }
        );
      }

jQuery("#PrimaryForm").validate

Real simple, just setting the validator to the primary form on the page.

 errorLabelContainer: "#ErrorDiv",

This sets the errors to show up in the ErrorDiv. Now this is optional, as you can have it show the errors next to the FirstName text box but personally I think that looks horrible. Setting up the ErrorDiv puts all the errors in one central location and allows for styling the actual div.

 rules:
 {
    FirstName :
    {
      required : true
    }
  },

This matches an element with the id of FirstName to the required rule, meaning that FirstName is required. Rocket science.

  messages:
  {
    FirstName:
    {
       required : 'First Name is required.'
    }
  },

If you can't figure this out, I hear circus is hiring for the "World's Dumbest Person". You'll fit in with Jub Jub the Dog Boy.

  onfocusout : false,
  onkeyup: false,

Basically this prevents the validation when leaving the textbox or on every key press. This is just another preference.

  submitHandler: function(label)
  {
    postSubmit();
  }

If the submit is successful, call this method.

But... BUT WHAT IF IT'S AN EMAIL?!??! WHAT WILL I DO???!?!?

Well for one, stop being such a child. And two, look here.

Some what different, as you can see it's now email and there is one extra requirement in the rules:

  rules:
  {
    EmailAddress :
    {
      email : true,
      required : true
    }
  },
  messages:
  {
    EmailAddress:
    {
      required : 'Yo, email fool.',
      email : 'So not an email address.'
    },
  },

See? It has nice built in rule for email. Simple.

BUT WHAT IF I NEED A REGULAR EXPRESSION?!??! WHAT WILL I DO???!?!?

I swear if you don't stop that, I'm turning this post around and going home.

Fine here it is.

  jQuery.validator.addMethod
  (
    "isZipCode",
    function(value, element)
    {
      return value.match(new RegExp(/(^\d{5}$)|(^\d{5}-\d{4}$)/));
    }
  );

Just have to create a method and "add it" to the validator itself. And then there's the use:

  rules:
  {
    ZipCode :
    {
      required : true,
      isZipCode : true
    }
  },
  messages:
  {
    ZipCode:
    {
      required : 'For the love of me, enter a zip code!.',
      isZipCode : 'Serioulsy?  Do you know what a zip code is?'
    },
  },

Woo hoo right?

Don't do it... Don't you yell.

But what if one input depends on another?

Much better. Well that's not as hard as it may seem and here's the example.

  rules:
  {
    InputB :
    {
      required :
      {
        depends : function(element) { return jQuery('#InputA').val() != "" }
      }
    }
  },

As you can see, you can change how the required method works by adding in a depends handler. Works out pretty well.

Yes I will show you how to make sure two inputs match. I swear you ask for a lot.

  rules:
  {
    Password :
    {
      equalTo : "#ConfirmPassword"
    },
  },

Couldn't be easier unless I wrote it out for you. Wait, I did.

So here you've either learned a bit about jQuery validation or have just spent the last few minutes drooling uncontrollably. Either way, I'm done with this post and you're left to do whatever it is you do, you sick f---.

Side note: I haven't actually been to Htmlgoodies since eh college? but wow did that place sell out. How fitting that an introduction to html page now looks like it was designed by someone just starting out... in the 90s.

• Child IFrame Page Interacting with Parent Page… Yeah I went there.
• jQuery Validation: Adding Errors to the Error Containter… With Love!
• jQuery: Add a Pop Up Div to a Link Dynamically
• JQuery, Position : Absolute, and How to Make It All Work
• Get the jQuery DatePicker to Work With jQuery Modal Dialog

Any time I declare this I always get the same look people had when that one dude in Total Recall took off his glove and had that weird chicken wing arm thing. I can't think of many directors that get the same free pass as he does for making, in my crazy mutant opinion, two good movies: Pulp Fiction and that one part of Four Rooms with the Zippo lighter bet. Ok so one movie and a section of another. Maybe Kill Bill 2 could be in there. Maybe.

Now I have to admit that I've been accused of having less than main stream opinions on movies. I'm not one of those people that only like a movie if it's made on a 10k dollar budget and ends up just as depressing as it started. (IE Every independent movie ever.) I enjoy movies that are thought provoking and relevant as questions like "What would green smell like?" or "Why do I have 10 ten toes?" However, I liked Star Trek: The Motion Picture the most out of the six because I felt it was very Star Trek like and the most intense of the bunch. I liked Alien 3 more than Aliens (Only after watching the Director's cut version though) because it had more thought out undertones. I think that Kill Bill 2 is far more interesting than 1 because it had story minus a bunch of tools running around like they're athletic (See The Matrix). I also still find Godzilla versus Mechagodzilla to be the best, even though Godzilla 2000 is far superior in ever aspect, because that one part where Gozilla and King Caesar are standing in front of and behind, respectively, Mechagodzilla and they think they have it flanked when it turns it's head around to look at King (With it's laser eyes) and swings out it's missle hands at Godzilla almost as if it was sayin, "You thought you got me, but I got missles b--ch. You ain't got s--t. "

Three things you can take from that: I probably don't line up with your tastes, I do have thought out excuses for my "condition", and I am a massive geek. I honestly feel that at this point I need to boost a car, take some E, and bench press 800 pounds at the same time to offset the horrendous black hole of geek I just created that threatens to pull us all in to an alternate, more geeky version of the world. No one wants that. No one but Adam Savage wants that.

At this point, you might see where I'm coming from. I'm clinically insane. However, that doesn't mean I'm not entitled to an opinion on Tarentino. The guy is like a 12 year old with a budget.

Remember when you were 12, watching Power Rangers, sitting in a rocking chair, while lathering yourself in a mixture of peanut butter and motor oil? Probably not (But if you do, call me) but you might remember watching a movie like Aliens and thinking "What if the aliens could talk?" or "What if the Aliens could use guns, that would be sweet cause they would be all like 'What up!' BLAM BLAM 'Screw you Marines!'" And let's be honest, there's a reason why you weren't making films at 12... or probably even now. (Honestly? Aliens using guns? What the hell were you on at 12?) Every time I see one of his movies now, that's all I can see: Tarantino lathered up in pean... Wait... I see Tarantino sitting around writing some movie, probably a masterpiece about a child who is taken from his family, forced into slavery, and then finds a way to unite the slaves against the slavers and bring peace to the his people. Followed by weeks of "What if aliens some how helped him free his people?" and then "What if the aliens give him awesome laser weapons and then there's a scene where he's all like 'I'm gonna make them pay' while standing on a mound of dead slavers and then he points the gun at one that's still sort of alive and shoots him and his head explodes and the aliens start dancing in joy! Oh man that'd be cool." (You might also call this the "Lucas effect") Somewhere, at some point, the good ideas he may have go from a smooth riding train to a train that just lost a wheel, jumped the track, and is plowing through some childrens' hospital.

And guess maybe that's the problem I have with him. It's clear that the guy is good with conversations and characters. It's clear that he could be a premier writer. It just seems like the 12 year old side of him takes over at some point. Oh well, that 12 year old has done him well financially so who am I to say what's good?

In the end, it just comes down to preference. Maybe I don't have the part of the mind that gets satisfaction from way over the top insanity in movie form (I think it's seated somewhere in between the part that enjoys chili cheese fries and the part that makes people stop and stare at highway accidents.), and if you do well more power to you. Just don't judge me based on my thinking he's straight up overrated or that he isn't a god of filming. Then again I'm not the kind of person who looks for religious overtones in the Star Wars series, so maybe I'm just too dumb to see the brilliance.

Oh and side note: HE HAD NOTHING TO DO WITH HERO EXCEPT WITH HELPING WITH PUSHING UP THE TIME LINE OF THE US RELEASE. Don't f--king even think he had any real hand in what's probably the best epic movie in existence.

Other Note: Apparently resident "computer wiz" Andre refused to read more than the title of this post. He's one of them...

• No Related Posts

Automapper is pretty much what it sounds like, it maps class properties automatically. Maybe a more clevererest name would have been ClassPropertyAutoMapper, but the guys who made it shouldn't be persecuted for lacking creativity.

How simple is Automapper? Simple enough that even you can use it. Now that's simple! Say you have two classes, a entity class and a model, and you want to map the model to the entity in the constructor. You could do:

  public class SomeModel
  {
    public SomeModel(SomeEntity someEntity)
   {
     SomeProperty = someEntity.SomeProperty;
   }
  }

But where's the lazyiness? I expect so much less from you. But it's ok, salvation is right here:

  public SomeModel(SomeEntity someEntity)
  {
    Mapper.CreateMap();
    Mapper.Map(someEntity, this);
  }

But... but what if there are properties on SomeModel that don't directly map by name? Well, there's an ap...i for that. (Not sure that even makes sense but it was clever.)

  public SomeModel(SomeEntity someEntity)
  {
    Mapper.CreateMap<FiftyPostUser, UserInfoViewModel>()
     .ForMember(test => test.Status, tester => tester.MapFrom(item => item.Status.ToString()));
    Mapper.Map(someEntity, this);
  }

So I know you're thinking that there's a catch, well there is. You have to actually get the dll and reference in your project. I know! Work is hard. Why can't these guys just come to your place of work/home/mom's basement and do it for you? What kind of world is it when you can't get all that for free? Personally, I hate it.

• Data Annotations, MVC, and Why You Might Like Them
• State List in Dictionary Form
• Entity Framework: Possible Lazy Loading Solution
• By Reference in C# and How to Get Schooled By It
• C#, Var, and Objec- Propert- I have no idea what the term is

    public Dictionary GetAllStates()
    {
      if(_stateList == null)
      {
        _stateList = new Dictionary();

        _stateList.Add("Alabama","AL");
        _stateList.Add("Alaska","AK");
        _stateList.Add("American Samoa","AS");
        _stateList.Add("Arizona","AZ");
        _stateList.Add("Arkanas","AR");
        _stateList.Add("California","CA");
        _stateList.Add("Colorado","CO");
        _stateList.Add("Connecticut","CT");
        _stateList.Add("Delaware","DE");
        _stateList.Add("District Of Colombia","DC");
        _stateList.Add("Federated States Of Micronesia","FM");
        _stateList.Add("Florida","FL");
        _stateList.Add("Georgia","GA");
        _stateList.Add("Guam","GU");
        _stateList.Add("Hawaii","HI");
        _stateList.Add("Idaho","ID");
        _stateList.Add("Illinois","IL");
        _stateList.Add("Indiana","IN");
        _stateList.Add("Iowa","IA");
        _stateList.Add("Kansas","KS");
        _stateList.Add("Kentucky","KY");
        _stateList.Add("Lousiana","LA");
        _stateList.Add("Maine","ME");
        _stateList.Add("Marshall Islands","MH");
        _stateList.Add("Maryland","MD");
        _stateList.Add("Massachusetts","MA");
        _stateList.Add("Michigan","MI");
        _stateList.Add("Minnesota","MN");
        _stateList.Add("Mississippi","MS");
        _stateList.Add("Missouri","MO");
        _stateList.Add("Montana","MT");
        _stateList.Add("Nebraska","NE");
        _stateList.Add("Nevada","NV");
        _stateList.Add("New Hampshire","NH");
        _stateList.Add("New Jersey","NJ");
        _stateList.Add("New Mexico","NM");
        _stateList.Add("New York","NY");
        _stateList.Add("North Carolina","NC");
        _stateList.Add("North Dakota","ND");
        _stateList.Add("Northern Mariana Islands","MP");
        _stateList.Add("Ohio","OH");
        _stateList.Add("Oklahoma","OK");
        _stateList.Add("Oregon","OR");
        _stateList.Add("Palau","PW");
        _stateList.Add("Pennsylvania","PA");
        _stateList.Add("Puerto Rico","PR");
        _stateList.Add("Rhode Island","RI");
        _stateList.Add("South Carolina","SC");
        _stateList.Add("South  Dakota","SD");
        _stateList.Add("Tennessee","TN");
        _stateList.Add("Texas","TX");
        _stateList.Add("Utah","UT");
        _stateList.Add("Varmont","VT");
        _stateList.Add("Virgin Islands","VI");
        _stateList.Add("Virginia","VA");
        _stateList.Add("Washington","WA");
        _stateList.Add("West Virginia","WV");
        _stateList.Add("Wisconsin","WI");
        _stateList.Add("Wyoming","WY");
      }

      return _stateList;
    }

So there. Hope you're happy.

• By Reference in C# and How to Get Schooled By It
• Static Abstract … should I bother?
• Convert a String to a Number String With Linq… YAY
• I are tupid
• Data Annotations, MVC, and Why You Might Like Them

Going forward, you can feel confident that if you leave a comment it will exist until we change hosts and Andre has control of moving it again.

• No Related Posts

Complex types, in the simple minded way I see them, are a way to split information retrieved from a table into a object within an object. Confused yet? I hope so.

Say you have a User table and on that table you have the typical user information including a bunch of stuff like Name, Sex, City, State, and Zip. Now you could set up the user class to look like this:

  public class User
  {
    public String Name { get; set; }
    public String City { get; set; }
    public String State { get; set; }
    public String Zip { get; set; }
  }

Nothing wrong with that, but what if you have an Address class:

  public class Address
  {
    public String City { get; set; }
    public String State { get; set; }
    public String Zip { get; set; }
  }

That you wanted to map the values from the User table to the User class to so that the User class looked more like this:

  public class User
  {
    public String Name { get; set; }
    public Address Address { get; set; }
  }

Well I'm here to tell you that you can and I have plenty of pictures to back it up.

Keeping with the design from this guy, I am going to add a new class called AdDimension which will have Height and Width, effectively replacing the Height and Width properties on the Ad class.

RECAP - Old class diagram:

So the first thing I have to do is is create the complex type in the Model Browser. That's pretty easy. There's a section called "Complex Types" and you just add one.

See, there's a picture. Next step is adding properties to the newly created complex type.

Another picture! Ok so now you've created on, big deal. Now what? Well you have to add a complex type property to the main class, Ad in this case.

Now if you have more than one complex type, you might have to set the property type to the correct one. Just right click the complex property and click on properties:

Now, you'll have to adjust the mapping for the entity itself. So click on the object and bring up mapping properties. From there, select the correct mapping for the correct column. In this example it's width and as you can see in the drop down there is a AdDimension.Width property to set it to. Cool huh?

And that's it for the object model. Next you have to add the AdDimension class and add a property to the Ad class.

  public class AdDimension
  {
    public Int32 Height { get; set; }
    public Int32 Width { get; set; }
  }

  public class Ad
  {
    ...
    public AdDimension AdDimension { get; set; }
    ...
  }

And then how do you set it?

  someAd.AdDimension = new AdDimension();
  someAd.AdDimension.Height = 10;
  someAd.AdDimension.Width = 10;

And it can even be used in queries:

  context.Ads.Where(ad => ad.Width > 10);

Now there are things to be aware of. Complex types can't inherit from other complex types and the property can't be null when saving. Just be aware of that.

I'm telling you man, this s-- is the s--- man. It's the s---.

• .Net 4.0 Beta 2 Entity Framework – Many To One and POCO / INSERT statement conflicted with the FOREIGN KEY constraint issue
• .Net 4.0 Beta 2 Entity Framework – How To Start
• Entity Framework: Am I Just Being Stubborn?
• Entity Framework: LINQ to Entities only supports casting Entity Data Model primitive types
• Entity Framework: Reusable Paging Method

Taking the structure from the last post, I added an AdType. It's very simple. Columns are AdTypeId (Int Primary) and Description (Varchar). I added a AdTypeId column to the Ad table and created a foreign key to the AdType table with it.

Basically Many Ads to One AdType.

Then I did the usual Update Model From Database with the .edmx file. Same old same old. Well this added the AdType class and the relationship:

So far, so good. Now with this it also means that I need to create the AdType class and add the AdType property to the Ad class along with the AdTypeId property.

Side Note:

Far as I can tell, you need the AdTypeId property despite also having the AdType property. Don't forget this.

Here's the AdType class:

  public class AdType
  {
    public Int32 Id { get; set; }
    public String Description { get; set; }

    public virtual IList<Ad> Ads { get; set; }
  }

And on the Ad class I had to "Ad" (HARHRHARHR) the AdType property along with the AdTypeId property:

  public class Ad
  {
    public Int32 Id { get; set; }
    public DateTime CreatedDate { get; set; }
    public String Name { get; set; }
    public DateTime? LastUpdated { get; set; }
    public Int32 Height { get; set; }
    public Int32 Width { get; set; }

    //Interesting note: Works even if this is private and non virtual
    private Int32 AdTypeId { get; set; }

    public virtual AdType AdType { get; set; }
    //Note:
    //If properties are to be lazy loaded, must be virtual
    public virtual IList<Newpaper> Newspapers { get; set; }
  }

Classes are done. Should be good to go right? WRONG YOU ARE SO F-ING WRONG! Just try this, I dare you:

   Ad ad = new Ad();

   ...
   ad.AdType = someAdType();
   context.Ads.Add(ad);
   context.SaveChanges();

DUN DUN DUUUUN INSERT statement conflicted with the FOREIGN KEY constraint.

You try it? Idiot. You just got stuffed by a foreign key error. Why? Well The Big M has an answer:

In this example, Customer is a pure POCO type. Unlike with EntityObject or IPOCO based entities, making changes to the entity doesn't automatically keep the state manager in sync because there is no automatic notification between your pure POCO entities and the Entity Framework. Therefore, upon querying the state manager, it thinks that the customer object state is Unchanged even though we have explicitly made a change to one of the properties on the entity.

Basically because these objects aren't really being watched by the State Manager, it has no idea anything has changed and should be persisted. Therefore, it has no idea that the AdType property has changed and that the AdTypeId should be updated to reflect this. That's right, it just ignored the AdType property and left the AdTypeId to it's default... 0 (That's a Zero or as the English say, Zed). How do you get around this? This little option.

  context.SaveChanges(System.Data.Objects.SaveOptions.AcceptAllChangesAfterSave);

This tells it to persist the changes that it didn't know about. Now I'm still picking this up as I go so bare with me as I might have the best explanations yet on why things work with the New Entity Framework. Then again, this is a site by a tool.

• .Net 4.0 Beta 2 Entity Framework – How To Set Up Complex Types, Now With More POCO
• .Net 4.0 Beta 2 Entity Framework – How To Start
• Entity Framework: Am I Just Being Stubborn?
• Entity Framework: LINQ to Entities only supports casting Entity Data Model primitive types
• Entity Framework: Reusable Paging Method

Saving changes is not permitted. The changes that you have made require the following tables to be dropped and re-created. You have either made changes to a table that can't be re-created or enabled the option Prevent saving changes that require the table to be re-created.

Normally I don't like copy/paste solutions but I also can't stand wading through Microsoft issue explanations. This is how you fix it in quick picture form:

Tools -> Options -> Designers

The worded Solution is from here.

While trying to save changes to a table, it's because you've done this:

• You change the Allow Nulls setting for a column.
• You reorder columns in the table.
• You change the column data type.
• You add a new column.

And there it is folks, simple and done with.

• No Related Posts

After doing a little reading, and by little I mean as little as humanly possible while still having an idea of what I'm doing, I got the new EF to persist an object. Mind you, it took a bit of patience followed by slamming my head into my desk and then more patience, but I did it.

First off, the actual creating of the edmx file is the same, there's really no difference. You still go through the wizard, you still go through the connection set up, and you still grab the tables you want. No change there.

However, once you have it created, click on the .edmx file in your solution explorer, right click, then click properties. You'll see something like this:

You can see where there is nothing in the Custom Tool area of properties. That's because I deleted the text. That's the first part of what you need to do. Next is creating the needed classes. For this example I have two, Ad and Newspaper:

namespace Beta2Test.Data.Entity
{
  public class Ad
  {
    public Int32 Id { get; set; }
    public DateTime CreatedDate { get; set; }
    public String Name { get; set; }
    public DateTime? LastUpdated { get; set; }
    public Int32 Height { get; set; }
    public Int32 Width { get; set; }

    //Note:
    //If properties are to be lazy loaded, must be virtual
    public virtual IList<Newspaper> Newspapers { get; set; }
  }
}

and

namespace Beta2Test.Data.Entity
{
  public class Newspaper
  {
    public Int32 Id { get; set; }
    public Int32 Circulation { get; set; }
    public DateTime CreatedDate { get; set; }
    public DateTime LastUpdated { get; set; }
    public String Name { get; set; }

    //Note:
    //If properties are to be lazy loaded, must be virtual
    public virtual IList<Ad> Ads { get; set; }
  }
}

Three things you might notice:

1. The classes don't inherit from anything. Yay
2. The namespace is Beta2Test.Data.Entity. Fact is, I left it there to show that the namespace can now be anything. Yay
3. Both collection properties are virtual. This is a must when dealing with collections that represent a relationship and you have lazy loading enabled (See below context class). For this, there is a many to many relationship between Ads and Newpapers. The Ads and Newspapers collection represent that. Why do that have to be virtual? Has to do with Entity Framework needing a way to override the properties so it can tell when they are accessed. (Read: Lazy Loading)
4. There is no fourth thing. You are wrong if you think there is.

So far so good, but what about that like whole linking to that persistence layer stuff. You know like them entity objects yo.

Thank you for that poorly worded inquiry, but valid none the less. Remember those entity context classes that it used to generate for you? Well that whole "custom tool" dohickey I removed would have built it for me. However, that's not the path we're going down anymore. It's now time to brave the unknown. We, yes we, will build the context. Yes the context.

using System.Data.Objects;
using Beta2Test.Data.Entity;

namespace Beta2Test.Data
{
  public class Beta2TestContext : ObjectContext
  {
    private ObjectSet<Ad> _ads;
    private ObjectSet<Newspaper> _newspapers;

    public Beta2TestContext() : base("name=InterviewDemoEntities", "InterviewDemoEntities")
    {
      _ads = CreateObjectSet<Ad>();
      _newspapers = CreateObjectSet<Newspaper>();

      //This makes sure the context lazy loads by default
      ContextOptions.LazyLoadingEnabled = true;
    }

    ///
    /// This is used to set up the "queryable" collection.
    ///
    public ObjectSet<Ad> Ads
    {
      get
      {
        return _ads;
      }
    }

    public ObjectSet<Newspaper> Newspapers
    {
      get
      {
        return _newspapers;
      }
    }

    ///
    /// This creates an ad that allows it "to be used with the Entity Framework."
    ///
    ///
    public Ad CreateAttachedAd()
    {
      return EntityContext.Context.CreateObject<Ad>();
    }

    public Newspaper CreateAttachedNewspaper()
    {
      return EntityContext.Context.CreateObject<Newspaper>();
    }
  }
}

The CreateAttached methods aren't needed on the Context class itself, I just put them there. They could go on the Ad/Newspaper class but at this point I'm not sure if that blurs the lines or not. Haven't gotten into best practices mode yet.

You may notice the ObjectSet collections on the context. These are the collections you will query to get items most likely, much like the old context class from the last version:

Context.Ads.Where(ad => ad.Id == 1)

Pretty nice, huh?

Also, I noted above about the virtual properties on the Ad/Newspaper classes and how it had to do with lazy loading.

ContextOptions.LazyLoadingEnabled = true;

That line and the virtual properties ensure that lazy loading will occur when the property is used. Both have to be used together. Now you don't have to put that line in the constructor if you do create a context every time you are retrieving things, you could just set it on a case by case basis. Up to you. I use a singleton like context so I just set it true in the constructor and don't worry about it.

The main thing I had trouble with was this line:

public Beta2TestContext() : base("name=InterviewDemoEntities", "InterviewDemoEntities")

Because I wasn't sure what the second string should be. First one is easy, it's whatever the key in the config file for the connection string. Second, chances are, is the same depending on how you set it all up in the wizard. I think it's the same name when you right click on the opened .edmx file and view properties. There should be a property named "Entity Container Name".

Here's a method I used for testing to create an Ad:

  public Ad CreateAd(Boolean persist)
  {
    Ad ad = null;

    if (persist)
    {
      ad = EntityContext.Context.CreateAttachedAd();  //This is the CreateAttachedAd method above in use
    }
    else
    {
      ad = new Ad();
    }

    ad.CreatedDate = DateTime.UtcNow;
    ad.Height = RandomTool.RandomInt32(0, 10);
    ad.LastUpdated = DateTime.UtcNow;
    ad.Name = RandomTool.RandomString(10);
    ad.Width = RandomTool.RandomInt32(0, 10);

    if (persist)
    {
      AddEntityForRemoval(ad);  //Ignore, for persistence removal after testing is completed
      EntityContext.Context.Ads.AddObject(ad);  //Ad the ... ad to the context
      EntityContext.Context.SaveChanges();  //Persist
    }

    return ad;
  }

There are some things you can ignore because I didn't feel like removing code. As you can see though, it's not very complicated. Use the CreateAttachedAd, fill in the properties, ad to the Ad collection on the context, and save.

The End

Sure you had to do more work than in the earlier version of Entity Framework, but on the other hand I have a fully detached class that can inherit from any class I WANT it to as opposed to the EntityObject class. Not to mention I now have an easy way to do lazy loading. Far cleaner than the old way I did it. The other interesting thing to note, and this may not be a big deal to anyone else, but above I have a note about this:

  AddEntityForRemoval(ad);  //Ignore, for persistence removal after testing is completed

This method just adds the object to a collection of EntityObjects that later I use to delete the object from the database on test cleanup. After moving to this version of EF, I had to change it to a collection of Objects. Interesting thing is:

  EntityContext.Context.DeleteObject(currentObject);

Didn't care. It still knew that the object was attached to the context somehow, despite the CLASS not being an EntityObject. Just an odd note.

Two Errors I came across:

System.InvalidOperationException: Mapping and metadata information could not be found for EntityType 'Beta2Test.Data.Ad'.

If you get this, there is a really good chance you screwed up a property name or are missing it completely. If the property name doesn't exactly match one in the .edmx class designer template, you're screwed. If you don't have it on the class but it's on the class designer template, you're screwed. If you add it to the class designer template, it has to be on the class as far as I can tell. Now, it doesn't have to be public. I have tested it as private and it works just fine.

The required property 'Newspapers' does not exist on the type 'Beta2Test.Data.Ad'.

This most likely happens if you didn't remember to make it a property:

public IList<Newpaper> Newpapers;  //Forgot the { get; set; }

public IList<Newpaper> Newpapers { get; set; };  //Forgot the Virtual

Opps.

• .Net 4.0 Beta 2 Entity Framework – How To Set Up Complex Types, Now With More POCO
• .Net 4.0 Beta 2 Entity Framework – Many To One and POCO / INSERT statement conflicted with the FOREIGN KEY constraint issue
• Entity Framework: Am I Just Being Stubborn?
• Entity Framework: LINQ to Entities only supports casting Entity Data Model primitive types
• Entity Framework: Reusable Paging Method

When I started using MVC, I had some issues on figuring out how to build controllers so that they made sense from a structural point of view. I slightly touched on it but I wanted to show where I progressed to in the vain hope that I can help prevent stumbling on your part.

One thing to be noted is the asynchronous part. I've become a firm believer that MVC is pointless without asynchronous operations. Why? Simply put, you can use them or you can come up with some annoying post and redirect for any create, update, or delete operations. If you're going to do that, you might as well just be institutionalized because you are one masochistic mother f---er. For everyone else in the happy world, go with something like jQuery that makes it real easy to perform said operations.

With the last paragraph in mind, the part I had trouble with the most was figuring out where the actions go. You see, when I started using MVC, I grouped stuff in an ultra simple manor. Say I have a site for handling pictures. Well there would be a view controller that would have anything to do with viewing images and an admin controller that took care of the uploading, changing, deleting, ecting. As you can imagine, this was not what you might call ideal.

Once I got a feeling for MVC and how it worked, I started having things a little more separated but still didn't feel right. I had actions for viewing a list of images on the image controller no matter if public or admin side which wasn't really ideal to me since it kind of blurred what was public and what was restricted from a conceptual point of view.

It wasn't until I started thinking in terms of unit testing that it started to make more sense. If I were creating controllers as if they were classes instead of pages like with WebForms, maybe it would work out better. Seems real profound right? Well it was at the time since I still had WebForms state of mind. All of a sudden, it made way more sense on how the controllers should be set up. In an odd way, the controllers almost became almost business layer like. If I wanted to update an Image, there would be an Update method on the image controller responsible for taking in the changes, validating, and dealing with the entity objects. Everything that had to do strictly with displaying information would be handled by a display controller like the before mentioned Admin controller. So something like:

As you can see, the Admin controller has something to show all users. The User controller has the methods for things like updating, creating, and validation. Basically anything that would change an image is on one controller. Anything for showing it on the main section controller. That is, a controller that embodies an overall concept like say an Admin section of a site or possibly a controller for viewing galleries.

The sequence of events (bad word choice...) would be something like:

Open Admin/UserList/
Admin controller uses User Entity to retrieve list
Admin View shows User List
User clicks delete button/link on Admin View
Javascript/jQuery method invoked to send id to User/Delete
User controller receives id
User controller validates id to make sure it is valid
User controller validates current user to see if allowed to delete
User entity Delete method invoked by User Controller
Result of Delete Method is returned by User Controller (JSon preferably)
Admin View displays the result

Treating controllers like classes (and the use of anonymous actions) allows a very clean separation of actions resulting in a nice logical layout. Beyond this, it also allows for a greater separation between controllers which means its possible to do multiple parts of the entire project in parallel.

Maybe this is just stating the obvious, something I'm pretty good at, but my hope was to give a quick over view of laying out controllers for those who are just starting out.

• ASP.Net MVC: Is the Use of jQuery/Asynchronous calls a Must?
• Are jQuery and Asynchronous Calls against MVC?
• Child IFrame Page Interacting with Parent Page… Yeah I went there.
• Get the jQuery DatePicker to Work With jQuery Modal Dialog
• jQuery Modal Dialog : Hide That Stupid X Button / Windows Close Button

Now as you can see, it looks like a table, acts like a table, so it must be a table right? Well it isn't. It's actually done with divs and styles, something I've worked hard on getting right since moving to MVC.

I'm not bagging on the question asked because I'm probably a mutant and the only person that thinks the way I do (and have written below). I just have a philosophy that if you can do it yourself, do it yourself.

For starters, I'm not against new stuff, I think that's pretty obvious. I'm also not completely against third party stuff seeing as a lot of my newer posts deal with jQuery. I do, however, avoid third party tools I don't need, namely grid builders or things of that nature. I figure that if I can do it myself, I'll do it myself. This kind of hits on the debate of using Visual Studios's drag and drop feature for designing pages or not. Sure it's easy and for the most part works, but you are really doing yourself a disservice. Why? Because most of the time you can get away with it, it's those few times that it just won't do what you want it to do that kill you.

When you use helper tools, you could be cheating yourself out of knowledge

Now I'm not saying that you should develop your own tools for rendering 3d graphs. Some things you just don't have the time or the ability to create, but when it comes to simple things like markup, do the work. The knowledge you gain from this is substantial. Hell, I used to hate style sheets. I used to hate javascript. Quite frankly, they were a pain in the a-- at first. However, taking the road less travelled has given me a new perspective on both. I no longer fear them and in fact would rather just type the markup out myself than trust some third part thing that I can't fix when something goes wrong. I know that if I have to create a quick mock up that looks like the real deal, I can do that with notepad and a browser. I know that if I have to teach someone how to use style sheets or javascript, I can do that without just telling them to go to some page or to use some random tool. I have confidence in my knowledge.

More time now, less time later.

Now I know in Perfectworld, there is always enough time allotted to doing what needs to be done. In Realworld (Not the stupid MTV show) everyone is running around, heads a blaze. So the biggest excuse to not learn proper markup is that there isn't time. A company isn't going to pay you to learn when things need to be done. Well sure, but flash forward a couple months when someone tells you that you have to adjust the grid you didn't build yourself to add something you have no idea how to add or else the world is going to end. Last thing that person will want to hear is "It can't be done." In fact, most business people have some crazy allergic reaction to that phrase that causes them to turn really, really red. It's weird but happens a lot. At this point you can either:

Laugh and lose your job.

Go on the forums and hope there is a solution.

Die a quick and painful death.

Always expect people to want 20% more than what was originally written. Unless you have one of the best project managers that says the phrase "Work request form" on instinct, you will run into this situation. That's where doing it yourself comes in real handy. It may have taken you a while to figure it all out, but you will for certain be able to fix the issue quickly.

You never know when you'll actually have to know how to build things from scratch

Tech Interviews. When looking for a job, you'll probably run into these. Best way to be prepared for these? Have the real world knowledge. How do you get that? By doing a lot of the work yourself. I have been through interviews where I was given a simulated work item and told to produce code for it on the spot. Some of it had to do with the actual markup needed to display the data. (This was before MVC days, WebForm stuff) The people were far more impressed that I was typing out the mark up than if I had just done drag and drop stuff. Why? Because there is a stigma, fair or not, that drag and drop people are displaced VB Weenies, and the real programmers don't bother with it. Knowing how to hand code mark up on the spot is far more impressive than using visual tools or completely blanking out because you've had to rely on third party software.

At this point I realize I've mostly talked about markup, but this whole idea extends to a lot of the programming world. Digging in and forcing yourself to do the work will substantially improve you abilities over time. If you can't do this at work then find some time on your own to work on a side project to learn. Build your own error handling system. Build your own pager creating method. Build your own Url creating method for MVC. I promise that you will be in a much better position.

Final Note

You could argue that coming to a site like this and using copy/paste is against my spiel. Fact is, I've copy and pasted plenty of code to get to where I want to go. Difference between this and third party tools is you can learn from what you copy and paste. Actually I would argue that you have the responsibility to learn about what you are copying before you do anything with it. If you copy AND you take time to understand what you are copying, that can be just as helpful. If nothing else, it's better than just using some third party method.

• No Related Posts

Here's what this post is about: Say you have a url like eh:

/User/View/1

Where 1 represents a UserId to a user that exists in some matter of context. (Does that makes sense?) Well there are a couple of things that could go wrong here. For one, if you don't want to have a nullable id in your signature:

  public ActionResult View(Int32? userId)

This could cause ouch:

/User/View/

But this problem is deeper. Much deeper. In fact so deep it deeper than even Piper Perabo has ever deeped before. Yrraaaahh!

What if the id doesn't even refer to anything? Say the id is 101 but there's no user with the id of 101? Beyond that, what if the id could be Id in some routes but UserId in others? WHAT WOULD YOU DO???

The idea here is to have something neato like this:

  [UserExistsById]
  public ActionResult View(Int32 userId)

And if that id is junk, then you redirect to an error page. Well if this sounds interesting, I'd be surprised, but read on in the event that it does.

Now this isn't accomplished in the most simple manor, but for good reason: The more time in means the less time repeating. First method we need is something to simply check the route data to see if something exists:

  public static Boolean RouteDataValueExists(ActionExecutingContext filterContext, String idToCheck)
  {
    return filterContext.RouteData.Values.ContainsKey(idToCheck);
  }

Real easy. It either has been digested by MVC and regurgitated into some kind of route value or it hasn't. Basically this is the first check. After all, if it doesn't exist why bother going further?

Next is the method that will be calling this one. Mainly one that uses the RouteDataValueExists and if returns true, then it actually checks the value against where ever the user is persisted.

  public static Boolean ValueFoundAndItemExists
  (
    ActionExecutingContext filterContext,
    Enum idToUse,
    Func<ActionExecutingContext, Enum, Func<Int32, Boolean>, Boolean> check,
    Func<Int32, Boolean> exists
  )
  {
    Boolean checksOut = false;
    String convertedId = idToUse.ToString();

    if (RouteDataValueExists(filterContext, convertedId))
    {
      checksOut = check(filterContext, idToUse, exists);
    }

    return checksOut;
  }

Ok so kind of a lot at first and it's hard to decide how to present this system, so just go with it.

  Enum idToUse,

This is a design choice. In reality this will be turned into a string anyhow, but the idea is it will be what to check the route values for. So if you are checking for UserId, you will pass in UserRequestTypes.UserId. Again this was a choice on my part as I hate passing text around.

  Func<ActionExecutingContext, Enum, Func<Int32, Boolean>, Boolean> check,

This is the method that will be used by ValueFoundAndItemExists to delegate out the actual checking if the id is an integer and is a real user.

Func<Int32, Boolean> exists

This will be the method that you will use to delegate the whole checking if it exists in the database. Something like:

  class User
  {
    public Exists(Int32 id)
    {
       return EntityContext.Context.User.Any(user => user.Id == id);
    }
  }

Still with me? No? Greeeeat. Next up is the base class that contains the

  Func<ActionExecutingContext, Enum, Func<Int32, Boolean>, Boolean> check,

parameter from above.

public abstract class BaseExistsAttribute : ActionFilterAttribute
{
  protected Boolean Exists
  (
    ActionExecutingContext filterContext,
    Enum idToUse,
    Func<Int32, Boolean> exists
  )
  {
    Int32? id = Convert.ToString(filterContext.RouteData.Values[idToUse.ToString()]).ConvertTo<Int32>();
    return id.HasValue && exists(id.Value);
  }
}

Ok so something might look familiar like well basically all the parameters. The reason for this is that there is a little bit of delegate passing going on with this whole system. One method passes on methods to other method in some kind of crazy method hoe down without the flanel shirts.

You will notice the use of the enum in this part:

  idToUse.ToString()

Again, you can easily just pass in a string instead of an enum, I just did this to stay away from strings.

Only thing that might be of interest is the ToConvert method that you can find here. You don't have to use it, you can simply just do a try parse on the

  filterContext.RouteData.Values[idToUse.ToString()])

To get an integer. That's up to you. I could have just put that in the code for you to see but then I couldn't randomly plug another post of mine.

Finally you have the actual attribute class:

  [AttributeUsage(AttributeTargets.Method)]
  public class QuoteExistsByQuoteId : BaseExistsAttribute
  {
    public override void OnActionExecuting(ActionExecutingContext filterContext)
    {
      base.OnActionExecuting(filterContext);

      if
      (
        !MvcMethods.ValueFoundAndItemExists
        (
          filterContext,
          UserRequestTypes.UserId,
          Exists,
          UserEntity.Exists
        )
      )
      {
        filterContext.Result = SiteMethods.ErrorOut(ErrorNames.General_PageError);
      }
    }
  }

And now it all comes together.

  UserRequestTypes.UserId

This is the enum I've been talking about this entire post! Now that I think of it, not really exciting.

  Exists

That's the method on the base class that checks for everything.

  UserEntity.Exists

And that's the method I need to check the persistence if the user is real. Remember? Takes in an integer and returns a boolean? Yes? Yes? No?

What's ErrorOut? Again this is just a method I made to create an ActionResult that is an redirect to an error page. Not hugely important. It's just what handles the situation when the value is bogus.... dude.

  [UserExistsById]
  public ActionResult View(Int32 userId)

And there you have it. Hopefully it was useful in some way but I'm not of touch with reality.

• ASP.NET MVC: Attributes and Semi Dynamic Check for Request Parameters
• ASP.Net MVC: Attributes, ActionFilterAttribute, and Why You Might Want To Use Them
• Data Annotations, MVC, and Why You Might Like Them
• ASP.Net MVC: Quick Overview of Controller Structure
• ASP.Net MVC HtmlHelper Method for Creating Buttons With Forms and Optional Images: Part 1

Say you have this:

  <div>
    <input type="checkbox" name="JqueryIdList" value="1"  />
    <input type="checkbox" name="JqueryIdList" value="2" />
    <input type="checkbox" name="JqueryIdList" value="3" />
    <input type="checkbox" name="JqueryIdList" value="4" />
  </div>
  <div onclick="getIds('JqueryIdList');">
    CLICK
  </div>

And you need the getIds method to find all the checked checkboxes from that markup. Well it's actually fairly simple, or at least it wil be once I enlighten you. I should get paid for this...

  function getIds(checkList)
  {
    var idList = new Array();
    var loopCounter = 0;
    //find all the checked checkboxes
    jQuery("input[name=" + checkList + "]:checked").each
    (
      function()
      {
        //fill the array with the values
        idList[loopCounter] = jQuery(this).val();
        loopCounter += 1;
      }
    );
    ...
  }

The important part is this:

 jQuery("input[name=" + checkList + "]:checked").

As you can see, it is very simple. Give it the name of the checkboxes, add on the ":checked" and boom you have a list of checked checkboxes. Could it be more simple? I think not.

• Child IFrame Page Interacting with Parent Page… Yeah I went there.
• Get the jQuery DatePicker to Work With jQuery Modal Dialog
• jQuery Modal Dialog : Hide That Stupid X Button / Windows Close Button
• jQuery – Check All Checkboxes Toggle Method Thingy
• jQuery Validation: Adding Errors to the Error Containter… With Love!

You have a comment area that allows a user to view comments. Now this comment area is created using javascript (Read jQuery) only. When a user clicks on some kind of pager, a method is called to get a list of comments and recreate the comment table. Now you would think it would be a good idea to hide the table, recreate it, and then show it. Sounds like a decent way to go. So you try something like this:

  ...

  jQuery(commentTable).hide("slide", { direction: "up" }, 200 );

  ...

  //Get the comments and call a method to build the table.

  ...

  function buildTable(commentList, commentTable)
  {
    ...

    //Take the list and iterate.  Create a row

   ...

     jQuery(commentTable).appendChild(someCreatedDivRowWithAComment)  //BOOM

   ...
  }

Then you run it and bam you get an error saying that basically commentTable doesn't exist. Now if this were WebForms and you did some kind of visible="false" you would know that the markup for that table wouldn't exist. However, in javascript style="display:none;" doesn't remove the element from the markup, it just hides it from the viewer. If you look at the source (Provided it's not dynamically created) you will still see it in the mark up. So what's the deal?

Well for some reason the creators of jQuery decided that there is a difference between a hidden element and a non hidden element to the point where you have to change your search (the jQuery() method is basically a search that looks for the element within the parenthesis) by adding on a "parameter".

  jQuery(".someElement:hidden")

So if you do use the hide() method (Or fadeOut for that matter) you have to use the :hidden addon to find the stupid element. This can cause a big problem when things aren't timed correctly. What does that mean? Well that 200 value I have in the hide method, that's the time I want it to take to hide the element. Far as I can tell, and I've done some testing on this, the element is not :hidden until the animation completes. Which means there are 200 time units where it is not :hidden. Now if the time that it takes to get your comment list and start building the table is less than the time it takes to hide the element you've got an issue. Or conversely, if the 200 time units are up and it is now hidden, you're really screwed because the normal search won't work. You can try something like this:

   if(jQuery(this).children(".categoryBlockContainer").is(":hidden"))
  {
    categoryBlockContainer = jQuery(this).children(".categoryBlockContainer:hidden");
  }
  else
  {
    categoryBlockContainer = jQuery(this).children(".categoryBlockContainer");
  }

And this works ok most of the time, but you still might run into a situation where it's still trying to finish the hide animation. Beyond that, it seems kind of asinine to have something like that in the code. It should find the element at all times, hidden or not.

This really kills the whole idea of animation.

Between this and javascript's bizarre variable scope, I've had some thoughts of changing my profession.

• No Related Posts

So one of the things I ran into some what recently was a grid... a grid with a death wish and a thirst for revenge. It also has a bunch of check boxes to allow multiple row deletes as seen here:

Now there might be a moment of panic and doubt (Or doubt and panic, everyone reacts differently) when you realize you no longer have those cushy grid postback events. WHAT ARE YOU GOING TO DO???? Well first you're going to feel disgust over your profuse sweating, cause lets be honest you're pretty gross. Then you're going to read on and find that all your panic, fun as it can be, was for nothing. Why? Because you have me... and not in some weird love kind of way because I don't even know you. More of a "You can count on me because I'm like that cool older brother you never had and because of which you ended up a social degenerate ie a programmer" kind of way.

Now to start I've already hosted both the code and a working example:

Actual running thing on teh webz.

Hosted code

Because I'm such a nice guy. (And that's true, I can list at least five people who aren't my mom who can attest to that.) However, I wouldn't be the nice guy that I am if I weren't going to at least explain some of the code.

There are two ways I handle this situation in the example I hosted, one is with a form, action, and post back. The other is with jquery and an asynchronous call. Both are actually pretty easy to pull off.

First let's look at the post back version. The mark up looks a little somethin' like dis:

  <form action="/Test/CheckForIds/" method="post">
    <div>
      <input type="checkbox" name="IdList" value="1"  />
      <input type="checkbox" name="IdList" value="2" />
      <input type="checkbox" name="IdList" value="3" />
      <input type="checkbox" name="IdList" value="4" />
    </div>
    <div>
      <input type="submit" value="go" />
    </div>
  </form>

Looks like your standard form and if you've used MVC at all, you should be used to seeing something like that. The only thing of interest is that the checkboxes don't have ids and do share the same name. There's a good reason for the second one. Here's the action method:

  [AcceptVerbs(HttpVerbs.Post)]
  public ActionResult CheckForIds(Int32[] idList)
  {
     return View(idList);
  }

Now it makes more sense, doesn't it? The name attribute on the checkbox directly corresponds to the name of the array parameter. THAT'S AMAZING!!!1 Actually, kidding aside it is kind of nice. Not only does it match the checkboxes to the parameter, it also treats the values of the checkboxes (Checked ones) as a list of integers. Pretty slick.

And honestly, that's about all it takes for traditional posting.

Now for the jQuery part:

  <div>
    <input type="checkbox" name="JqueryIdList" value="1"  />
    <input type="checkbox" name="JqueryIdList" value="2" />
    <input type="checkbox" name="JqueryIdList" value="3" />
    <input type="checkbox" name="JqueryIdList" value="4" />
  </div>
  <div onclick="getIds('JqueryIdList');">
    CLICK
  </div>

Wow, looks about the same. Go figure. Well that's pretty much because the way hard part is the javascript itself.

  function getIds(checkList)
  {
    var idList = new Array();
    var loopCounter = 0;
    //find all the checked checkboxes
    jQuery("input[name=" + checkList + "]:checked").each
    (
      function()
      {
        //fill the array with the values
        idList[loopCounter] = jQuery(this).val();
        loopCounter += 1;
      }
    );
    //Send the list off
    jQuery.getJSON("/Test/CheckForIdsJson/", { idList: idList }, idsGotten);
  }

Ok maybe it wasn't that hard or hard at all. But um... And here's the action method:

  [AcceptVerbs(HttpVerbs.Get)]
  public ActionResult CheckForIdsJson(Int32[] idList)
  {
    JsonResult result = new JsonResult();
    result.Data = idList;

    return result;
  }

So again, the same signature. Amazing huh?

Side note:

When I was eating this morning in front of the television (Chocolate shredded mini wheats if you must know.) I came upon the good ole classic Iron Eagle. I never really thought about how utterly f-ing insane that movie was until now though, mostly because I haven't seen it since I was a kid. I guess back then I could completely buy into the idea of some 17 year old, who can't make it into the Air Force Academy, suiting up and learning to use (At the time) the most complicated fighter the US had to offer within what? one whole montage, steal a 18 million dollar plane (Planes were cheap back then), fly into crazy dangerous territory, get past who knows how many trained professionals, save his dad, and nothing really comes of it. Actually I think if I remember (as I didn't get to watch the whole thing this time) he gets a place in the academy from this. IT'S A COMPLETELY BELIEVABLE STORY! The best part about it is that apparently between the time of the first and second movie his skills had depleted so fast that he gets popped at the beginning of the second one. I guess without the Saving Dad mojo, he's just not the same. Tip your glass to good ole Thumper.

I really miss the 80s where movies didn't really need to make any sense as long as they had some soundtrack filled with crazy obscure bands playing at random times in the movies itself followed by the movie characters commenting how great the music is.

• Child IFrame Page Interacting with Parent Page… Yeah I went there.
• Get the jQuery DatePicker to Work With jQuery Modal Dialog
• jQuery Modal Dialog : Hide That Stupid X Button / Windows Close Button
• jQuery – Check All Checkboxes Toggle Method Thingy
• jQuery Validation: Adding Errors to the Error Containter… With Love!

So here's the situation, it's late, you've got a strongly typed view that has a checkbox list, and you are desperate for an answer on how to handle it.... and now you're scraping the bottom of the barrel. Well, good news is, I have the answer.

Let's say you have a Book class that has a list of Categories. The Category class is simple, just has an id and name.

  public class Book
  {
    public Int32 BookId { get; set; }
    public IList<Category> Categories { get; set; }
  }

  public class Category
  {
    public Int32 Id { get; set; }
    public String Name { get; set; }
  }

Now you could try and figure out a way to create a typed view using the Book class. You could also stomp on your left foot until it bleeds. Who am I to judge you for liking pain? (Sick f---) For those who don't want to go through that nightmare, I have an alternative: Create two new classes, one to set the view and one to handle the post back.

public class ViewBookModel
{
  public ViewBookModel(Book book, IList<Categories> categoryList)
  {
    BookId = book.Id;
    CategoryList = categoryList;
  }

  public Int32 BookId { get; private set; }
  IList<Categories> CategoryList { get; set; }
}

First the class to set the view. As you can see, there is a book id that corresponds to a book object's id (DUH) and the category list which you will set in the original action.

  [AcceptVerbs(HttpVerbs.Get)]
  public ActionResult EditBook(Int32 bookId)
  {
     Book foundBook = Book.GetById(bookId);
     IList<Category> categoryList = Category.GetAll();
     ViewBookModel model = new ViewBookModel(foundBook, categoryList);
     return View(model);
  }

And then your markup for the checkbox list will be something like this:

  <%
    foreach(var category in Model.CategoryList)
    {
  %>
      <input type="checkbox" name="CategoryIds" value="<%= category.Id %>" />
  <%
    }
  %>

Notice that the name for every input is CategoryIds. This is because this will be the name of the collection of ids on the model for posting:

  public class ViewBookInModel
  {
    public String BookId { get; set; }
    public Int32[] CategoryIds { get; set; }
  }

And the action method would look like:

  [AcceptVerbs(HttpVerbs.Post)]
  public ActionResult UpdateBook(ViewBookInModel book)
  {
    foreach(Int32 id in book.CategoryIds)
    {
      ...
    }
  }

And boom, problem solved. You can now use a strongly typed View with a checkbox list. Go forth and be fruitful.

• No Related Posts

I've started to take the PhotoView site and move it toward a full blow site application. Not sure why, but then again why shouldn't I? Don't have a good reason? Pbbbbbbtttt jog off.

One thing I ran into yesterday while working on it, as I've added authentication to the site (An update I'll post sometime this week I think), is having a menu show or not show based on the user being logged in or and admin or whatever. What I don't like doing is having to call methods from the "framework" if I can just add a property to a model. There are various reasons why, ranging from the fact mark up errors don't blow up compile time to the idea that the model should take care of those things. Now you can't always follow this rule as it's obvious I use the CreateUrl method like it's a bat in a shed. (I have no idea what that means) However, a certain amount of lock down is nice and the Create method is an extension method so it doesn't look like I'm cheating... Am I right?

So here's the situation, I would like to have a model that has two properties UserIsLoggedIn and UserIsAdmin so I can do magic like:

  <%
    if(Model.UserIsAdmin)
    {
  %>
      <a href="Admin/DoStuff" > Admin Stuff </a>
  <%
    }
  %>

Now this would seem to be simple, you would think having the master page inherit from the generic version of ViewMastePage:

  Inherits="System.Web.Mvc.ViewMasterPage<SomeModelClass>"

And the class would be something like this:

  public class SomeModelClass()
  {
    public Boolean UserIsAdmin { get; set; }
    public Boolean UserIsLoggedIn { get; set; }
  }

And the flowers would bloom, the sun would shine, and dogs and cats would live in harmony. And it works that way up until you actually run any given page with a strongly typed view. Then you get this error:

Sorry bro, but you need a hella cool model that is all like "Hey mom" to SomeModelClass.

I think I'm paraphrasing a bit but the idea to take from this is that all view models will have to inherit from the same model the master page is using. Yeah, basically a bit "go f--- yourself" written into MVC. So either you follow this obviously easy and unhindering design choice or you do what all programmers must do at some point: Compromise. And I mean that in the real sense, not the in the relationship, better to bend than break even though you're already broken sort of way.

Remember that little bit of self comfort I gave myself for the HtmlHelper extension CreateUrl, well it's time to do that once again. So in a He's Just Not That In To You sort of way (Yes I saw that movie. That's the other version of compromise), I'm going to tell myself that it's ok and that though it may be bad for most situations, I've heard that Sally's friend in New York who is a programmer got away with it so I'll most like get away with it too.

  public static class ViewMasterPageExtension
  {
    public static String CurrentUrl(this ViewMasterPage page)
    {
      return SiteMethods.GetCurrentUrl();
    }

    public static Boolean UserIsAdmin(this ViewMasterPage page)
    {
      return State.CurrentUser != null && State.CurrentUser.UserType == PhotoViewUserType.GetAdminType();
    }

    public static Boolean UserIsLoggedIn(this ViewMasterPage page)
    {
      return State.CurrentUser != null;
    }
  }

Yes it's not on a model, yes it's a work around, but I'd rather do this:

  if(this.UserIsAdmin())

Than this:

  if(State.CurrentUser != null && State.CurrentUser.UserType == PhotoViewUserType.GetAdminType();)

And in the end, isn't what make my life easier the main goal of existence?

Is it me or does Sam Neil look beyond creepy in this imdb photo?

• No Related Posts

function showPicture(imageHolder, id)
{
  jQuery(imageHolder).attr("src", "/Photo/ShowPhoto/" + id);
}

And you can't forget to try:

<img id="holder" alt="" />
<div onclick="showPicture('#holder', '79');">Show!</div>

And with that your life will be far better than it was before. You can once again start enjoying the simple things in life. Enjoy the birds singing, the sun setting, and those noisy little things that run around your house.

Disclaimer: Id may vary. Image results also very. Though proven to be better when tested again a placebo, Jquepictuax may not improve your self esteem or make you more popular. Jquepictuax is not guaranteed to improve your life in any way. Use Jquepictuax in small quantities. People with low blood pressure or who are pregnant should avoid using Jquepictuax. If you consume more than 3 alcoholic drinks per day, please seek medical attention before use. May cause certain side effects such as dizziness, nausea, overwhelming chills, headaches, muscle soreness, dry mouth, light headedness, sleepiness, drop in appetite, and death. If you notice any these side effects, stop use of Jquepictuax immediately and seek medical attention. Please consult physician before Jquepictuax use.

You happiness is right around the corner, why not turn it with Jquepictuax?

• Child IFrame Page Interacting with Parent Page… Yeah I went there.
• Get the jQuery DatePicker to Work With jQuery Modal Dialog
• jQuery Modal Dialog : Hide That Stupid X Button / Windows Close Button
• jQuery – Check All Checkboxes Toggle Method Thingy
• jQuery Validation: Adding Errors to the Error Containter… With Love!

Saving the Image

First off, here's the look of the table:

So pretty simple table. Most important parts are the ImageData and ContentType. Why? Well let's look at the action needed to save the image:

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Upload(PhotoForSingleItem photo)
{
  //PhotoForSingleItem is just a class that has properties
  // Name and Alternate text.  I use strongly typed Views and Actions
  //  because I'm not a fan of using string to get the posted data from the
  //  FormCollection.  That just seems ugly and unreliable to me.

  //PhotoViewImage is just a Entityframework class that has
  // String Name, String AlternateText, Byte[] ActualImage,
  //  and String ContentType
  PhotoViewImage newImage = new PhotoViewImage();
  HttpPostedFileBase file = Request.Files["OriginalLocation"];
  newImage.Name = photo.Name;
  newImage.Alt = photo.AlternateText;

  //Here's where the ContentType column comes in handy.  By saving
  //  this to the database, it makes it infinitely easier to get it back
  //  later when trying to show the image.
  newImage.ContentType = file.ContentType;

  Int32 length = file.ContentLength;
  //This may seem odd, but the fun part is that if
  //  I didn't have a temp image to read into, I would
  //  get memory issues for some reason.  Something to do
  //  with reading straight into the object's ActualImage property.
  byte[] tempImage = new byte[length];
  file.InputStream.Read(tempImage, 0, length);
  newImage.ActualImage = tempImage ;

  newImage.Save();

  //This part is completely optional.  You could redirect on success
  // or handle errors ect.  Just wanted to keep this simple for the example.
  return View();
}

And here's the mark up to get this ball a rollin':

<form method="post" enctype="multipart/form-data" action="Photo/Upload">
  <div>
    <span>
     Name:
   </span>
   <span>
     <input type="text" id="Name" name="Name" />
   </span>
  </div>
  <div>
    <span>
      Alternate Text:
    </span>
    <span>
     <input type="text" id="AlternateText" name="AlternateText" />
    </span>
  </div>
  <div>
    <span>
      Image
    </span>
    <span>
      <input type="file" id="OriginalLocation" name="OriginalLocation" />
    </span>
  </div>
  <div>
    <input type="submit" value="Upload" />
  </div>
</form>

Biggest thing to notice in the markup is the enctype="multipart/form-data". This is a must to upload images. It was something I was missing originally and annoyed the hell out of me.

Showing the Image

So now that we have a we to upload the image, how the hell do you use it? Well that's not too hard. It just involves a new type of result, an action, and an img element.

So the first thing you need is an image result, and in using my superior intellect I came up with such a thing. And by superior intellect I mean I used StackOverflow. Oddly enough though, it's actually the second post that I got it from and I changed it a little. However, it was very useful.

using System.Web;
using System.Web.Mvc;
using System.IO;

public class ImageResult : ActionResult
{
  public String ContentType { get; set; }
  public byte[] ImageBytes { get; set; }
  public String SourceFilename { get; set; }

  //This is used for times where you have a physical location
  public ImageResult(String sourceFilename, String contentType)
  {
    SourceFilename = sourceFilename;
    ContentType = contentType;
  }

  //This is used for when you have the actual image in byte form
  //  which is more important for this post.
  public ImageResult(byte[] sourceStream, String contentType)
  {
    ImageBytes = sourceStream;
    ContentType = contentType;
  }

  public override void ExecuteResult(ControllerContext context)
  {
    var response = context.HttpContext.Response;
    response.Clear();
    response.Cache.SetCacheability(HttpCacheability.NoCache);
    response.ContentType = ContentType;

    //Check to see if this is done from bytes or physical location
    //  If you're really paranoid you could set a true/false flag in
    //  the constructor.
    if (ImageBytes != null)
    {
      var stream = new MemoryStream(ImageBytes);
      stream.WriteTo(response.OutputStream);
      stream.Dispose();
    }
    else
    {
      response.TransmitFile(SourceFilename);
    }
  }
}

And here's how you use the actual result.

[AcceptVerbs(HttpVerbs.Get)]
public ActionResult ShowPhoto(Int32 id)
{
  //This is my method for getting the image information
  // including the image byte array from the image column in
  // a database.
  PhotoViewImage image = PhotoViewImage.GetById(id);
  //As you can see the use is stupid simple.  Just get the image bytes and the
  //  saved content type.  See this is where the contentType comes in real handy.
  ImageResult result = new ImageResult(image.ActualImage, image.ContentType);

  return result;
}

And the markup would go a little sumthin' like dis:

  <img src="/Photo/ShowPhoto/1" alt="" />

And now you too can upload an image to a database, show it, and then decide just to physically host the images anyway. Next post will be about how to use this with jQuery and asynchronously. I bet you can't wait!

• jQuery Slide Menu… Another Cause I Can Experiment
• ASP.NET MVC: Attributes and Semi Dynamic Check for Request Parameters
• jQuery Slide and Pairing a Div’s Hover With a Div’s Slide
• Entity Framework: LINQ to Entities only supports casting Entity Data Model primitive types
• ASP.Net MVC, jQuery, JSon, and paging… how’s that for a SOE title?