Generate client side script with custom control in ASP.NET

As you already know custom control gives the flexibility and allows to add complex features for a server control (refer to MSDN:Developing and Using a Custom Web Server Control).


Now consider you would like to display modal dialog using JQuery UI and the respective .js files are already loaded by the main website.The following snippet allows you to display a button from your custom control and generate a script block on the client side to handle the click event.

public class CustomWebControl : WebControl
{
 protected override void Render(HtmlTextWriter writer)
 {
         writer.Write(@"
          
          
              
   
Text to be displayed in the modal dialog.
   
");
  this.Page.ClientScript.RegisterStartupScript(this.GetType(), "test-dialog-modal_1", @"   
   
  ");
 }
 
}

This is the simple case of explaining how to achieve it.


The most overlooked advantage to owning a computer is that if they foul up, there's no law against whacking them around a little. ~Eric Porterfield.

Continue Reading

Passing vArguments or dialogArguments with window.open

Arguments can only be passed with window.showModalDialog which is quite helpful. But consider your application is using these arguments extensively in your website and suddenly it appears modal dialog is not supported on all browsers. Opera does not support modal dialog, now instead of changing the existing functionality the work around would be as follows:-

1. Detect if browser support modal dialog or not and then assign arguments

var vArguments = new Object();
vArguments.test1 = "test1 data";
vArguments.test2 = "test2 data";
if (window.showModalDialog) {
window.showModalDialog(sURL, vArguments, sFeatures);
}
else
{
window.dialogArguments = vArguments;
window.open(sURL, "_blank", sFeatures);
}

2. Now inside the pop-up window access the arguments

 var dialogArguments ;
if (window.showModalDialog) {
 dialogArguments = window.dialogArguments;
}
else {
 dialogArguments = window.opener.dialogArguments;
}
alert(dialogArguments.test1);
alert(dialogArguments.test2);

Now this should work like a charm.


Man is still the most extraordinary computer of all. ~John F. Kennedy

Continue Reading

Enable HTTPS for a Website using IIS

Testing your website with HTTPS might be one of the customer requirement. IIS allows you to create a dummy SSL that enables you to test the website using HTTPS. So Now to enable HTTPS follow below steps :

[First lets create a certificate]
1. Goto IIS -> select the machine name
2. Now from features select "Server Certificates"
3. select "Create Self-Signed Certificate" and specify the name "DummyCertificate"

4. Now this should get displayed in the list of certificates

[Now lets associate the certificate to websites]
5. Goto IIS -> Select "Default Web Site"
6. Under "Actions" select "Bindings"

7. Now select "Add", select type as "https" and select the certificate as "DummyCertificate"

8. Now "ok" the message and "close" the site bindings. This should display the bingings to https as shown below:-

9. Now select the site and from features select "SSL Settings". Update as below:

10. Select "Apply" and your website is enabled with https. Now publish with https.



“Computer science education cannot make anybody an expert programmer any more than studying brushes and pigment can make somebody an expert painter.”
(Eric Raymond)

Continue Reading

Width 100% not working in IE compatibility mode

At time its so frustrating to get css styles work correctly in various circumstances such as cross-browser , IE compatibility mode etc.

Recently notice an issue which is setting width 100% does not work in IE compatibility mode. The page display a input:select and input:textbox. It works fine in various places but was having issue at one particular table.

After trying out various options and finally the option that worked is

 td style="width:100%;"

So be very careful with this sort of issues, as these are very minor but becomes so frustrating at times.


Hardware: the parts of a computer that can be kicked. ~Jeff Pesis

Continue Reading

Format date based on client time zone using javascript and ASP.NET AJAX

At time you might want to format date based on the client's browser configuration of language. If you are using ASP.NET AJAX then you will have the provision of using Sys namespace.

Here is a sample snippet that show how to use it :-

function ToClientFormat(ClientDate) {
    var dt = new Date(ClientDate);
    return dt.localeFormat(Sys.CultureInfo.CurrentCulture.dateTimeFormat.FullDateTimePattern);
}

Now this will display the date as

Friday, December 10, 2010 11:07:05 AM

As shown you will be able to use Sys.CultureInfo.CurrentCulture.dateTimeFormat to get which ever the format you were interested in, refer to MSDN for more details Sys.CultureInfo.dateTimeFormat


“Make everything as simple as possible, but not simpler.”
– Albert Einstein

Continue Reading

Change default browser running VS2010

At times we might have to test various things for cross-browser compatibility as part of validation. But if you want to default your visual studio to run the web application in a specific browser then follow these steps :-

1. Select the page you want to view in Visual Studio
2. Now right click on the file and select "Browse With", the following dialogue box will be displayed.

3. Select the browser and click on "Set as Default" for defaulting visual studio to that specific browser.


“It’s OK to figure out murder mysteries, but you shouldn’t need to figure out code. You should be able to read it.”
– Steve McConnell

Continue Reading

Adding custom buttons to jquery datepicker showButtonPanel

JQuery solves most the requirements of date with the datepicker. Ok now, to add some extra functionality for datepicker such as providing some custom buttons in the buttonpanel after enabling it via "showButtonPanel : true".

Here is a snippet of code that should do the trick:-

$("#datepicker2").datepicker({
 showButtonPanel: true,
      beforeShow: function( input ) {
 setTimeout(function() {
   var buttonPane = $( input )
     .datepicker( "widget" )
     .find( ".ui-datepicker-buttonpane" );

   var btn = $('');
   btn
    .unbind("click")
   .bind("click", function () {
    $.datepicker._clearDate( input );
  });

   btn.appendTo( buttonPane );

 }, 1 );
      }
});

with the html as

Date: 

should display the datepicker with clear option as:-

“From a programmer’s point of view, the user is a peripheral that types when you issue a read request.”
– P. Williams

Continue Reading