RSS

Tag Archives: Dynamics CRM Multiple Lines of Text

Convert a Multiple Line of Text field to a Button using JavaScript

First of all create a new field of type “Multiple Lines of Text” and name it as “new_button“.
And also create a “JavaScript Webresource” and add the following method in onload event.
ButtonImage
function OnFormLoad() {
    ConvertTextFieldToButton('new_button', 'ButtonText', '100px', ButtonClickFunction, 'Button Label');
}
 
function ConvertTextFieldToButton(fieldname, buttontext, buttonwidth, clickevent, title) {
    if (document.getElementById(fieldname) == null) {
        return;
    }
 
    var functiontocall = clickevent;
    document.getElementById(fieldname).value= buttontext;
    document.getElementById(fieldname).readOnly = true;
    document.getElementById(fieldname).style.borderRight = "#3366cc 1px solid";
    document.getElementById(fieldname).style.paddingRight = "5px";
    document.getElementById(fieldname).style.borderTop = "#3366cc 1px solid";
    document.getElementById(fieldname).style.paddingLeft = "5px";
    document.getElementById(fieldname).style.fontSize = "11px";
    document.getElementById(fieldname).style.backgroundImage = "url(/_imgs/btn_rest.gif)";
    document.getElementById(fieldname).style.borderLeft = "#3366cc 1px solid";
    document.getElementById(fieldname).style.width = buttonwidth;
    document.getElementById(fieldname).style.cursor = "hand";
    document.getElementById(fieldname).style.lineHeight = "18px";
    document.getElementById(fieldname).style.borderBottom = "#3366cc 1px solid";
    document.getElementById(fieldname).style.backgroundRepeat = "repeat-x";
    document.getElementById(fieldname).style.fontFamily = "Tahoma";
    document.getElementById(fieldname).style.height = "20px";
    document.getElementById(fieldname).style.backgroundColor = "#cee7ff";
    document.getElementById(fieldname).style.textAlign = "center";
    document.getElementById(fieldname).style.overflow = "hidden";

    if(window.attachEvent)
    {
        document.getElementById(fieldname).attachEvent("onmousedown", MouseDown_button);
        document.getElementById(fieldname).attachEvent("onmouseup", MouseUp_button);        
        document.getElementById(fieldname).attachEvent("onclick", functiontocall);
    }
    else
    {
        document.getElementById(fieldname).addEventListener("mousedown", MouseDown_button, false);
        document.getElementById(fieldname).addEventListener("mouseup", MouseUp_button, false);        
        document.getElementById(fieldname).addEventListener("click", functiontocall, false);
    }

    document.getElementById(fieldname).style.lineHeight = "14px";
    document.getElementById(fieldname + '_c').style.visibility = 'hidden';
    document.getElementById(fieldname + '_d').style.width=buttonwidth;
    document.getElementById(fieldname +'_container').style.width="112px";
    document.getElementById(fieldname).title = title;
    window.focus();
 
    //Method Call on Mouse down
    function MouseDown_button(evt) {
       var eventer;   
  
       if(evt.srcElement)
       {
           eventer = evt.srcElement;
       }
       else
       {
           eventer = evt.target;
       }

       eventer.style.borderWidth = "2px";
       eventer.style.borderStyle = "groove ridge ridge groove";
       eventer.style.borderColor = "#3366cc #4080f0 #4080f0 #3366cc";
    }
 
    //Method Call on Mouse up
    function MouseUp_button(evt) {
       var eventer;   
  
       if(evt.srcElement)
       {
           eventer = evt.srcElement;
       }
       else
       {
           eventer = evt.target;
       }
        
       eventer.style.border = "1px solid #3366cc";
    }
}
 
function ButtonClickFunction() {
    //Method call on button click
}

Notes:
It also supports single line of text.

By Puja Jain
Senior Software Engineer @Team DynamicsCRM.
Mindfire Solutions

 
5 Comments

Posted by on April 25, 2013 in WebResources

 

Tags: , , , , , , , , , , , , , , , ,

 
%d bloggers like this: