Take the 2-minute tour ×
SharePoint Stack Exchange is a question and answer site for SharePoint enthusiasts. It's 100% free, no registration required.

Sorry for the long post. This has been killing me. I had this script working perfectly fine in SharePoint 2010 (online) and basically i have a source custom list (list A) with a hyperlink column and a Destination List with say title and my name.

Source List (list A) looks like this with these 2 columns

enter image description here

Each of these links link to the actual list item in the destination list, so for example, link 1 is /sites/2013DevSite/Lists/Destination%20List/EditForm.aspx?ID=1

So basically i want anytime the Link are clicked that point to another list's item to open in a modal dialog and the script below worked perfectly fine in SharePoint 2010 (online)

enter image description here

All it does is find the href tags for that particular value Editform.aspx and the pop modal works in SP 2010 online. So the site page is designed in such a way there is a content editor web part with the reference to this javascript file and the sharepoint list is right beneath it and this worked perfectly opening in modal windows in SP 2010.

Since migration to 2013, this is what exactly happens

1.) when you come to the site page, the modal works, 2.) If you filter or sort on say the Title or Test Link column in Source list (lets say you select the Value A), the script does not fire at all, if i hover over the hyperlink, the who hyperlink is shown and does not open the hyperlink in the modal pop up.

Could someone please let me know what am i doing wrong and thanks for all the help.

Once again i am trying to open a sharepoint list item from another list using Jquery

share|improve this question
    
This could be due to MDS (minimal download strategy) in SP 2013. Have you tried to deactivate the Minimal Download feature? –  Robert Lindgren Jan 14 at 17:17
    
Robert, thanks for your reply, this is on Office 365 sharepoint 2013 online and i am aware of the nastly bugs with the MDS. Can we disable it online. If you know, please do share and thanks again –  RameshSeth Jan 14 at 17:20
    
Should be available in Site Settings -> Manage site features according to office.microsoft.com/en-us/…. If you find out MDS is the problem, I do recommend that you MDS-proof your script : blogs.technet.com/b/sharepointdevelopersupport/archive/2013/02/… –  Robert Lindgren Jan 14 at 17:32
    
Thanks Robert, i just deactivated the feature and testing it, will let you know what i find before MDS proofing my script and thanks a bunch again. –  RameshSeth Jan 14 at 17:38
    
Alas, didnt work, i deactivated the feature and tried, same issue, on load perfect, but once i filter, then the hyperlink wont work. Interesting if i edit page, then say click hyperlink, works, i filter and then also it works. so on edit page everything works fine, normal mode only on first pass, once you sort, does not work. so frustrating –  RameshSeth Jan 14 at 17:46

2 Answers 2

Robert is right, its an async issue. You could probably fix it by adding a setTimeout or something.

In SP2013 you have JSLink, and it will fix your problem.

Here is an example for your scenario:

var SharePointStackExchange = SharePointStackExchange || {};

SharePointStackExchange.CustomizeFieldRendering = function () {
    var overrideCtx = {
        Templates: {
          Fields: {
            'Test_x0020_Link': { 
              'View' : SharePointStackExchange.ChangeHyperLink
            }
          }
        }
      };


    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(overrideCtx);
}

SharePointStackExchange.ChangeHyperLink = function (ctx) {
  var output = [];

  var onClick = "javascript:SharePointStackExchange.ShowInModal('" + ctx.CurrentItem.Test_x0020_Link +"');";

  output.push('<a href="javascript:void(0);" onclick="'+ onClick +'" >' + ctx.CurrentItem["Test_x0020_Link.desc"] +'</a>');

  return output.join('');
}


SharePointStackExchange.ShowInModal = function (href) {
    SP.UI.ModalDialog.showModalDialog({title:"Edit Item",url:href});
};

SharePointStackExchange.CustomizeFieldRendering();

You'll have to add some check for EditForm in .ChangeHyperLink etc.

share|improve this answer
    
Thanks Anders, i opened a ticket with a microsoft and i got confirmation that the new sorting and filtering using Ajax is messing it up. Let me see what i get from them, but will try your approach too Anders thanks –  RameshSeth Jan 22 at 18:55
up vote 0 down vote accepted

Thanks to you folks for trying to help. really appreciate that. i got a final script from microsoft where they relaized this was an issue with SP 2013 and wanted to post the modified code that works

<script type="text/javascript" src="/test/shared documents/jquery-1.10.2.min.js"></script>
<script type="text/javascript">

    $(function ()
    {
        function initialize()
        {
            for (var vid in g_ViewIdToViewCounterMap)
            {
                var ctx = window["ctx" + g_ViewIdToViewCounterMap[vid]];
                var temp = ctx.onViewReRenderCompleted;
                ctx.onViewReRenderCompleted = onViewReRenderCompleted;

                modifyLinksToPopups(ctx);
            }
        }

        function onViewReRenderCompleted(ctx)
        {
            modifyLinksToPopups(ctx);

            // wire another 'onViewReRenderCompleted' event as the API nulls it out after every invocation
            setTimeout(function ()
            {
                ctx.onViewReRenderCompleted = onViewReRenderCompleted;
            }, 10);
        }

        function modifyLinksToPopups(ctx)
        {
            if (ctx.clvp && ctx.clvp.wpq)
            {
                var webParId = ctx.clvp.wpq;
                var linkLookup = 'a[href*="EditForm.aspx"]';

                $('#' + webParId).find(linkLookup).each(function (i, link)
                {
                    var href = link.href;
                    link.href = '#'; // use hash to avoid seeing javascript in status bar

                    link.onclick = function ()
                    {
                        showInModal(href, 'Edit Item'); // title = 'Edit Item'

                        // always return false when '#' is used as href.
                        return false;
                    };
                });
            }
        };

        function showInModal(href, title)
        {
            SP.UI.ModalDialog.showModalDialog({ title: title, url: href });
        };

        initialize();
    });


</script>

One spot where it does not work however is if the items are grouped in the view...if i can find a solution for that will post as well

share|improve this answer
    
One thing to note is this code above works perfectly on IE 10. on IE 8 on page load does not work, i even tried the executeordelayuntilscriptloaded and no use. but interestingly the above code works once you filter..IE 10 the above code is fine, IE 8 has issues. just FYI –  RameshSeth Jan 23 at 18:41

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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