How to check MS Office version of client machine and edit documents on the fly.

My friend asked me that he has a document repository site in sharepoint and wants to edit the documents online.

 Much like the “edit in Microsoft Word” option of sharepoint, but he needed to do that programmatically.

Such features are available in MS Office 2007 version.So, my friend first needed to check the MS Office version of the client machine. As you know, it is very difficult to get software information of the client machine through web applications.

My friend tried various options,he checked the registry but it only returned the servers information not the clients.

After searching the net for long, the sharepoint upload page gave him a good idea.

He noticed that the “Upload multiple files” is shown in some versions and not in others. Digging deep he found the “Upload Multiple Documents” feature is an ActiveX control that installs with Office 2003/2007 so if you aren’t running either Office versions then the option won’t show up in SharePoint. This ActiveX control is called STSUpld.UploadCtl.

Now that we know which activeX control to call to check the version of office, now we need to edit the document online as it can be done through “Edit in Microsoft office word”.

After seraching the net, I found an ActiveX control that allows users to edit documents with their associated applications in the context of Microsoft Windows SharePoint Services called OpenDocuments Control.

So, in the final code, first we check whether STSUpld.UploadCtl exists or not and then we call OpenDocuments axtiveX to edit the document on the fly.

The javascript for this is shown below:

function EditDoconFly(strDocument){var objEditor;var objactivex; try{if(objactivex = new ActiveXObject(‘STSUpld.UploadCtl’)){objEditor = new ActiveXObject(‘SharePoint.OpenDocuments.1′);if(objEditor){ objEditor.EditDocument(strDocument, ”); }else{ alert(‘Cannot edit documents on fly below Microsoft Office 2007′);  }objactivex = ”;objEditor=”;}else{alert(‘Cannot edit documents on fly below Microsoft Office 2007′);}}catch(e){alert(‘Cannot edit documents on fly below Microsoft Office 2007′);} return false;} 

 

Default Text Field Values That Disappear on Focus

We often see sites which has a text box with some default value, mostly in grey and when we click inside the textbox, the default value disappears and we can type in, similarly if we click elsewhere in the page the default value again re-appears.

This can be achieved very simply using javascript where we display the default data on onblur event and it disappears on onfocus event, see the illustration below:

Suppose I have a html textbox as follows,

<input id=”txtBizFocus” runat=”server” name=”txtBizFocus” autocomplete=”off” type=”text”  enableviewstate=”true”/>

 Now, I have to check whether txtBizFocus is empty or not, if it is empty include the default value in grey color. Now, if the user clicks inside the textbox txtBizFocus, the default value should disappear and the user should be able to type inside in font-color black.

 if (txtBizFocus.Value == “”)

txtBizFocus.Value = “<type here or select>”;

if (txtBizFocus.Value == “<type here or select>”)

{

    txtBizFocus.Style.Add(“color”, “#808080″);

 

}

else

{

    txtBizFocus.Style.Add(“color”, “black”);

}

 txtBizFocus.Attributes.Add(“onfocus”, “  var txtBizFocus = document.getElementById(‘” + txtBizFocus.ClientID + “‘); if(txtBizFocus.value==’<type here or select>’){txtBizFocus.value=”; txtBizFocus.style.color=’black’;};”);

 

txtBizFocus.Attributes.Add(“onblur”, “  var txtBizFocus = document.getElementById(‘” + txtBizFocus.ClientID + “‘); if(txtBizFocus.value==”){txtBizFocus.value=’<type here or select>’; txtBizFocus.style.color=’#808080′;};”);

 

 So, when the page loads, txtBizFocus comes with a default value “<Type here or select>” in grey color, the moment user clicks inside the textbox(onfocus) the writing disappears and becomes blank so that the user can type in black(this is checked in the above code, where we check if the value inside txtBizFocus is not the default value, change color to black).

 

Workaround for using modal popup windows

We know that to open a pop-up we use window.open( [sURL] [, sName] [, sFeatures] [, bReplace]).

But, what if we want to open it as a modal window? We can use window.showModalDialog(sURL [, vArguments] [, sFeatures]).

But this approach has certain disadvantages, your client side script does not always behave the way it should otherwise.

So the best possible approach to open a modal pop-up window is,

From your page, open a normal popup as
window.open(‘/_layouts/OpenOpUp.aspx?Mode=New’, ‘pop1′,‘left=80, top=50, center=yes, height=480, width=450,status= no, resizable= no, scrollbars=yes, toolbar=no, location=no,menubar=no’); 

Now, in the modal popup window(here, OpenOpUp.aspx) in the body tag write,

<body onblur=”self.focus()”>

Your job is done, now it will behave as a modal popup window as it will have focus on itself and you have to close the page to get back to the parent page (either through javascript or by clicking the cross button at top) and all your client side scripts will work just fine.