JavaScript: Confirm User Action Script

Code:

<script language="javascript" type="text/javascript">
    function ConfirmDeleteSomething() {
        return confirm("Warning: This Something will be permanently deleted. Would you still like to continue? ");
    }



<asp:LinkButton ID="lbtnDelete" runat="server" 
    OnClick="lbtnDelete_Click"
    CausesValidation="false"
    OnClientClick="return ConfirmDeleteSomething()">Delete Something

Summary:

To make sure that a user is actually sure they want to perform an unrecoverable action, such as deleting something, you may want to add a confirmation dialog warning the user of what their potential actions may do.

To do this using JavaScript simply add a function which calls the ‘confirm’ command and call that function through the ‘OnClientClick’ event of your button control in ASP.net.

ASP.net: TabContainer Maintain Selected Tab Index with Hidden Field

JavaScript which hooks to the OnClientActiveTabChanged=”OnTabChanged” event of the TabContainer. When the event is called the currently selected tab index is pulled and saved to the hidden form field.

<script type="text/javascript">
function OnTabChanged(sender, args) {
var tabControl = $get("").control;
var currentIndex = tabControl.get_activeTabIndex();
$get("").value = currentIndex;
}

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, “Courier New”, courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

Hidden form filed added to ASCX or ASPX view.

<asp:HiddenField ID="hfSelectedIndex" runat="server" />

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, “Courier New”, courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

Method for setting the ActiveTabIndex of the TabContainer if there is a value in the hidden form field.

        private void SetCurrentTab()
        {
            if(!string.IsNullOrEmpty(hfSelectedIndex.Value))
            {
                int value;
                if (int.TryParse(hfSelectedIndex.Value, out value))
                    tcStoreEditor.ActiveTabIndex = value;
            }
        }

Call the SetCurrentTab method in the Page_Load event to set the selected index if one exists.

        protected void Page_Load(object sender, EventArgs e)
        { 
            if (!Page.IsPostBack)
            {
                //Some Method Calls Here
            }
 
            SetCurrentTab();
        }

ASP.net: TabContainer Maintain Selected Tab Index with Cookies

Methods for reading the cookie created by the clientside script and setting the ActiveTabIndex of the TabContainer.

        private void ReadIndexCookie()
        {
            if (Request.Cookies[CookieName] != null && Request.Cookies[CookieName].Value != null)
            {
                int index;
                int.TryParse(Request.Cookies[CookieName].Value, out index);
                CurrentIndex = index;
                return;
            }
 
            CurrentIndex = 0;
        }
 
        private void SetCurrentTab()
        {
            tcStoreEditor.ActiveTabIndex = CurrentIndex;
        }

Call the two methods in the Page_Load.

        protected void Page_Load(object sender, EventArgs e)
        { 
            if (!Page.IsPostBack)
            {
                //Some Method Calls Here
            }
 
            ReadIndexCookie();
            SetCurrentTab();
        }

JavaScript code which hooks to the TabContainer’s OnClientActiveTabChanged=”OnTabChanged” event. When that event is fired the selected tab index is pulled and written to the cookie.

<script type="text/javascript">

function Set_Cookie(name, value, expires, path, domain, secure) {
// set time, it's in milliseconds
var today = new Date();
today.setTime(today.getTime());

/*
if the expires variable is set, make the correct
expires time, the current script below will set
it for x number of days, to make it for hours,
delete * 24, for minutes, delete * 60 * 24
*/
if (expires) {
expires = expires * 1000 * 60 * 60 * 24;
}
var expires_date = new Date(today.getTime() + (expires));

document.cookie = name + "=" + escape(value) +
((expires) ? ";expires=" + expires_date.toGMTString() : "") +
((path) ? ";path=" + path : "") +
((domain) ? ";domain=" + domain : "") +
((secure) ? ";secure" : "");
}


function OnTabChanged(sender, args) {
var tabControl = $get("").control;
var currentIndex = tabControl.get_activeTabIndex();
Set_Cookie("", currentIndex, "", "", "", "");
}

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
width: 450px;
font-family: consolas, “Courier New”, courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

JavaScript: Simple Open New Window

Since I don’t do this on a daily basis it doesn’t stick around so I figured I would blog it so I have a reference to it:


window.open('http://www.yourdomain.com','','scrollbars=no,menubar=no,height=700,width=900,resizable=yes,toolbar=no,location=no,status=no');

JavaScript: Locate ASP.net Controls in HTML Markup

In ASP.net all controls are assigned a Unique Identifier (ID) so they can be referenced within your C# or VB code with ease. Most of use would, at least at first, assume we can use those very same ID’s in our JavaScript to manipulate those controls client side as well. Unfortunately not!

This is because ASP.net pages are made up of 10’s possibly 100’s of controls and any of those controls might be found embedded within other controls and its really hard to come up with unique ID’s for 100+ controls specially when you don’t the names used in 3rd party controls or the controls that come built into ASP.net. In order to handle these situations and in order to guarantee that each and every control has a unique ID within the HTML markup that gets generated .Net uses what are known as Naming Containers.

Naming Containers define a unique Namespace for all control ID’s within itself. There can be multiple Naming Containers on a page each with their own unique id, and each of these can then contain controls each with a unique id. But what is cool about it all is the unique ID’s can be reused across all the Naming Containers on a page. So a control named txtName can exist in more than one Naming container, but it has to remain unique within each of the containers.

Because of this Namespacing there becomes a need to guarantee that each control has a unique name in the rendered HTML. In order to accomplish this ASP.net pre-pends each unique control ID with each of its preceding Naming Containers up the chain. When you look for your control ID’s within the rendered markup you will see something like this ‘dnn_ctr8143_CrudImage_fuImage’.

This of course makes it very difficult to get a hold of your controls from within JavaScript. As long as your JavaScript is being rendered with the page by ASP.net there is a solution. You simply need to add a tag to your JavaScript on in your page or control markup which will give you the id of the control as it will appear within the final rendered markup. Or if you are adding scripts dynamically from within your C# or VB you can use a property of the control to get the id. The methods are as follows:

Within ASP.net Markup

Hide this content!
<div onclick="HideControl();return false;">

Dynamically C#

btnHide.OnClientClick("HideControl(" + pnlContent.ClientID + ");return false;");