My Adsense

Friday, November 11, 2011

Javascript Basics : Part 2 (Functions)


Suppose I want to change the button color when it is clicked. And to do this task, I don’t want to send the page to the server. So, what should I do?
Well, HTML DOM has given us some events to work with. We will use one the events, Click event and put some code on its event.
The below code will change the button color if clicked on that.


Now, if we want to add another button and apply same functionality with the click, the code will like below


But if you look closely, we are repeating the code. This is the worst smell of the code smells. So, we should create a method and call that method from the click event.

So, how do we create a function in Javascript? Its easy. As we did before, we must add the ‘script’ tag first. Inside of this tag, we will write the function. In javascript, we must write the word ‘function’ before the name of the function. For example:
function MyFunctionName() {
}

Then we will call that function from the event. So, if we refactor the above html code, we will get the below

    function ChangeColor() {
        document.bgColor = "#ffaaff";
    }

Total Code:



Please note that, we can write the functions anywhere in the page inside of html tag. But it is good practice to put the function inside of the head tag.
We can pass parameter in javascript functions. In our above example, we can pass the color code from the button tag to the function. The calling part should be like this:

onclick="ChangeColor('#ffaaff')"

The function definition will be:

    function ChangeColor(color) {
        document.bgColor = color;
    }

Total code:



We can also return from a javascript function. But unlike C# and other common languages, Javascript function don’t have any return type with its definition. We will just return the result at the end of the method.
Now, according to our above scenario, we can get our required color using another function instead of passing the color code from the button tag.

So, we will have two functions. One will check and return the color code and the other function will be called from the button tag.

function GetColor() {
        if (document.bgColor.toString() == "#ffaaff") {
            return "#ffffff";
        }
else if (document.bgColor.toString() == "#ffffff") {
            return "#ffaaff";
        }
        return "#ffffff";
    }

    function ChangeColor() {
        document.bgColor = GetColor();
    } 

Total code:


Quick Test 
 If we want to display square of a number, we will add script the calling part in the 'body' tag and return the square from a Javascript function. I hope you can do it. If you can't just let me know. 

I will try to post about the events in my next blog post. 

Wednesday, November 9, 2011

Javascript Basics : Part 1 (Hello world)

Now a days, the most basic thing a web application developer must know is Javascript. So, what is javascript? Yes..you probably know Javascript is nothing to do with Java. Javascript is totally different with Java. In syntax, in semantic, in usage, in all aspects. So, Javascript is a scripting language which runs in browser. The browser software executes the script line by line, from top to bottom, and display you the output.

Now what you can guess, Javascript must be embedded in a HTML file and when the HTML codes are rendered/executed, Javascript codes get executed with those. If you want to let your browser know that you are writing a Javascript code, you must add some extra tags/codes with the statements. For example:

What you can see, at the above code, by the ‘document.write’ method, we are writing some text in the browser. But we need to add the 'script' tag having the type as javascript with it.
If the browser executes this line of code, we can view ‘Javascript is very easy’  text on the browser.
So, the total html code should be

To do this by yourself, follow the below steps:

1. Open notepad
2. Copy and paste the above html code (with Javascript)
3. Save the file as ‘FirstPage.html’
4. Close the file
5. Double click on your just created ‘Firstpage.html’ file
6. You should see the below output







Ok. so we made something which is running. Its amazing when we get something running.
In next post, we will talk about the javascript functions.

Thursday, September 15, 2011

Can not load 'crdb_adoplus.dll' solved by useLegacyV2RuntimeActivationPolicy


In one of my current project, I am using visual studio 2010. I need to show report for some features. Well, everything was going smoothly before i installed my Windows 7 again in last week.
after installing visual studio 2010, I installed the crystal report executables provided by BusinessObjects .
then i ran my project and tried to open the report. But unfortunately it was showing the following error
"Could not load file or assembly 'file:///C:\Program files (x86)\Sap BusinessObjects\Crystal Reports For .Net Framework 4.0\Commom\Sap BusinessObjects Enterprise XI4.0\win32_x86\dotnet1\crdb_adoplus.dll' or one of its dependencies. The system cannot find the file specified."
In enlarged mode:



I have searched and found a solution. I just needed to put the useLegacyV2RuntimeActivationPolicy="true" into the          tag under tag. 


And guess what? The report is not displaying like below:


I am not sure why it is happening. I will write another blog post about it. Keep in touch. :)

Monday, July 25, 2011

How to change the Database Connection of LINQ to SQL Class

Introduction

