change page title using jquery

In this tutorial you will learn how to change the page title using jquery. I will not recommend you to do so because it is not good for seo aspect of website. But one of my friend ask me to write tutorial so i am writing this. It's not a big rocket science. It is actually a one line code. Let's have a look over how to do so.

change page title using jquery

<script type="text/javascript">
      $(document).ready(function() {
        document.title = 'new page title using jquery';
      });
    </script>

I hope you will find this article very helpful.

Happy Coding!!!

format currency using jquery plugin

In this tutorial you will learn how to format currency using jquery plugin jQuery Format Currency plugin 1.4.0 . Using this plugin you can easily do what you want without any need to write code. Let's have a look over how to do so

format currency using jquery plugin

<script src="js/jquery-1.4.2.js" type="text/javascript"></script>
    <script src="js/jquery.formatCurrency-1.4.0.js" type="text/javascript"></script>
    <script language="javascript" type="text/javascript">
        $(document).ready(function () {
            $("#firstDiv").text("$44").formatCurrency();
            $("#secondDiv").text("$200").formatCurrency();
            $("#thirdDiv").text("$0.700").formatCurrency();
            $("#fourthDiv").text("$20000000").formatCurrency();
            $("#fifthDiv").text("$8000000000").formatCurrency();
        });
    </script>

Include jquery and jquery format currency plugin in your webpage.

Let's have a look over html code

<body>
    <div>
        <div id="firstDiv">
        </div>
        <div id="secondDiv">
        </div>
        <div id="thirdDiv">
        </div>
        <div id="fourthDiv">
        </div>
        <div id="fifthDiv">
        </div>
    </div>

</body>

Output will be
$44.00
$200.00
$0.70
$20,000,000.00
$8,000,000,000.00

I have also written a tutorial in javascript about Format the currency using javascript. I hope you will find this article very helpful.

Happy Coding!!!

How to highlight the form fields using css and jquery

In this tutorial you will learn how to highlight the forms fields using css and jquery. Now a days it is special requirement to create better and user friendly GUI forms so that user can visit your website again and again. The purpose of this tutorial is to make your forms different to forms used in other websites for better user experienced. Now let’s have a look over how to highlight the form fields using css and jquery.

How to highlight the form fields using css and jquery

<style type="text/css">
         .setFocus
        {
            border: solid 2px #95ce61;
            background: #fff;
            color: #000;
        }
        .setIdle
        {
            background: #fff;
            color: #6F6F6F;
            border: solid 2px #DFDFDF;
        }
    </style>
<script language="javascript" type="text/javascript">
  $(document).ready(function () {
            $('input, textarea, select').addClass("setIdle");
            $('input, textarea, select').focus(function () {
                $(this).removeClass("setIdle").addClass("setFocus");
            });

            $('input, textarea, select').blur(function () {
                $(this).removeClass("setFocus").addClass("setIdle");
            });

            //Applying MSIE Check
            if ($.browser.msie) {
                $("select").bind("focusin", function () {
                    $(this).addClass("setFocus");
                });

                $("select").bind("focusout", function () {
                    $(this).removeClass("setFocus");
                });
            }

        });
</script>

Now let's understand. We have declared two css classes setIdle and setFocus. The only discussable thing in both classes is margin property through which I am handling all the highlighting of form fields in onfocus event.

After this I have code written in jquery that will call these classes for form fields against desired events such as focus and blur. I am just assigning setFocus class for focus event of form elements and then calling setIdle class for blur event of form elements. Normally form fields/elements are categorized in three categories

Input
Textarea
Select

To cover all these fields I have written following line of code

$('input, textarea, select').addClass("setIdle");

So this is the proper way to highlight form fields using jquery and css. Hope it will work for you.

How to capture web page screenshot in asp.net using c#

In this tutorial you will learn how to capture webpage screenshot in asp.net using c#. You may got a requirement to capture the screenshot when user submits the form , etc. Most of the people purchase third party dll files and use them in their project to capture the screenshot of webpage. It is quite easy in asp.net and there is no need to purchase any dll. Let's have a look over how to do so.

How to capture web page screenshot in asp.net using c#

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.Collections.Generic;
using System.Web.Services;
using System.Text;
using System.Windows.Forms;//must be included for capturing screenshot

public partial class capture_webpage_screenshot : System.Web.UI.Page 
{
    protected void Page_Load(object sender, EventArgs e)
    {
       
    }
    protected void btnSave_Click(object sender, EventArgs e)
    {
        Bitmap bitmap = new Bitmap(Screen.PrimaryScreen.Bounds.Width, Screen.PrimaryScreen.Bounds.Height);
        Graphics graphics = Graphics.FromImage(bitmap as System.Drawing.Image);
        graphics.CopyFromScreen(25, 25, 25, 25, bitmap.Size);
        bitmap.Save(@"c:\screenshot\myscreenshot.bmp", ImageFormat.Bmp);
       
    }
}

The code is ready. Just you have to do the following steps.

Right click the project name
Add reference -> .net tab and then choose system.windows.forms namespace then press ok button.
In .aspx code behind file you have to import the System.Windows.Forms namespace and that’s it.

By customizing parameters used in CopyFromScreen() function, you can figure out how to capture the small portion of the screen, if required. Create a folder and give folder path in c# code just like above i have given. You can customize the code as well and give the dynamic name of bitmap file every time it is generated.

Happy Coding!!!

How to give inline css to any page element in c# code behind.

In this asp.net tutorial you will learn how to give inline css to any desired page element in c# code behind. Sometimes you may got requirement to give inline css when certain condition meets in your if/else condition or switch statement. In this tutorial I will let you you how to handle this situation.

How to give inline css to any page element in c# code behind.

.apsx

<asp:Label ID="lblName" runat="server"></asp:Label>

.aspx.cs

if (lblName.Text== "Muhammad Ali")
                {
                    lblName.Style.Add("color", "green");
                }
                else
                {
                    lblName.Style.Add("color", "red");
                }

The above lines of code segment are self explanatory. I am checking that if name is Muhammad Ali then asp:Label color will be green else color will be red. Simply I use built-in Add function of Style class to give inline css to asp:Label in c# code behind.

So that’s it. Hope it will work fine for you.

Programming Tutorials

php tutorials, asp.net tutorials, jquery tutorials and all other web tutorials