Archive for the 'webdesign' Category

AddThis and HTTPS / SSL support – ‘Do you want to view only the webpage content that was delivered securely?’

Image representing AddThis as depicted in Crun...
Image via CrunchBase

Yesterday I wrote about a problem I came across using AddThis service. Today I had a new issue.

This is an example of the code generated by AddThis:


| More

It’s said what you need to do is to include it in your page and AddThis will do all the work for you. Now, it didn’t in my case…

Continue reading ‘AddThis and HTTPS / SSL support – ‘Do you want to view only the webpage content that was delivered securely?’’

AddThis on IE – Object doesn’t support this property or method

Image representing AddThis as depicted in Crun...
Image via CrunchBase

AddThis is a great service – it allows robust integration with online services, e.g. Facebook, Twitter, LinkedIn, del.icio.us. What you need to do is to get your button’s code on AddThis homepage and use it in your project. Additionally you can configure the widget; you can refer to AddThis API, where you can find needed information and examples.

I created a component which I included on a couple of pages. I was very happy to use it until I started testing my pages on different browsers. It turned out there was a problem on IE (only; why didn’t that surprise me…); in two of three places it worked just fine but in one place I was getting JavaScript error:

jserror 350x234 AddThis on IE   Object doesnt support this property or method

As usual JavaScript error message on IE gave little (if not zero) information on the error. The only statement to give was the problem was on AddThis side. Unfortunately debugging their code was not the best case because the referenced library was obfuscated and (rather not) dedicated to a human being.

Continue reading ‘AddThis on IE – Object doesn’t support this property or method’

IE7 – problems with onchange event for text field when auto complete used

Imagine you have a text field in the form which is defined as below

<input type="text" name="fake" id="fake" onchange="doSth()" />

Apparently doSth() will not be called at all if you are running IE7 and use its auto completion mechanism. If you bind doSth() with onblur that won’t solve the case either.

Solution

The best solution is to call doSth() only when the form is submitted. That seems to be the safest option.

Unfortunately, there might be cases when doSth() must be called immediately after leaving the input, not only at the submit time. Any ideas here?

Stimator – estimate your website value

It’s all about being popular these days. After a while of having a web site you probably start wondering if anybody is actually interested in it. You can employ Google Analytics to get quite extensive statistics, you can use FeedBurner to track the popularity of you RSS channel, you can check the current page rank of your website. There are plenty of ways of getting some statistics…

Apart from that you can also evaluate the value of your website. It’s not like you feel it’s time to sell it, but why not think that in the age of global crisis you have a back up so that you still have money to buy the food :) Stimator seems to be a nice tool there. Let me cite its authors:

Stimator is a real-time website value estimator. The engine deliveries the most accurate economical value that a website could worth by collecting important data from different sources. The results are indexed to database references and to the financial market in order to re-produce, as real as possible, how much investors are prepared to invest. Stimator is in beta stage as we keep improving this project.

Continue reading ‘Stimator – estimate your website value’

Web Forms Design by Luke Wroblewski

Web Form Design : Filling in the Blanks
Image by Bodum via Flickr

I’m finishing reading a very good book about designing web forms: Web Forms Design by Luke Wroblewski.

Personally I believe it’s a must-read-me book for anyone who is interested in web design, disregarding the fact if they are beginniers or highly experienced geeks. Both can find answers to questions they could ask, compare described examples, see flaws and advantages of existing forms in well known services, and finally choose the solution that fit best the end users.

The book is relatively short but full of suggestions supported with a lot of examples (screen shots). It is dived into several chapters describing individual aspects of web forms, i.e. labels, inputs, actions, help texts, error and success messages.

Highly recommended.

Reblog this post [with Zemanta]

NVelocity and XSS

NVelocity is a view engine for MonoRail. It’s quite handy and it’s not difficult to deliver such views.

One of the flows I can name can be the security issues. By default there’s not much support for security. For instance it’s possible to perform XSS (Cross-site scripting) attacks by providing XHTML or JavaScript code.

I spent some time googleing for existing solutions for that MAJOR issue but I failed to find anything interesting. The most usefult information I’ve found was the article called Cross Site Scripting and letting the framework deal with it. Accordint to its author, Oren Eini, some support for HTML encoding has been implemented for Brail, which is another MonoRail view engine. But… I’m interested in NVelocity, not Brail!

