Introduction and Problem

Converting Data Formats back and forth between browser and back end servers can be a little confusing.  In my case, I have a simple Sencha ExtJS 4.0 form that the user types a date into.  That date gets passed through an ajax request to the Microsoft asp.net controller, then that dates updates the SqlServer Database.  When the Date is displayed on a Grid Panel, again, an ajax request is made that grabs the date from the controller, then formats it using the MS dateFormat from ExtJS and hopefully, the same date the user typed in gets re-displayed.

So, let’s look at the details.

Posting the Date To the Server (View From JavaScript)

First, we need to define an ExtJS Model that has the date in it.  That codes looks like this in my case.

Ext.define('EvMgr.model.SponsorListJobListing', {    extend: 'Ext.data.Model',    fields: [        'Id',        'SponsorListId',        'JobName',        'JobLocation',        'JobURL',        'JobBrief',        'JobTagline',        'JobButtonToolTip',        { name: 'EnteredDate', type: 'date', dateFormat: 'MS' },        'JobCompanyName',        { name: 'StartRunDate', type: 'date', dateFormat: 'MS' },        { name: 'EndRunDate', type: 'date', dateFormat: 'MS' },        { name: 'HideListing', type: 'boolean' },        'Notes'    ],    idProperty: 'Id',

    proxy: {        type: 'ajax',        api: {            read: 'SponsorListJobListing/Get',            update: 'SponsorListJobListing/Update',            create: 'SponsorListJobListing/Create',            destroy: 'SponsorListJobListing/Delete'        },        reader: {            type: 'json',            root: 'Data',            successProperty: 'success'        }    },

    belongsTo: 'EvMgr.model.SponsorList'});

Notice the StartRunDate field has dateFormat of ‘MS”.

Now, we have an ExtJS Window that we use to collect the data from the user.  The code is as follows:

