Thursday, April 17, 2008

Creating your first Umbraco User Control - PART 2

In the previous article of this series we learnt how to create a user control in visual studio, upload it to our Umbraco site and then how to display it on our site.

In part 2 we are going to learn how to pass variables from Umbraco back to our User Control.

If you followed part one then great we are going to use the same source code and modify the bits we need to.

Because the New Zealand econonmy has turned to crap and the government is constantly changing the GST rate we'd like to update the GST rate in Umbraco and not in our source code.

1. Open your Umbraco user control in Visual Studio.

2. Last time we had some code like such

double GST = 1.125;
double Result;
Result = double.Parse(txtAmount.Text) * GST;
lblResult.Text = Result.ToString("0.00");

This time want to replace this line (double GST = 1.125;) with a dynamic value from Umbraco.

We need create a variable to hold the GST amount eg
private Double gstRate;

3. Next create a public property so we can access it from Umbraco and assign it to the variable we created above. eg

public Double _gstRate
get { return gstRate; }
set { gstRate = value; }

4. Replace double GST = 1.125; with so:

Double mutipler;
mutipler = gstRate / 100 + 1;
Double Result;
Result = double.Parse(txtAmount.Text) * mutipler;
lblResult.Text = Result.ToString("0.00");

5. Build the soluion and upload to to your Umbraco Bin directory and move to the Umbraco control panel.

6. Go to your developer --> macros and select the Macro you created last time or if you want you can create a new macro.

7. Select the "browse properties" button

8. The public properties in you usercontrol should be displayed in this page

9. Click the parameter tab at the top of the screen and make sure the type selected is text.

10. Save your macro and return to the content page where you are going to place GST Calculator.

11. Insert the macro and you should see the option to input your GST rate.

12. Publish your page and you should be away laughing

13. To edit the rate you can either delete the macro within the page and reinsert it or view the HTML using the html button on the rich text editor and changing the rate manually in their.

Hope you enjoyed this little tutorial - please make any suggestions of tutortial you would like to see! The GST calculator is running live my umbraco site here

You can download a copy of the Visual Studio 2005 version here


Cosimo said...

Can you explain to passing values to .net user controls from umbraco and return? Can you give a little project to download??
Thank in advance.


Skiltz said...

That is what the code above does already. Can you define an example and I'll send you a sample project.


Ebben said...

Im trying to access properties (and their values) in Umbraco from a .ascx. Can you point me into the right direction on doind that?

Skiltz said...

Please send me an email and I'll give you some help. Thanks Matthew

Darren said...

Thank you

Very helpful posting.

Thought it might help by posting the VB code for non c# people.

Protected Sub btnSubmit_Click(ByVal sender As Object, ByVal e As EventArgs) Handles btnSubmit.Click
Dim Multiplier As Double

Multiplier = gstRate / 100 + 1

Dim Result As Double

Result = Double.Parse(txtAmount.Text) * Multiplier
lblResult.Text = Result.ToString("0.00")
End Sub

Private rate As Double
Public Property gstRate() As Double
Return rate
End Get

Set(ByVal value As Double)
rate = value
End Set

End Property