dileno

Subscribe

Hi! I'm Martin Söderlund, the owner of this blog. I work as a web consultant in Stockholm, Sweden. My main focus areas are .NET development and interface development.
If you've got something on your mind, feel free to contact me.

Close

Thank you for visiting!

Please consider subscribing to the RSS feed or following me on Twitter.

IE Edge, Angular and Highlighting a Text Field

Recently, I stumbled upon a problem using the Angular Material framework. While using the md-autocomplete component, I wanted to highlight a text field when the user clicked said text field. Easier said than done.

I started writing a directive, which highlights a text field when it's focused. Of course I went for the focus event. When the focus event is triggered, I simply highlight the text field. It worked everywhere. Except in IE Edge.

After some debugging, I simply switched the focus event for the click event, and it started working everywhere.

Here's the directive:

app.directive('autocompleteFocus', function($timeout, $log){
  return{
    link: function(scope, element, attrs){
       $timeout(selectOnFocus, 0);

       function selectOnFocus(){
           element.find("#skoder-field").bind("click", function () {
               angular.element(this).select();
           });
       }
    }
 }
});

Use it like this:

<md-autocomplete ... autocomplete-focus />

Check if Bootstrap CSS is Loaded and Provide Local Fallback

When a CDN somehow fails, you want to make sure you can load a local fallback.

Here's a snippet to check if Bootstrap CDN is down, and then proceed to load a local Boostrap fallback version, utilizing Boostrap's hidden CSS class.

If Bootstrap is loaded, the span will be hidden. We simply check if it is hidden, and if it aint - we assume Bootstrap wasn't loaded from CDN and load our local fallback instead.

Run this script after you've tried to load Boostrap from a CDN.

var $span = $('<span class="bs hidden"></span>');
var $bs = $('body').append($span).find('.bs');

if ($bs.css('display') !== 'none') {
	$("head").append('<link rel="stylesheet" href="/css/Bootstrap/bootstrap.min.css">');
}
$bs.remove();

Other, more sofisticated methods, depend on libraries like yepnope or requirejs. Meanwhile, this method works just fine.

Take Ownership on Windows 10

Update: Now there's a nice tool with an interface that you can use instead. Reset Files Permission

After installing Windows 10, you suddenly don't have permissions to save in some locations. It doesn't matter if you're an administrator either.

After some research, I found a simple solution in this thread on TenForums.

Simply fire up a command prompt (hit Windows key, type CMD, right click and choose Run as administrator) and run this command on your location or drive (change E: to appropriate):

icacls "E:" /setowner "Administrators" /T /C

Depending of the number of files in your location, it might take some time.

Faster Visual Studio Attach to Process Debugging

Visual Studio's Attach to process is an alternative to the good ol' F5 which builds your solution and lets you debug it. However Attach to process can be made a little bit easier using a few helpful tricks.

First of all, we need to add an external tool to Visual Studio:

  1. Go to Tools->External Tools and press Add to create a new tool.
  2. Fill in these values in the correct field:

    Title: list w3wp
    Command: %windir%\system32\inetsrv\appcmd.exe
    Arguments: list wp

    Make sure "Use Output window" is checked and remember what order your tool has in the list, for instance 4th. Press Ok.

Add external tool in Visual Studio

Remember that your w3wp processes will be in Visual Studio's output window when using this tool!

Now we want easy access to our tool. Let's give it a shortcut command:

  1. Go to Tools->Options->Environment->Keyboard.
  2. In the Show command containing box, search for tools.external
  3. Find the correct  Tools.ExternalCommandX where X matches the order of your tool in the external tools list, for instance 4.
    Assign shortcut keys to your command and press Ok. I use Alt+E.

Assign shortcuts in Visual Studio

Next up, we need to use the helpful Visual Studio extension ReAttach. Download and install it. It helps us reattach to the same w3wp process over and over again :-) I've written about ReAttach and debugging before.

Finally, let's assign some shortcut commands to Attach to process and reattach:

Using the same technique as last time:

  1. Search for Debug.AttachtoProcess and assign Alt+W
  2. Search for Debug.ReAttach and assign Alt+Q

Now you can first find your correct process under Alt+E, then attach to it using Alt+W and finally reattach using Alt+Q.

Maybe you want different shortcuts, feel free to do it your way.

To the top