Ext.define('EvMgr.view.sponsorlist.ListJobListingsEdit', {    extend: 'Ext.window.Window',    alias: 'widget.sponsorlistjoblistingsedit',    title: 'Edit Job Listing',    layout: 'fit',    width: 1000,    autoShow: true,

    initComponent: function() {

        this.items = [            {                xtype: 'form',

                items: [                    {                        xtype: 'textfield',                        name: 'JobName',                        fieldLabel: 'JobName',                        width: 850                    },                    {                        xtype: 'textfield',                        name: 'JobLocation',                        fieldLabel: 'JobLocation',                        width: 850                    },                     {                         xtype: 'textfield',                         name: 'JobURL',                         fieldLabel: 'JobURL',                         width: 850                     },                     {                         xtype: 'textfield',                         name: 'JobBrief',                         fieldLabel: 'JobBrief',                         width: 850                     }, {                         xtype: 'textfield',                         name: 'JobTagline',                         fieldLabel: 'JobTagline',                         width: 850                     },                     {                         xtype: 'textfield',                         name: 'JobButtonToolTip',                         fieldLabel: 'JobButtonToolTip',                         width: 850                     },                     {                         xtype: 'textfield',                         name: 'JobCompanyName',                         fieldLabel: 'JobCompanyName',                         width: 850                     },                     {                         xtype: 'textfield',  // checkbox makesthe value not come back for some reason                         name: 'HideListing',                         fieldLabel: 'HideListing',                         width: 850                     },                     {                         xtype: 'datefield',                         name: 'StartRunDate',                         fieldLabel: 'StartRunDate',                         width: 850                     },                     {                         xtype: 'datefield',                         name: 'EndRunDate',                         fieldLabel: 'EndRunDate',                         width: 850                     },                    {                        xtype: 'textfield',                        name: 'SponsorListId',                        fieldLabel: 'SponsorListId',                        width: 850                    }                ]            }        ];

        this.buttons = [            {                text: 'Save',                action: 'save'            }, {                text: 'Cancel',                scope: this,                handler: this.close            }        ];

        this.callParent(arguments);    }});

Posting the Date To the Server (View From ASP.NET)

I’m over simplifying a little because it’s calculating UTC based on the Servers time zone, not the browsers.  It would be better to send the timezone of the browser also and then calculate UTC correctly in JavaScript, but I just want to give you the idea here.  In my case, I’m always running this app from California and my server is always inCalifornia so at least things stay consistent.  I do realize I’m simplifying and you need to make sure you think this through.

Now, when I query the server for the returned data using the same ExtJS data model, the data comes down as follows.  In ASP.NET it looks like this:

Which is actually different than what was pushed up.  It seems though that when ExtJS displays this, it converts it to local time.

Our browser Grid shows it like this (as we would expect)

Hope this helps!

So, how does the up to date work?  the way it works is when you get the latest from your version control, you simply right click on the vs2008 project and say “Deploy”.

It’s kind of a hassle though because you have to open the project first, the don this.

Here is a simple one line cmd file that you can use to do this task for you.

C:\Windows\Microsoft.NET\Framework\v3.5\MSBuild.exe /t:Deploy
  /p:Configuration="Debug";Platform="Any CPU" /v:normal /m
  "data\ThreePLogicDatabase\ThreePLogicDatabase.dbproj"
pause

That’s it!  hope this helps.

Step 1: Read the walk through ( http://learn.iis.net/page.aspx/523/web-platform-installer-walkthrough/ )

Step 2:  Click Install now  (Can’t find PHP, starting searching the web now)  {Note: 4/14/2009. Turns out I missed an easy step.  See bottom of article for that step}

Found this link:  Install PHP with Microsoft Web Platform Installer 2.0

Step 3: Go Here and try again:  http://php.iis.net/

Well, I still don’t see php on the web server choice, but I do see WordPress so I chose to install WordPress and said go.  Let’s see what happens now.

It’s saying downloading PHP and also MySQL so maybe this is good.  Patiently waiting…

It’s now asking me for WordPress Setup…

And now for the MySql user (pretty impressive)

And, Installing WordPress…

Oops, failed.  Hmm, wasn’t really intereted in wordpress anyhow, just wanted php.

Sounds like it did not like my credentials to MySql.  I thought I di follow all the directions.  I’ll paste the error here:

providerName: createApp
    path: MSDeploy.iisApp/iisApp[@path='wordpress/WPTest']/createApp[@path='wordpress/WPTest']
[9:42:493]Adding dbMySql (Server=localhost;Database=wordpress;uid=pkellner;Pwd=mypass;)
    Details:
    operationType: Add
    providerName: dbMySql
    path: Server=localhost;Database=wordpress;uid=pkellner;Pwd=peterk;
[9:42:498]The database ‘wordpress’ could not be created..  Retrying operation ‘Add’ on object dbMySql (Server=localhost;Database=wordpress;uid=pkellner;Pwd=mypass;).  Attempt 1 of 5.
    Details:
    originalMessage: The database ‘wordpress’ could not be created.
    operationType: Add
    retryAttempt: 1
    retryCount: 5

It does say php installed though successfully and that was my goal.

So, let’s see what is in IIS manager (inetmgr) so, I run inetmgr from a command prompt.

Well, interesting, I see some new stuff including Web Platform Installer at the bottom.  I don’t see anything about php, but I do see a WordPress directory so there is some hope php worked.  Here is what I see.

Let’s go into the WordPress base directory and add the only php I know:

Info.php as follows:

<html>
<head>
<title> PHP Test Script </title>
</head>
<body>
<?php
phpinfo( );
?>
</body>
</html> 

And, Run it:

Woohoo!  It worked!!!!!

Mission Accomplished in about 10 minutes.  Not a perfect experience, but pretty darn good.  BTW, I’m running 64Bit Vista RTM SP1, 4Gig of Ram on a Lenovo W500.

Hope this helps.

{Added 4/14/2009, this is the step I missed to do it correctly}

And then select the PHP checkbox:

Microsoft Visual Studio 2010 Premium with MSDN Download – Download Direct from Microsoft

I’ll first try and explain in a nutshell what it is.  Then I’ll go through an example of creating a Visual Studio Database Project out of a site I’ve been working on to show the steps.  Finally, I’ll give a short summary reliving the experience and giving you some other pointers that may help you get through the experience.

What is VS2008 Database Edition?

Basically, what VS2008 does is to first process your existing schema into hundreds (maybe thousands) of little files.  That is, each file is one database thing. That thing might be a table definition, a stored procedure, a trigger, a constraint, a foreign key, etc.  The beauty of this is that now, each thing can be tracked separately.  Say for example, you want to update just one table and someone else on your team wants to update another table in the same schema.  Since the files are now separate files, it’s no problem.  When you grab the latest changes from source control, you will get your friends changes and he will get yours.  Very very clean!

Also, it has a very powerful comparison engine.  Say you update your data outside of this project.  VS2008 Database Edition will compare your definitions in all these little files with either a sql script you generate, or it will connect to an external database and compare to that.  Me personally, I like to use a tool called SqlManager to manage my data.  I can continue to do that, then when I’ve made my changes, I can simply connect VS2008 Database Edition to my updated development database and it will automatically figure out the changes.

So, you may ask, what version do I need to run this of Visual Studio?  The answer is in this link:  http://msdn.microsoft.com/en-us/vs2008/products/cc149003.aspx

Here We Go, Let’s do an Example

So, first, I will open my existing solution which has a web project in it, a data access project as well as other projects.  Then, I create the new Database solution by saying File/Open/New Project/Database Project.

Then, we follow the wizard…

Taking defaults…

Now, I choose my schema.

Press Start…

Once you’ve done that, you’ll now have your schema spread out across your project in little files.  Below is what the "file based" view of your schema looks like.

Notice that the file we are looking at also includes comments for both the table and the columns using the standard extended property documentation format as follows:

GO
EXECUTE sp_addextendedproperty @name = N'MS_Description',
@value = N'tracks all changes from each camp

title;link;guid;pubDate;category;description', @level0type = N'SCHEMA',
@level0name = N'dbo', @level1type = N'TABLE',
@level1name = N'CampFeed';

GO
EXECUTE sp_addextendedproperty @name = N'MS_Description',
@value = N'if true, this is the main news feed from the site.
there should only be one main news feed from any site.  this would
not be feeds like twitter', @level0type = N'SCHEMA',
@level0name = N'dbo',
@level1type = N'TABLE', @level1name = N'CampFeed',
@level2type = N'COLUMN', @level2name = N'PrimaryFeed';

Now, when you actually build the project as follows:

it will generate the full script combining all the files back into one again. Here is where it puts it:

So, that’s about it for now. I haven’t gone into any of the ways to compare and update your schema based on external changes, but we can leave that for another post.

To see a great video by Richard Hundhausen, President of Accentient, a Team Systems Consulting company, go to this link:  http://msdn.microsoft.com/en-us/vsts2008/cc659682.aspx

Also, if you are using Sql Server 2008, make sure you install visual studio 2008 sp1, then go to this link and install the download:  http://www.microsoft.com/downloads/details.aspx?FamilyID=bb3ad767-5f69-4db9-b1c9-8f55759846ed&displaylang=en

Conclusions

From what I can tell, this Visual Studio Database Edition will be a huge help in building database schema’s and database programs (sp’s, triggers,etc.) in a collaborative environment.   If you have the license to use this, I strongly recommend it.  It is definitely going to be part of my tool kit for now on.  Even if I’m the only author in the project.