Should you discover anything interesting on that topic, please post a link as a comment for this post. I’d be grateful :)

Reblog this post [with Zemanta]

How to always open a new page in a new window with JavaScript?

In order to always open a new page in a new window you can employ window.open function of JavaScript:

window.open(URL, UNIQUE_TITLE, WINDOW_FEATURES)

Note: If you have a number of links that use this JavaScript snippet and want to open each of them in a separate window remember to set UNIQUE_TITLE to a unique string for each of them. If those strings are the same, the new window will be created only once and it will be reused every time you click such link.

Problems with UpdatePanel on SharePoint

If you want to add some AJAX flavour to your ASPX pages running on SharePoint you need to perform a few actions:

  • install ASP.NET AJAX on servers in your farm
  • extend SharePoint web.config file with Microsoft ASP.NET AJAX
  • add ScriptManager either in the master page you’re using (prefferable) or in all pages that employ AJAX

The above listed steps are well described in the following article: Integrating ASP.NET AJAX with SharePoint.

However, at the end of the day you may (and probably will) end up with some problems during development. In short, not all works as it’s supposed to and how it does in a regular web project. One of the issues I had recently was UpdatePanel which made my page not working after a while.

Basically, I had an ASPX with some controls that had event handlers assosiated with them (e.g. buttons with onclick’s). There too was an UpdatePanel which was triggered by an event, let’s say “Click” perfomed on a button. This event made the UpdatePanel reload, BUT ONLY FOR THE FIRST TIME. Once reloaded, none of the handlers assosiated with any of the controls on the page worked.

I did a lot of googling but finding the answer was not that easy. Finally my friend gave me the link to this article. The solution is described in section “Using UpdatePanels within SharePoint”. The author suggests to add this JavaScript code to the page:

<script type="text/javascript">
    _spOriginalFormAction = document.forms[0].action;
    _spSuppressFormOnSubmitWrapper=true;
</script>

FCKEditor – how to access the HTML content from JavaScript?

Imagine you have a form in which you use FCKEditor as an inline HTML editor. So, inside script tag you have this:

var oFCKeditor = new FCKeditor('body_html');
oFCKeditor.BasePath = "A_PATH_TO_FCKEDITOR";
oFCKeditor.ToolbarSet = "Basic";
oFCKeditor.Create();

As you know, this creates a textarea with id set to ‘body_html’ and make it look like an inline HTML editor.

Going forward, you would like to receive the HTML code that represents the content of this textarea, and that you want to do this in JavaScript. In order to do that you need to follow FCKEditor API, so do somethink like this:

FCKeditorAPI.GetInstance('body_html').GetHTML(true);

Maybe it’s obvious but it took my a while to find out how to do this…

Microsoft JScript runtime error: Object doesn’t support this property or method.

Yesterday I spent two hours analyzing this issue, which of course I had only with Internet Explorer…

As the background: I wrote a library that would make a table sortable and paginable. I decided to use prototype.js and script.aculo.us. I tried to test the result not only in Firefox which I use by default, but then I simply forgot… Then, when I run the page I got the error:

Microsoft JScript runtime error: Object doesn’t support this property or method.

At the end of the day, (after cutting JavaScript files into slices) I found the reason. All because I created HTML elements like follows (this example uses Builder of script.aculo.us):

$(this._sPaginationSecId).appendChild(Builder.node('span', { class: 'disabled' }, '<'));

If you look at that closer, you will find out that class is not put inside apostrophes (‘). Changing the above snippet to the one below will solve the case:

$(this._sPaginationSecId).appendChild(Builder.node('span', { 'class': 'disabled' }, '<'));

Important!
Be careful with defining properties like href and class with Builder.node() (of script.aculo.us) and new Element() (of prototype).


It’s also possible to define class name of a DOM object created with prototype.js or script.aculo.us using className as a parameter (instead of od 'class'):

$(this._sPaginationSecId).appendChild(Builder.node('span', { className: 'disabled' }, '<'));
Reblog this post [with Zemanta]



Switch to our mobile site