by Andreas

Remove action icons from text fields in Internet Explorer 10

Internet Explorer 10 introduced a new feature for input fields: the action icon. These certainly are user friendly, but introduces a problem with KnockoutJS which depends on changes being made to a field by key stroke (read more about forcing binding re-evaluation in one of my other blog posts). If you have a text field where you enter a value to filter the contents of a list, deleting the contents using the action icon will not trigger an update to the view model.

Here’s a text field displayed in Internet Explorer 10:

image

As you can see, the action icon is visible and will clear the contents of the text field when clicked. However, unless you add a custom binding your KnockoutJS view model will not re-evaluate its bindings and trigger an update of your filtered list. That will only happen if you start entering a new value in the text field, or change focus to a different control.

The quickest fix is to remove the action icon through CSS:

::-ms-clear {
      display: none;
}

Refresh your page and notice that the icon is now gone:

image

 

Note: this does not work when you’re running IE10 in IE7, IE8 or IE9 mode.

by Njål

Force Hard Reload in Chrome

Reloading pages in Chrome can be done in a few different ways:

  • Ctrl-R (or F5) – Normal Reload
  • Ctrl-Shift-R (or Ctrl-F5) – Hard Reload

I’m sure you knew this already. But here’s a new trick – you can do a Hard Reload and Clear Cache at the same time by right clicking on the Reload button. This requires that you have the developer console open (F12).

image

by Joakim

Bundling of CSS and JavaScript in MVC 4 Beta

MVC 4 Beta comes with support for bundling (and minification) of CSS and Javascript out of the box which is pretty neat.

By adding link- and script-tags like the ones below, you will you get the content from all the css- or js-files in the given directories minified and bundled together into a single resource, or will you?

<link href="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/Content/css")" rel="stylesheet" type="text/css" />
<script src="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/Scripts/js")"></script>

I added a custom css-file to “~/Content/”, as well as a custom js-file to “~/Scripts/” and expected them to become part of the resource bundles automagically, however that was not the case at all! So what gives?

It turns out that the method “BundleTable.Bundles.RegisterTemplateBundles();”, which is called under “Application_Start” in “Global.asax.cs”, contains hardcoded values for which resources that should be added to the bundles (default files such as site.css, jquery.cs, etc).

However, if you replace “BundleTable.Bundles.RegisterTemplateBundles();” with “BundleTable.Bundles.EnableDefaultBundles();” things work like you would expect them to. The latter actually looks in the specified directory and finds all the css- and js-files which is them minified and bundled together. If you ask me, this should have been the default used in the “MVC 4 Web Application”-template.

Another way to have all the files included in your bundles is to create and add them to the bundle collection yourself like so:

protected void Application_Start()
{
    Bundle styles = new Bundle("~/MyStylesBundle", new CssMinify());
    styles.AddDirectory("~/PathToMyStyles", "*.css");
    BundleTable.Bundles.Add(styles);

    Bundle scripts = new Bundle("~/MyScriptBundle", new JsMinify());
    scripts.AddDirectory("~/PathToMyScripts", "*.js");
    BundleTable.Bundles.Add(scripts);
}

Note! Since MVC 4 is still in beta, this may change (hopefully it does)!

by Degree Admin

Sharepoint 2010 Custom MasterPage og CSS

I forbindelse med et prosjekt fikk jeg i oppdrag å sette opp en Sharepoint site til å bruke egen masterpage og css. Her er en gjennomgang av hvordan jeg gikk frem for å løse dette.

Begynn med å gå inn å Sharepoint Designer og klikk på Master Pages. Kopier v4.master og lim inn i samme område. Gi den nye kopien av v4.master et passende navn.

Gå deretter til All files => Style Library. Høyre klikk og velg New=>css og gi css filen et passende navn.

For å få muligheten for å velge hvilken master page siten skal peke mot må man aktivere noen features. Gå inn i site settings og Site collection features under Site Collection Administration. Aktiver Sharepoint Server Publishing Infrastructure. Deretter går man inn på Manage site features under Site Actions og aktiverer Sharepoint Server Publishing.

Nå har noen nye valg dukket opp i site settings. Klikk på Master page under Look and Feel. Endre Site Master Page og System Master Page til å peke mot den master pagen som ble opprettet i Sharepoint Designer og klikk OK. Siten bruker nå den nye masterpagen.

Gå tilbake til Sharepoint Designer og gå inn på Master Pages. Klikk på den nye masterpagen og velg deretter edit file. Skriv inn følgende kodelinje inn i header tagen og pass på å legge den under PlaceHolderAdditionalPageHead => Sharepoint:DelegateControll tagen.

Hvis følgende filemelding dukker i Sharepoint Designer under edit file prosessen:
soap:Server was unable to process request. —> Value does not fall within the expected range, er det mulig at feilen ligger i configuring alternate access mapping. Gå til Sharepoint Central Administration => Application Management => Configure alternate access mappings. Her er det viktig at sharepoint siten peker til riktig path. Istedenfor f.eks localhost så skriv in path til siten.

PS: Husk å check inn og checke ut MasterPagen og CSS filen som brukes.