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.