Its very common that couple of developers are working on a single project. Me and one of my friend are also working on a .NET project. We are using LINQ to SQL class to query on the database. This is a desktop Windows Form project and we are maintaining our code as dumbest way possible. That is, when i update on any part, i just mail him the file and he replaces the file. So far so good.

Problem statement

But when I sent him my project, he couldn't run the database queries. Because the connection string embed on the DataContext.dbml class was not changed. He couldn't find a good way to change the connection string value. So I was searching for a better solution, and at last I found it today.

Solution

1. Double click on the DBML file of your project.

 

2. Now right click on the work area of the DBML file (Start sign in the image)

3. Expand the connection property and check the Data Source value. in my case, it is 'Magicbox' since it is my machine's server name

4. If your server is not in mentioned, it means, you need to create another connection between your server and the DBML file. So, click on the 'New; displayed in the image

5. Put your server name or click on the combo box (the arrow sign)

6. If your server name is not displayed after clicking on the combo, please write the name by your own ( my server's name is not showing also)

7. Now click the database name combo box at the bottom side of the window. You will see the database names attached with your server

8. Select the database and click 'Test Connection' button. you will get a success message is connection succeed. Now close the success message and press OK button at the bottom of the page

9. Now if you click the connection combo again, you should see the just added database connection as the item of the combo
Conclusion:
We now just change the database connection value from the properties of the DBML file and working fine.

Saturday, July 9, 2011

HTML Document Object Model


What is it?
The HTML DOM defines a standard way for accessing and manipulating HTML documents. The DOM presents an HTML document as a tree-structure.
In the DOM, everything in an HTML document is a node.
The DOM says:
  • The entire document is a document node
  • Every HTML element is an element node
  • The text in the HTML elements are text nodes
  • Every HTML attribute is an attribute node
  • Comments are comment nodes
Example Node tree:
From the HTML above:
  • The < html > node has no parent node; it is the root node
  • The parent node of the < head > and < body > nodes is the < html > node
  • The parent node of the "Hello world!" text node is the < p > node
and:
  • The < html > node has two child nodes; < head > and < body >
  • The < head > node has one child node; the < title > node
  • The < title > node also has one child node; the text node "DOM Tutorial"
  • The < h1 > and < p > nodes are siblings, and both child nodes of  < body >
It has some properties and methods as well.
Some DOM properties:
  • x.innerHTML - the text value of x
  • x.nodeName - the name of x
  • x.nodeValue - the value of x
  • x.parentNode - the parent node of x
  • x.childNodes - the child nodes of x
  • x.attributes - the attributes nodes of x
Note: In the list above, x is a node object (HTML element).
Some DOM methods:
  • x.getElementById(id) - get the element with a specified id
  • x.getElementsByTagName(name) - get all elements with a specified tag name
  • x.appendChild(node) - insert a child node to x
  • x.removeChild(node) - remove a child node from x
Note: In the list above, x is a node object (HTML element).
Example:
DOM Methods details:
getElementById(parameter): gets the element which has the id equals to the parameter
getElementsByTagName(parameter): gets the element which is the html tag equals to the parameter
Working with DOM code snippets:
document.body.bgColor="lavender"; //changes the document's background color
document.getElementById("p1").innerHTML="New text!"; // replaces the text of all p1 id element with "New text"
< input type="button" onmouseover="document.body.bgColor='green'" onclick="document.body.bgColor='lavender';" value="Change background color" / >
.style : this property indicates you can also work with the element's style values
Events:
Examples of events:
  • A mouse click
  • A web page or an image loading
  • Mousing over a hot spot on the web page
  • Selecting an input box in an HTML form
  • Submitting an HTML form
  • A keystroke
Example: < input type="text" id="email" onchange="checkEmail()" / >
For more: visit W3Schools

Wednesday, March 2, 2011

ASP.NET MVC Custom Routing Problem (Solved by Areas)


ASP.NET MVC 3 has a built in feature for sub folders. That is called Areas (thanks @Morten for let me know the word).
But after finishing the MSDN Walkthrough for Areas, I was still unable to run the web application. The error was showing Configuration errors.
Then I searched and found that, the Web.config files in the sub folders shouldn't contain application specific properties.
So, I removed those properties from the Web.config files. Then I was able to run. But there were some runtime errors when I wanted to navigate to my sub folder/area views. The error was "Could not load type ‘System.Web.Mvc.ViewPage<..<>’" when I click on the links for the views of the Areas folder. 
Then I again searched and found helpful this post. And then my application successfully run and I can navigate all of the pages.