RSS

RSS or Really Simple Syndication is a format used to organise content which can then be published or sent to different data consumers. For simplicity we will assume our content to be an article. When converting our article into RSS 2.0 format (which is what we will focus on) we have to create an XML file (XML version 1.0) and add certain elements to it. Once this is done, our document is ready.

There are two main components of an RSS file, the channel and item. To understand these components we have to consider an example of a newspaper. It has several articles, some grouped under the sports section, some grouped under finance section and so on.

The RSS feed which publishes these news articles will have a channel named sports and each sport article will be an item under this channel and we will have a similar channel for finance and all other sections.

With this scenario in mind, lets create our very own RSS feed to publish articles. In the example below we will be publishing two articles under the sports section and one under finance by a magazine called Magazine100. This is how our overall RSS feed would look like:

<rss version="2.0">

<channel>                         

<title>Sports</title>

<link>http://www.magazine100.com/sports</link>

<description>Sports news by magazine100</description>

<item>                

<title>cricket updates</title>

<description>Here you can paste the entire article</description>                           

</item>

<item>                

<title>football updates</title>

<description>Here you can paste the entire article</description>                           

</item>              

</channel>

<channel>         

<title>Finance</title>

<link>http://www.magazine100.com/finance</link>

<description>Finance news by magazine100</description>

               

<item>                

<title>wall street updates</title>

<description>Here you can paste the entire article</description>                           

</item>

</channel>

</rss>

As you can see at the top level we have <rss version="2.0">. This is a mandatory attribute that specifies the version that this document conforms to.

We then have a channel which is described by the tags <title>, <link> and <description>. These tags are mandatory for each channel, however if we feel the need to describe our channel further, there are several additional tags that we can use. You can get a list of these tags from here.

After channel, we have an item tag which uses <title> and <description> to publish the content of an article. For an item, it is mandatory to have at least one of these two fields (title and description), and similar to a channel, an item can also be further described using optional tags. You can get a list of these tags from here.

The problem with an item is that you do not have a tag to attach pictures. However this can be done if we use the following html within the content of the "description" tag:

<img src="[location of image]" alt="[alternate text]" title="[title of image]" />.

This code will place the image within the content of our article and solve our biggest headache (at least for me it was).

CSS for beginners

If we want to style any control in an html page (by control I mean textboxes, labels and all other html elements that can be displayed in an html page), we can easily do it using the style property. For example if we have the following heading:

<h2> Heading </h2>

And we wish to change its colour to green and make it italic, we can easily do so using the style property as shown below:

<h2 style="color: green; font-style: italic;"> Heading </h2>

Similarly, we can use a range of properties to stylize any control we want. However, this is not a very good programming practise. If we want to stylise our controls in a way that makes our styles more re-useable, we need to do it in the following way:

On top of the page we need to write the following code to make a style class with any name we want (in this example I have used the name MyHeading).

<style>

        .MyHeading

        {

            color: Green;  

            font-style: italic;

        }

</style>

Then in our html we can write the following code:

<h2 class="MyHeading"> Heading </h2>

With this code we will be achieving exactly the same result as above with the added benefit of code re-use in other places such as:

<p class="Myheading">This is a paragraph</p>

In this approach, we are using a style class to style our page. This can be a good approach to style a page; however we can go one step further by using a cascading style sheet.

Cascading style sheets (or CSS) allow us to create a “.css” file containing many style classes. This css file can then be attached with any webpage giving it access to all its style classes.

 To attach a css file to an html page, we need to write the following line on top of the webpage (above its html code):

<link rel="Stylesheet" type="text/css" href="/Location/File.css" />

In the css file, we need to write the following code to create a style class:

.MyHeading

{

      color: Green;  

      font-style: italic;

}

After this, we can use any class from the css file to style the controls of our page. The benefit of using this approach is that css files allow us to use the same style sheet throughout our website, and ensure a consistent layout across all pages, thus allowing maximum code re-use.

Returning XML from MVC Controller Action

To return xml from a mvc controller action we can use the following code:

public XmlElement name_of_function()
{
      XmlDocument Feed = new XmlDocument();
      XmlWriter Write = Feed.CreateNavigator().AppendChild();

      Write.WriteStartDocument();
      Write.WriteStartElement("head");
      Write.WriteElementString("name_of_tag", "value");
      Write.WriteEndElement();
      Write.WriteEndDocument();

      Write.Flush();
      Write.Close()

      return Feed.DocumentElement;
}

