aspx Tutorial

NET Articles,jQuery demo, with jQuery, online tutorial,Jquery, SilverLight, Javascript,,JSON, MVC,.NET Articles,demo, Web Services,
Advertise Here


Get our toolbar!


by Aamir Hasan   on Monday, August 16, 2010
Be default Webservices are disabled. To enable the webservices you need add the follwoing settings in the web.Config file as given below.if you invoke the web services from remote server and you have not add the settings in web.config as given below then you get the following message "The test form is only available for requests from the local machine".         <webServices>            <protocols>                <add name="HttpGet"/>                <add name="HttpPost"/>                <add name="HttpPostLocalhost"/>             </protocols>        </webServices>    
by Aamir Hasan   on Sunday, August 15, 2010
Here,i have  handle some problem coming to developers when they try to bind server side values to Textbox on client side. So i decide to solve this problem for those developers who have some week points.Let starts. Create a Person Class which have two members, which will set and get Firstname and Lastname as shown in below Figure 1.1. Figure 1.1   On aspx page drag and drop two TextBox's as shown in below Figure 1.2 Figure 1.2 Add jQuery reference under the Head tag as shown in below Figure 1.3. you can also include latest online jQuery reference. Figure 1.3 You can Override the LastName of Person class as shown in below Figure 1.4. Just for understanding who are on beginner level.   Figure 1.4 Display screen shows out in Internet Explorer as you see in Figure 1.5 Figure 1.5 Display screen shows out in Internet Explorer as you see in Figure 1.6 Figure 1.6 Demo Demo 1 Demo 2 Download Pass values to jquery and set to textbox
by Aamir Hasan   on Monday, August 2, 2010
Microsoft has released a new tool named WebMatrix. It is very easy to use and requires a little programming expertise. The tool is aimed at facilitating those who have little or no programming experience. You can easily create, edit and manage web sites using WebMatrix. You can also manage databases and generate SEO Reports for your websites. You do not need to install Visual Studio on your computer to work with WebMatrix. Let's get started with the first tutorial on WebMatrix. Launch WebMatrix by clicking the shortcut on your system. Three options are displayed. Site from web gallery Site from template Site from folder In this tutorial we will be demonstrating how to work with Site From Template option. Select Site From Template Option by clicking it as shown in figure 1.1.   Figure 1.1 Five templates are displayed, Select Photo Gallery Template and press OK button to continue as shown in figure 1.2 Figure 1.2 WebMatrix will generate a template as shown in figure 1.3 below Figure 1.3 Now you can see a Photo Galley Site is generated as shown in figure 1.4 below Figure 1.4 Now open Index.cshtml file from Gallery Folder. In this file a connection to Photo Gallery Database is established. This is illustrated in the figure 1.5 below Figure 1.5 Now click on the Database tag. You will see Photo Gallery Database. Here you can create new tables and edit them. This is shown in the figure 1.6 below Figure 1.6 There is a built-in SEO toolkit to keep record of errors in your site. Just click the Reports tag and WebMatrix will display a report. This is illustrated in the figure 1.7 below Figure 1.7 Save and check the output in your Browser as shown in Figure 1.8 Figure 1.8 Download You can download WebMatrix Tool from Microsoft site.
by Aamir Hasan   on Sunday, August 1, 2010
Microsoft announce ASP.NET 4 and Visual Studio 2010 few days ago. It includes new feature and improvements. It includes: ASP.NET 4 ASP.NET MVC 2 Visul Web Developer 2010 Express .Net Framework 4 Download ASP.NET 4 and Visual Studio 2010 Released For more information visit
by Aamir Hasan   on Tuesday, July 27, 2010
how to optimize the web page, Loading fast page make the client experince. More
by Aamir Hasan   on Tuesday, July 27, 2010
In this tutorial i am going to create a simple Window Form In Visual Studio 2010 using csharp that will Add two number and display it.This tutorial will help those developer who have not worked in Visual studio 2010 and who are going to write there first form using csharp language. To create a new project, open you Visual Studio 2010. on the File Menu click on New Project. New Project Window will be display on your screen. Expand Visual C#, select Windows and select Windows Forms Application,Click on Ok button  as shown in Figure 1.1 Figure 1.1 Form1 will be display on your screen when you create a Windows Forms Application as shown in Figure 1.2 Figure 1.2 Drap Two TextBox's, three Label's and one Button as shown in Figure 1.3 Figure 1.3 To display the results, Doube click on Button1 as shown in Figure 1.4 Figure 1.4 Declare variables number1 and number2 and get textbox1 and  textbox2 text and pass it to number1 and number2.Add two number1, number2 values and pass it to answer variable and pass to label3 as shown in Figure 1.5 Figure 1.5 Press F5 to display the Form1 on the screen as shown in Figure 1.6 Figure 1.6   Enter 5 interger in textbox1 and textbox2. Click on Submit button 10 value will be return in Label1 as shown in Figure 1.7 Figure 1.7   Download (39.91 kb)
by Aamir Hasan   on Tuesday, July 13, 2010
In this Article, I will demonstrate how to Disable/Enable button in use jQuery. To avoid multiple clicks on submit button, we simply disable the submit button during the process. More
by Aamir Hasan   on Monday, July 12, 2010
Many times question asked from me about Horizontal Menu, So i decided to write an article, how to display ASP.NET Horizontal Navigation Menu using Sitemap,apply Skin and StyleSheet on it. Overview Introduction SiteMap Menu Control SiteMapDataSource control Web.Config file Theme and Skin Cascading Style Sheet IE 8 rendering Issue Add the IE7 Meta Menu rendering issue in Google Chrome, Safari and Opera Configure Multiple Site Maps Browser Tested Download Demo   Introduction ASP.NET menu control have display two mode Static and Dynamic. static or dynamic view using Sitemap with Data Source control. Open your Visual Studio 2008 and create a ASP.NET WebSite, as shown in figure 1 Figure 1 SiteMap Sitemap File is in XML format that is named Web.sitemap.  Site map file must contain <siteMap> tag surrounding the content. Each <siteMap> tag have only <stieMapNode> child tag. Each siteMapNode have several child nodes Each section siteMapNode has URL, title, description,value, tooltip attributes.Let us now create a Site Map file. Right click web site menu and select the Add New Item from menu option. Select the Site Map file from Viusal Studio Installed Template window and click Add button to continou.You will see, Visual Studio automatically genarate intial code as shown in Listing 1,remove it and copy code from below Listing 1 and paste this code into your Site Map File (Web.SiteMap) you created. Listing 1 <?xml version="1.0" encoding="utf-8" ?><siteMap>  <siteMapNode title="Home" value="Home" tooltip="Home" url="~/welcome.aspx" param="1">    <siteMapNode  title="Menu 1" value="Planner" tooltip="Menu 1" url="" param="id" >      <siteMapNode title="Sub Menu 1" value="cAdd" tooltip="Sub Menu3 1"    url="~/SubMenu1.aspx"/>      <siteMapNode title="Sub Menu 2" value="brv" tooltip="Sub Menu3 2"    url="~/SubMenu2.aspx"/>      <siteMapNode title="Sub Menu 3" value="bpv" tooltip="Sub Menu3 3"    url="~/SubMenu3.aspx"/>      <siteMapNode title="Menu 2" value="Patient-Update" tooltip="Update the Patient"   url="~/Menu2.aspx"/>    </siteMapNode>    <siteMapNode  title=" Menu 3" value="Billing" tooltip="Private Patient Billing" >      <siteMapNode title=" Sub Menu3 1 " value="Sub Menu3 1" tooltip="Sub Menu3 1" url="~/SubMenu31.aspx" />      <siteMapNode title=" Sub Menu3 2 " value="Sub Menu3 2" tooltip="Sub Menu3 2" url="~/SubMenu32.aspx" />      <siteMapNode title=" Sub Menu3 3 " value="Sub Menu3 3" tooltip="Sub Menu3 3" url="~/SubMenu33.aspx" />      <siteMapNode title=" Sub Menu3 4" value="Sub Menu3 4" tooltip="Sub Menu3 4" url="~/SubMenu34.aspx" />    </siteMapNode>    <siteMapNode  title="Menu 4" value="reports" tooltip="Patient Summary" >      <siteMapNode title="Sub Menu4 1 " value="" tooltip="Sub Menu4 1"   url="~/SubMenu1.aspx?ReportName=1"   />      <siteMapNode title="Sub Menu4 2" value="" tooltip="Sub Menu4 2"   url="~/SubMenu41.aspx"/>      <siteMapNode title="Sub Menu4 3" value="" tooltip="Sub Menu4 3"   url="~/SubMenu42.aspx"/>      <siteMapNode title="Sub Menu4 4" value="" tooltip="Sub Menu4 4"  url="~/SubMenu43.aspx?ReportName=3"/>      <siteMapNode title="Sub Menu4 5" value="" tooltip="Sub Menu4 5"  url="~/SubMenu44.aspx"/>      <siteMapNode title="Sub Menu4 6" value="" tooltip="Sub Menu4 6"  url="~/SubMenu45.aspx"/>    </siteMapNode>    <siteMapNode  title="  Menu 5 " value="Rebuilt" tooltip="Menu 7"  >    </siteMapNode>    <siteMapNode  title=" Menu 6 " value="Rebuilt1" tooltip="Menu 6"  >    </siteMapNode>    <siteMapNode  title=" Menu 7 " value="SO" tooltip="Sign Out"   url="~/signout.aspx" >    </siteMapNode>  </siteMapNode></siteMap> Menu Control Menu control is server side control,you can control appearance, orientation of menu control. you can apply skin and themes on menu control,now you don't need to write a code for menu,you can bind menu control with data source. Open your default.aspx page and drop and drop Menu control from Toolbar as shown in figure 1.1. Figure 1.1 SiteMapDataSource control Bind to hierarchical site map data is called SiteMapDataSource control. you can also use SiteMapDataSource control with other controls. Listing 1.2 <asp:SiteMapDataSource ID="SamplesSiteMapAamirHasan" runat="server" SiteMapProvider="SamplesSiteMapAamirHasan" /> Note:When you select the SiteMapDataSource for Menu Control, you will be able to View the Site Map contents inside the Menu Control.   Web.Config file To use this in your website, you need to add the following code to the web.config file as shown in listing 1.3 Listing 1.3 <siteMap defaultProvider="SamplesSiteMapAamirHasan">        <providers>          <add name="SamplesSiteMapAamirHasan" type="System.Web.XmlSiteMapProvider" siteMapFile="Web.sitemap"/>        </providers> </siteMap> Theme and Skin Combination of Skin, css,images, and other resources is called Theme.Right Click on your web site , Add ASP.NET Folder - >Theme as shown in figure 1.3, Theme1 folder is created, rename theme folder to default.Let create a Menu Skin, Right click on default folder under the App_Theme folder ,select Add New Item from menu option, select Skin File from Add New item window and name it Menu.Skin.Paste below listing 1.3 code in you Menu.Skin file. Listing 1.3 <asp:Menu  runat="server"   Orientation="Horizontal" StaticDisplayLevels="2" CssClass="MainMenu"> <DynamicMenuStyle CssClass=".IE8FixIssue" /> <StaticMenuItemStyle CssClass="Menu-Skin-StaticItem" />  <StaticHoverStyle  CssClass="Menu-Skin-StaticItemHover" />  <DynamicMenuItemStyle  CssClass="Menu-Skin-StaticItemDown" /> <DynamicHoverStyle CssClass="Menu-Skin-DynamicHover" /> <StaticSelectedStyle  CssClass="Menu-Skin-DynamicHover" /> <DynamicSelectedStyle  CssClass="Menu-Skin-DynamicSelected" /></asp:Menu> Cascading Style Sheet .MainMenu { color:Black; font-family: tahoma; font-size:11px; font-weight: bold; text-decoration: none; margin-top:0px; margin-bottom:1px; padding:1px 1px 1px 1px; } .MainMenu A:link, .MainMenu A:active, .MainMenu A:visited, .MainMenu A:hover { color:Black; font-family: tahoma; font-size:11px; font-weight: bold; text-decoration: none; padding:1px 1px 1px 1px; } .Menu-Skin-StaticItem { border-right:1px #999999 solid; padding:1px 1px 1px 1px; background:#f1f1f1 url(images/menu_bk.jpg) repeat-x; font-size:11px; height:24px; font-family: tahoma; font-size:11px; font-weight: bold; } .Menu-Skin-StaticItemDown { border-right:1px #999999 solid; text-decoration:none; color:Black; padding:1px 1px 1px 1px; background:#f1f1f1 url(images/menu_bk_down.gif) repeat-x; font-size:11px; height:24px; } .Menu-Skin-StaticItemDown A:link { border-right:1px #999999 solid; text-decoration:none; color:Black; height:24px; } .Menu-Skin-DynamicHover { border-left:1px #999999 solid; border-right:1px #999999 solid; border-bottom:1px #999999 solid; border:1px #ffffff solid; padding:1px 1px 1px 1px; background:#999999 url(imagses/menu_bk_hover.gif) repeat; font-size:11px; color: #999999; height:24px; font-family: tahoma; font-weight: bold; } .Menu-Skin-DynamicHover A:link, .Menu-Skin-DynamicHover A:active, .Menu-Skin-DynamicHover A:visited, .Menu-Skin-DynamicHover A:hover { border-bottom:1px #999999 solid; color:White; font-family: tahoma; font-size:11px; font-weight: bold; padding:1px 1px 1px 1px; text-decoration: none; } .Menu-Skin-StaticItemDown, .Menu-Skin-StaticItem A:link, .Menu-Skin-StaticItemDown,.Menu-Skin-StaticItem A:active, .Menu-Skin-StaticItemDown,.Menu-Skin-StaticItem A:visited, .Menu-Skin-StaticItemDown,.Menu-Skin-StaticItem A:hover { border-bottom:1px #999999 solid; color:Black; font-family: tahoma; font-size:11px; font-weight: bold; padding:1px 1px 1px 1px; text-decoration: none; } .IE8FixIssue { z-index: 100; } Figure 1.3 IE 8 rendering Issue Dont warry, you have to overriding the z-index propert.As i have apply z-index property in the above css and skin.Open your file from Theme folder as shown in Listing 1.4 Listing 1.4  <DynamicMenuStyle CssClass="IE8FixIssue" /> copy IE8FixIssue Class  and paste it in Menu.css file under default theme folder Listing 1.5   .IE8FixIssue { z-index: 100; }   Add the IE7 Meta Windows Internet Explorer 8 will attempt to display content using its most standards-compliant mode. Now you can switch to the IE7 standard mode by adding META tag under the HEAD of the page as shown in below Listing 1.6. you can also add it into your Web.Config file as shown in Listing 1.7 Listing 1.6 <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> Listing 1.7 <?xml version="1.0" encoding="utf-8"?><configuration>   <system.webServer>      <httpProtocol>         <customHeaders>            <clear />            <add name="X-UA-Compatible" value="IE=EmulateIE7" />         </customHeaders>      </httpProtocol>   </system.webServer></configuration> Menu rendering issue in Google Chrome and Safari Right click on you web site select add ASP.NET Folder from menu option, and click App_Browsers as shown in below figure 1.7. Right click on App_Browser folderAdd New Item, Add New Item window will be display on your screen, select Browser File and enter safari.browser name in the file name textbox. Open Safari.browser file, add small piece of code under the broswer tag as given below in listing 1.8. Figure 1.7 Listing 1.8  <browser refID="safari">    <controlAdapters>      <adapter controlType="System.Web.UI.WebControls.Menu" adapterType="" />    </controlAdapters>  </browser> Configure Multiple Site Maps you can configure multiple sitemap as given below listing 1.9 Listing 1.9 <siteMap defaultProvider="SamplesSiteMapAamirHasan">        <providers>          <add name="SamplesSiteMapAamirHasan" type="System.Web.XmlSiteMapProvider" siteMapFile="Web.sitemap"/>          <add name="SamplesSiteMapAamirHasan2" type="System.Web.XmlSiteMapProvider" siteMapFile="Web2.sitemap"/>        </providers>      </siteMap> Tested I have tested this Menu example on following browsers as show in figure 1.8 Internet Explorer 7 Internet Explorer 8 FireFox Google Chrome Opera Safari IPad IPod Figure 1.8 FireFox Result Internet Explorer 7 Result   Opera Result Google Chrome Download you can download source code from here (31.20 kb)   Demo online Menu Control demo Links ASP.NET Menu Control Overview SiteMapDataSource control ASP.NET Themes and Skins Overview  Configure Multiple Site Maps and Site-Map Providers
by Aamir Hasan   on Sunday, July 11, 2010
Word Warp is the automatic breaking of text across lines. Text in a line automaticlly moves to the next line when length exceeds the postion of the right indent marker. If you are writing a query and if it exceed the length of the right indent marker then it will automatically shift to next line. To trun on the word warp in MS SQL 2008, open your MS SQL 2008 , at top menu of MS SQL 2008  click Edit -> click Advanced and then click Word Warp as shown in below figure , to turn off the Word Warp, click Word Warp.
by Aamir Hasan   on Tuesday, July 6, 2010
Input logic, business logic, and UI logic is called MVC. MVC is designed on following three attribute. M (model), V (View), C (controller) as you see in Below Diagram.  Model: To build a model with business rules, validation and aggregation logic is called Model. For Example, Linq to SQL.dbml files. View: UI of Application is called View. For Example, Home, Account, Shared three folders in View Folder in this Project. In the Account folder is used for UI for logging and change password. Controller: Logic of application is called Controller. For Example, In this Project Controller folder includes AccountController and HomeController files which contains the  flow of login information  ASP.NET MVC 2 builds on ASP.NET MVC 1.0. MVC 2 can be used with 3.5 SP1 and With ASP.NET 4.O. MVC 2 by default installed on your computer when you install Visual Studio 2010. You can download latest version of MVC from MVC download page.In ASP.NET MVC 2 improves the maintainability of the application. You can Update MVC 1.0 protect to ASP.NET MVC 2. ASP.NET MVC2 introduces new features. New Features Template Helper to use Lambda Expression. Asynchronous Controllers for parallel long running tasks and  enable to Asynchronous Operations Matter Area to split large project to avoid the complexity of the large project. Right Click on your Project in the Solution Explorer, click Add and then click Area. Now you can add forum or admin in the Area Strongly Typed UI Helpers to view model level error instead of all validation Errors. HiddenInputAttribute Class for Templated Helpers when DisplayValue is false nothing will be happen but when DisplayValue is true then input hidden element will be rendered when  displaying model  in editor template Enhancements to ModelBinders Automatic HTML-Encoding Enhancements to ModelBinders supports are: Increasing Security with HTTPS Avoiding the JSON Array Attack Short Notation for AcceptVerbs Attribute Overriding the HTTP Verb Binary Binding Ability to render subsections of site pages   Example Open your Visual Studio 2010. Create New Project, window will be display on your screen, by default .Net Framework 4 is selected. Expand Visual C# and click on Web. Select ASP.NET MVC 2 Web Application as you see in below figure. Unit Test If you want to create Unit Test then select Yes option and give the Test Project name. By default name of the test project is the application project MvcApplication.Tests. You can change the name of project as shown in below figure.     Solution Explorer Project is created as you see in the below Figure. Content folder includes CSS file, Script contains js Files. You have three main folders Controller, Models and Views Controller Below is the Simple HomeController class. using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; namespace MvcApplication.Controllers { [HandleError] public class HomeController : Controller { public ActionResult Index() { ViewData["Message"] = "This is my First MVC Web Project"; return View(); } public ActionResult About() { return View(); } } } Views (Index.aspx Page) Here is the Code of index.aspx Page<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">    <h2><%: ViewData["Message"] %></h2>    <p>        To learn more about ASP.NET MVC visit <a href="" title="ASP.NET MVC Website"></a>.    </p></asp:Content>   Global.asax.cs Default created MVcApplication class in Global.aspx.cs file as shown in below code.   using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; using System.Web.Routing; namespace MvcApplication { // Note: For instructions on enabling IIS6 or IIS7 classic mode, // visit //Author:Aamir Hasan public class MvcApplication : System.Web.HttpApplication { public static void RegisterRoutes(RouteCollection routes) { routes.IgnoreRoute("{resource}.axd/{*pathInfo}"); routes.MapRoute( "Default", // Route name "{controller}/{action}/{id}", // URL with parameters new { controller = "Home", action = "Index", id = UrlParameter.Optional } // Parameter defaults ); } protected void Application_Start() { AreaRegistration.RegisterAllAreas(); RegisterRoutes(RouteTable.Routes); } } }   Unit-test project you will add a controller with an action method and a view, and you will add a unit test for the action method. Explorer View  Compile and run the Project and you will see Result in the Explorer   Download Mvc2Application.rar (47.36 kb)  
Advertizement 1
Advertizement 2
Advertizement 3
Advertizement 4
Advertizement 5