8

I have a page in which I have placed XsltListView web part to show the view of the picture library.

Above that view I have placed a link using Content Editor Web Part which redirects to other web page with the query string parameter.

The function of OnClick event of the link in Content Editor Webpart is defined in the separate JavaScript file in Style Library.

I want to get selected item ids in the JavaScript and send it as query string parameters to the other page.

HTML tag in the content editor web part is:

<a onclick="redirectToDownloadsPage()" href="#"> Download Images </a>   

The function which is in separate JavaScript file is:

function redirectToDownloadsPage() {

    var ctx = SP.ClientContext.get_current();
    var items = SP.ListOperation.Selection.getSelectedItems(ctx);
    var myItems = '';
    var i;

    for (i in items) {
        myItems += '|' + items[i].id;
    }

    if (myItems) {        
        var siteUrl = url = window.location.protocol + "//" + window.location.host + _spPageContextInfo.siteServerRelativeUrl + "/_layouts/15/DownloadImages.aspx?Items=" + myItems;        
        window.location.href = siteUrl
    }
    else {
        alert("Select atleast one item");
    }
}

My problem is that if I place the above script in Content Editor Web part, it works fine, but if put it in the other JavaScript file and load in the page then its not working.

I am getting items blank, i.e. there is not value fetched in the items.

What am I missing?

4
  • Can you please provide additional info such as: where is "the other JavaScript file" located?; How are you referencing that file?; May 10, 2014 at 13:53
  • The JavaScript file is located to the Style Library and I am loading that file by putting the <script> tag in the PlaceHolderAdditionalPageHead in the Page Layout. My tag is : <script type="text/javascript" language="javascript" src='<asp:Literal runat="server" Text="<%$SPUrl:~SiteCollection/Style Library/Scripts.js%>" />'></script> And I checked that the Scripts.js is loaded success fully on the page. @AmadeoGallardo
    – users1100
    May 12, 2014 at 7:06
  • Is anything wrong in my way to load JavaScript from the Style Library?
    – users1100
    May 12, 2014 at 8:51
  • Have you tried navigating to the URL where the script is located, and seeing if it loads properly? You should basically see all the code on the screen... May 12, 2014 at 14:07

4 Answers 4

1

Here is what I would do to debug and find the root cause:

  • Open the page in Firefox (suggestion, it can be any browser with a JS console, I usually use Firebug)
  • Open the Console
  • Manually call the function in the Console:

SP.ListOperation.Selection.getSelectedItems(SP.ClientContext.get_current())

  • Check if any value is returned
  • If there is no value, my suggestion would be to wrap the whole function in ExecuteOrDelayUntilScriptLoaded (as maybe SP.js isn't loaded for some reason): ExecuteOrDelayUntilScriptLoaded with sp.js when in debug mode Object Expected
  • If there is a value, then the problem relies in other parts of your function
  • Continue by typing redirectToDownloadsPage (no parenthesis, just to see if the function exists)
  • Is the function registered on the client side?
  • If it is, call it by doing redirectToDownloadsPage()
  • Does it work now?

https://developer.mozilla.org/en-US/docs/Debugging_JavaScript

1

How about calling function after some time delay.

You can use two method of time event in javascript.i.e.

setInterval(): executes a function, over and over again, at specified time intervals setTimeout() : executes a function, once, after waiting a specified number of milliseconds

If you use siteTimeout then you can delay calling execution by certain time.

1

Have you tried to make sure that your code run after the sp.js loaded? Such as:

function redirectToDownloadsPage() {
    SP.SOD.executeFunc('sp.js', 'SP.ClientContext', function () {
        var ctx = SP.ClientContext.get_current();
        var items = SP.ListOperation.Selection.getSelectedItems(ctx);
        var myItems = '';
        var i;

        for (i in items) {
            myItems += '|' + items[i].id;
        }

        if (myItems) {        
            var siteUrl = url = window.location.protocol + "//" +         
            window.location.host + _spPageContextInfo.siteServerRelativeUrl + "/_layouts/15/DownloadImages.aspx?Items=" + myItems;        
            window.location.href = siteUrl
        }
        else {
            alert("Select atleast one item");
        }
    });
}
0

Check this code I've used in another answer:

$(document).ready(function() {
    getProjects();

});

function getProjects() {      
    alert("get items");      
    var clientContext = SP.ClientContext.get_current(); 
    var oList = clientContext.get_web().get_lists().getByTitle('ProjectProfile');
    var camlQuery = new SP.CamlQuery();
    camlQuery.set_viewXml('1');    
    this.collListItem = oList.getItems(camlQuery);   
    clientContext.load(collListItem, 'Include(ID, Project, ProjectName, Active, Created)');
    clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));
}

function onQuerySucceeded(sender, args) {   
    alert("SUCCESS");
    var listItemInfo = '';
    var listItemEnumerator = collListItem.getEnumerator();        
    while (listItemEnumerator.moveNext()) {
        var oListItem = listItemEnumerator.get_current();

        var iden = oListItem.get_item("ID");
        alert("id: " + iden);           
        var proyecto = oListItem.get_item("Project");
        alert("proyecto: " + proyecto);

        var nombre = oListItem.get_item("ProjectName");
        alert("name: " + nombre);

        var activo = oListItem.get_item("Active");
        alert("active: " + activo);

    }       
    alert("FIN");
}

function onQueryFailed(sender, args) {
    alert("FAIL");
    alert('Cannot: ' + args.get_message() + '\n' + args.get_stackTrace());
}

It's more safe to manipulate your page, once the entire page (images or iframes), not just the DOM is ready, that's the reason for starting with the first method:

$(document).ready(...)

Remember to add the script tags for the following libraries:

  • /_layouts/15/MicrosoftAjax.js

  • /_layouts/15/sp.runtime.js

  • /_layouts/15/sp.js

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.