Using ASP.NET Webform in an MVC controller

In ASP.NET MVC we use controller actions to call views using the following code:

public ActionResult NameOfView()
{
return View();
}

or if we want to pass a view model to it:

public ActionResult NameOfView(model ViewModel)
{
return View(ViewModel);
}

Through this code, the view "NameOfView", placed in the folder "Views", will be displayed (in the second instance the view model will be passed to it as an input parameter).
However if we want to work with an ASP.NET view which is NOT in the folder "Views" but is instead located at "Abc/Def/page.aspx", we can change our controller slightly to accommodate this view. To do this, we can use the following code:

public ActionResult NameOfView()
{
return View("~Abc/Def/page.aspx");
}

or if we want to pass a view model to it:

public ActionResult NameOfView(model ViewModel)
{
return View("~Abc/Def/page.aspx", ViewModel);
}

Adding jQuery to an MVC view

To add jQuery code in an MVC view, we need to write its code in the head section of the view. The example below shows simple jQuery code written in an MVC view.

<head>

<script type="text/javascript">

$(document).ready(function ()

{

// here we can write any javascript code that will be executed as soon as the page loads  

// If we have a dropdown in our page, named as "xyz", and need to write code that executes when it's value is changed to "1", we could do the following:

$('#xyz').change(function ()

{

if ($('#xyz').val() == "1")

{

// over here we can write code that will execute when the value "1" is selected in the dropdown "xyz"

}

else if ($('#xyz').val() == "2")

{

// over here we can write code that will execute when the value "2" is selected in the dropdown "xyz"                

}

});

});

</script>

 <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>

<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

</head>

MVC Multiple Post buttons in one page

Anyone who has worked in MVC knows how clicking a post button will submit the page, and invoke the action method. It can get a bit annoying if you want to do different things based on different buttons being clicked. However, thanks to html there is a way around it.


To do this, we have to figure out which button was clicked. This can be done in the following way:

Make two buttons with the same “name” but different “value”

e.g

<input type="submit" id="GetResults" name="SubmitButton" value="Apply" />

<input type="submit" id="UpdateResults" name="SubmitButton" value="Inform" />

In the controller action, add the following input parameter (string SubmitButton)

Inside the controller action, the value of the variable “SubmitButton” will either be “Apply” or “Inform” depending upon which submit button was clicked.

After this, a simple “if” condition such as the one given below will do the job:

If(SubmitButton == "Apply")

{

                Do this

}

Else if (SubmitButton == "Inform")

{

                Do that

}

Typical problems with WatiN

In my last post I discussed about creating a Hello World application in WatiN. In this post I will focus on typical problems that can entail the usage of WatiN.

WatiN Not Executing

If your application gives a strange error message and does not execute, go to references and see if you have the reference "Interop.SHDocVw" added. If it is added, then it is no co-incidence that your code is not running, delete it and try again, it should work now.

If you are using a 64-bit machine with .NET Framework 4, you have to change the properties of your project in order to make your application work. As discussed in this blog (from step 7 onwards), you need to go to the properties of your project (by right clicking on your project in solution explorer) and under the text "target framework", change the value of dropdown to ".NET Framework 4". Recompile and it should work now.

Working with Firefox instead of Internet Explorer

Just like you use the code "IE browser = new IE()", you could also use "Firefox browser = new Firefox()" and start working with Firefox rather than Internet Explorer. However, this will come with its own share of problems.

To the best of my knowledge, to date WatiN is incompatible with Firefox 4, so you need to revert to Firefox 3.6 (or any other version of Firefox 3) in order to let WatiN work successfully with Firefox.

Sometimes the problems do not end here, and you get a JSSH error. There is nothing alarming about this error, and if you get it, all you need to do is download JSSH Firefox extension, which could also be downloaded manually from here, and your problem will end.

If your problems do not end here, feel free to inform me of your problems in the comment box below.

Advice for WatiN-Firefox users

As an alternate to Internet Explorer's development tools, Firefox has an add-on called Firebug, which is very easy to use and extremely powerful. While using it you just need to right click on any part of the webpage and click on Firebug to get all the information you need.