Monday, September 7, 2009

Disabling Auto-Complete on ASP.NET Forms

To turn off auto-complete for your entire form, all you need to do is add an attribute to your form tag, like this:

<form id="Form1" method="post" runat="server" autocomplete="off">


The HTML INPUT tags also support the use of autocomplete=off and since the control renders as INPUT tags then you can use it to set it on a control by control basis. Just add it to the TextBox at design-time (but note that VS.NET will underline it with a squiggly saying that textbox does not have an attribute for autocomplete - but it will still work):

<asp:TextBox Runat="server" ID="Textbox1" autocomplete="off"></asp:TextBox>


or at runtime:

Textbox1.Attributes.Add("autocomplete", "off");

Friday, July 24, 2009

Top web developer's tools

1. Browser Emulators including IE 7, IE 6, IE 8, Firefox 2 , Firefox 3, Chrome, Opera and Safari 3

2. Firebug integrates with Firefox to put a wealth of web development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.

3.OverlayComp allows you to overlay a design comp onto a page so that the CSS formatting and layout can be ensured to be pixel-perfect.

Changing window.location in IE 6

You are annoyed by the strange behavior if IE 6 ? I'm sure you are. Let;s take a look to the latest strange thing that i found. For some crazy reason, IE 6's javascript engine doesn't want to redirect me to a new URL by simply changing the window.location or window.location.href properties:

var newUrl = "http://someurl/";
//Those will not work
window.location = newUrl;
window.location.href = newUrl;

But(surprise), the following code which is stupid and shouldn't make a difference do the work!
var newUrl = "http://someurl/";
setTimeout(function()
{
window.location = newUrl;
}, 0);

Tuesday, February 24, 2009

Truncate a string to fit within a given pixel width.


  1. function fitStringToWidth(str,width,className)
  2. {
  3. // str A string where html-entities are allowed but no tags.
  4. // width The maximum allowed width in pixels
  5. // className A CSS class name with the desired font-name and font-size. (optional)
  6. // ----
  7. // _escTag is a helper to escape 'less than' and 'greater than'
  8. function _escTag(s){ return s.replace("<","<").replace(">",">");}
  9. //Create a span element that will be used to get the width
  10. var span = document.createElement("span");
  11. //Allow a classname to be set to get the right font-size.
  12. if (className) span.className=className;
  13. span.style.display='inline';
  14. span.style.visibility = 'hidden';
  15. span.style.padding = '0px';
  16. document.body.appendChild(span);
  17. var result = _escTag(str); // default to the whole string
  18. span.innerHTML = result;
  19. // Check if the string will fit in the allowed width. NOTE: if the width
  20. // can't be determinated (offsetWidth==0) the whole string will be returned.
  21. if (span.offsetWidth > width) {
  22. var posStart = 0, posMid, posEnd = str.length, posLength;
  23. // Calculate (posEnd - posStart) integer division by 2 and
  24. // assign it to posLength. Repeat until posLength is zero.
  25. while (posLength = (posEnd - posStart) >> 1) {
  26. posMid = posStart + posLength;
  27. //Get the string from the begining up to posMid;
  28. span.innerHTML = _escTag(str.substring(0,posMid)) + '…';
  29. // Check if the current width is too wide (set new end)
  30. // or too narrow (set new start)
  31. if ( span.offsetWidth > width ) posEnd = posMid; else posStart=posMid;
  32. }
  33. result = '' +
  34. str.replace("\"",""") + '">' +
  35. _escTag(str.substring(0,posStart)) +
  36. '…<\/abbr>';
  37. }
  38. document.body.removeChild(span);
  39. return result;
  40. }

Refs:
Acronym

offsetWidth

Wednesday, July 30, 2008

Array asociativ in Javascript

In javascript obiectele sunt de asemenea tablouri asociative(hash). Astfel proprietatea myObject.Home poate fi de asemenea accesata myObject['Home']. O parsare a unui astfel de tablou asociativ poate arata astfel:
var myObject = new Object();

function testIt() {
myObject.Home = 'mouseover';
myObject['Place'] = 'click';
for (var i in myObject)
{
alert('myObject[\''+i+'\'] is ' + myObject[i])
}
}

Referintele controalelor din asp.net in javascript

Dupa cum bine stiti, controalele ASP.NET sunt randate de obicei cu un alt id pe partea de client decat ce am declarat in codul aspx. Acest lucru se intampla in special atunci cand controlul nostru ste "ascuns" in alte controale (GridView, Repeater). Cand lucram cu ele pe server acest lucru nu e o problema dar pe client acest lucru devine o problema mai ales cand folosim javascripturi.
O solutie este sa hardcodam valorile in Javascript. Dar daca mofificam structura controalelor toata munca noastra va fi data peste cap.
Din fericire exista o solutie mai buna.
Cea mai buna solutie este sa folosim cod ASP.NET pentru a introduce id-ul client corect:
<%= TextBox1.ClientID %>

Friday, May 18, 2007

Web Controls ' ID, Client ID, Unique ID

ASP.NET: Controalele Web au un ID, un ClientID si un UniqueID. Care e diferenta dintre ele? Si mai ales, care e scopul lor?

Raspunsul e simplu. Motivul pentru care au controalele web au 3 tipuri de id-uri este unicitatea.
Sa luam un exemplu. Sa spunem ca avem un Repeater in care un itemtemplate contine un textbox si un label. Sa dam si cate un nume acestor doua controale. Sa spunem ca label-ul se numeste "lbl_name" iar textboxul se numeste "txt_quantity". Daca repeater-ul contine mai multe astfel de itemuri, va veti afla in situatia in care mai multe elemente html vor avea acelasi numeIar acest lucru e o problema!
Aici intervine acest UniqueID. Cand un control este creat un id unic este generat pe baza ierarhiei de controale. In cazul nostru , label-ul de exemplu va avea ca si id unic ceva de genul urmator "IdRepeater$lbl_name". Acest UniqueID se construieste pe baza numelui controlului nostru si cel al parintelui sau, separate prin semnul "$". Acest lucru asigura doar unicitatea insa nu este foarte convenabil in a fi folosit. In ajutorul nostru vine insa acest ClientID inlocuind acest separator "$" cu unul valid cum underscore-ul. In acest caz pentru labelul nostru ClientID-ul va arata astfel : "IdRepeater_lblName". Ca urmare a acestui lucru cand label-ul nostru este randat campul ID va contine de fapt valoarea lui ClientID.
Daca doriti sa accesati controlul prin intermediul unui javascript, nu folositi ID-ul si nici UniqueID-ul. Folositi in schimb ClientID-ul.
ConfirmButton.Attributes.Add("OnClick","javascript: alert('The username textbox as a value of " + Username.ClientID + "')";