Friday, March 22, 2013

Getting Query String Values using JavaScript in SharePoint


The JSRequest class is a JavaScript object that lives on all SharePoint Pages, and allows us to simply and quickly get query string values using JavaScript.

It has 3 fields: QueryString, FileName, and PathName.
  • QueryString - is an array of key\value pairs representing the current query string parameters.
  • FileName - is a string containing the current name of the current page.
  • PathName - is the server relative path of the current page.
Usage:

//First we must call the EnsureSetup method
JSRequest.EnsureSetup(); 

//Get a query string parameter called Id. i.e - "page.aspx?Id=11" will return 11
itemId = JSRequest.QueryString["Id"];

//Get the current page name. i.e - "default.aspx"
itemId = JSRequest.FileName;

//Get the current path name. i.e - "/itaysk/doclib/default.aspx"
itemId = JSRequest.PathName;



Ref: http://blogs.microsoft.co.il/blogs/itaysk/archive/2008/11/30/getting-query-string-parameters-with-javascript-in-sharepoint.aspx

https://www.nothingbutsharepoint.com/sites/devwiki/SP2007Dev/Pages/SharePoint%20JavaScript%20Functions%20Overview.aspx

Pass parameter to redirect url in GenFireServerEvent SharePoint 2010


Many users try to redirect the page to custom page with custom query string after clicking the save button in list forms. Most of the websites give below solution to use custom button which just redirect to page.


Instead of using the default sharepoint buttons:

<SharePoint:SaveButton runat="server" ControlMode="Edit" id="savebutton1" Text="OK"/>

<SharePoint:GoBackButton runat="server" ControlMode="Edit" id="gobackbutton2"/>


replace them with this:

<input type="button" class="ms-ButtonHeightWidth" value="OK" name="btnSave" onclick="javascript: {ddwrt:GenFireServerEvent('__commit;__redirect={}')}" />



<input type="button" class="ms-ButtonHeightWidth" value="Cancel" name="btnCancel" onclick="javascript: {ddwrt:GenFireServerEvent('__redirect={}')}" />



Note:
       - You can put any URL in __redirect={} that you want, for example __redirect={http://www.google.com} or __redirect={/news/PressReleases/}
       - There should be no quotes around the URLs passed into the __redirect directive.

The above solution works fine when you have static pages. But how can you pass parameter to redirect url? 

Consider; I have a page "listPage.aspx" with two radio button(View, Update), one save button and one cancel button. User opens "listPage.aspx" page and selects either View or Update radio button and clicks on save. I need to redirect the page based on the user selected value in query string like "Admin.aspx?action=<selected value>". 

Solution to pass parameter to redirect url:

1. Include jQuery reference in your list form using SharePoint Designer. In our case, page is "listPage.aspx".
2. Replace the SharePoint default buttons with input field. Eg: 

<input class="ms-ButtonHeightWidth" id="btnSave" onclick="javascript: {ddwrt:GenFireServerEvent('__commit;__redirect={}')}" type="button" value="OK" />



<input class="ms-ButtonHeightWidth" id="btnCancel" onclick="javascript: {ddwrt:GenFireServerEvent('__redirect={/Pages/Home.aspx}')}" type="button" value="Cancel" />



3. Place the below script inside contentplaceholders. [Tip: look for script tag in the page and place the code]

$(document).ready(function () {
  $("input:radio[name=theme]").change(function() {
    var value = $(this).val();
var onclick=$('#btnSave').attr('onclick');
onclick=onclick.split('{')[0]+'{/Pages/Admin.aspx?action='+value+'}\')';
$('#btnSave').attr('onclick',onclick);
});

});

Here "theme" is the radio button group name. 

Thats it !!!!! You are done!

The code 

var onclick=$('#btnSave').attr('onclick');
onclick=onclick.split('{')[0]+'{/Pages/Admin.aspx?action='+value+'}\')';
$('#btnSave').attr('onclick',onclick);

plays the trick, manipulates the button's onclick attribute value.

Wednesday, March 20, 2013

Enable Design view in Visual Studio 2010

I was creating a visual webpart using Visual Studio 2010 for SharePoint 2010 in dev server. After adding a Visual webpart to my SharePoint project, it showed me HTML Source page and there was no option for switching to Design page.

To Enable Design View:
1. Goto Tools -> Options in Visual Studio 2010
2. Navigate to HTML Designer -> General
3. "Check" the option Enable HTML designer
4. Restart the visual studio 2010


Heard that many developers face the same. Hope this info would be useful.  

Please find the below screen shot for reference;