3

I have a Display View (ListFormWebPart) of an Item with a related items list on SP2013. This related view shows 10 items per page and as standard there is the naviagation to see other items:

enter image description here

Once I click on the arrow i get the following javascript error on line 1063 of core.js (h.style.display = "";):

Uncaught TypeError: Cannot read property 'style' of null
  SPAnimUtil_TableAnimator.AnimatePaging   @ core.js?rev=eO228IFs9%2B4m4mcGscwRoQ%3D%3D:formatted:1063
  AnimateListDelta                         @ inplview.js?rev=3adeDef4Nq%2BgGmCxJ9kLlA%3D%3D:1
  ReRenderListView                         @ inplview.js?rev=3adeDef4Nq%2BgGmCxJ9kLlA%3D%3D:1
  CLVPRefreshCore.c.onreadystatechange     @ inplview.js?rev=3adeDef4Nq%2BgGmCxJ9kLlA%3D%3D:1

and the empty list which tells that there are no items to show...even if there should be:

enter image description here

Removing the connection between the two WebParts it works.

EDIT1:

The javascript function involved is the following:

 SPAnimUtil_TableAnimator.prototype.AnimatePaging = function(b, c, g) {
    this.IncrementRefCount();
    var f = this.tableElement.parentNode.style.overflow;
    this.tableElement.parentNode.style.overflow = "hidden";
    SetOpacity(this.tableElement, 0);
    var a = this.tbody
      , h = a.nextSibling;
    h.style.display = ""; //--> since h is null it rises the exception
    this.footer = c;
    SetOpacity(this.footer, 0);
    this.footer.style.display = "";
    a.parentNode.removeChild(a);
    var d = new SPAnimation.State;
    d.SetAttribute(SPAnimation.Attribute.Opacity, 1);
    var k = new SPAnimation.Object(SPAnimation.ID.Basic_QuickShow,0,c,d,null ,null );
    k.RunAnimation();
    var i = b ? 100 : -100;
    SPAnimationUtility.BasicAnimator.PositionRelativeExact(this.tableElement, null , i, null , null );
    var j = this
      , e = new SPAnimation.State;
    e.SetAttribute(SPAnimation.Attribute.Opacity, 1);
    var l = new SPAnimation.Object(b ? SPAnimation.ID.Content_SlideInFadeInLeftInc : SPAnimation.ID.Content_SlideInFadeInRightInc,0,this.tableElement,e,function() {
        j.ResetPagingAnimation(f);
        g()
    }
    ,null );
    l.RunAnimation()
};

Debugging I found out that the problem could be the query to the server made in inplview.js which returns no items. The query is the following:

"http://mySP/mySite/_layouts/15/inplview.aspx?List={A57192AA-80F8-4C4E-91DA-94131DCC2F47}&View={71BB6CD7-4A38-4E72-BFC7-7ED3371A9F28}&ViewCount=120&IsXslView=TRUE&IsCSR=TRUE&Paged=TRUE&p_Created=20150713%2010%3a43%3a21&p_ID=16938&PageFirstRow=11&FilterField1=Betrieb&FilterValue1=305&FilterLookupId1=1"

Removing the connection between the parts (removing the "related") the query to the server is:

"http://mySP/mySite/_layouts/15/inplview.aspx?List={A57192AA-80F8-4C4E-91DA-94131DCC2F47}&View={71BB6CD7-4A38-4E72-BFC7-7ED3371A9F28}&ViewCount=120&IsXslView=TRUE&IsCSR=TRUE&Paged=TRUE&p_Created=20150713%2010%3a43%3a21&p_ID=16938&PageFirstRow=11"

and it works. Due to this, ...what should I do?

EDIT2:

For a test I went into the main View of the list and used the same filter:

http://mySP/mySite/Lists/myList/AllItems.aspx?&FilterField1=Betrieb&FilterValue1=305&FilterLookupId1=1

It behavies in the same way. It shows 30 items, below the nagivation to the other items....by clicking the second page i get the empty list, in this case no errors.

When I edit the query as follows, it works:

http://mySP/mySite/Lists/myList/AllItems.aspx?&FilterField1=Betrieb&FilterValue1=AFilterValue

Edit (26.03.2018) Problem has not been resolved yet, we opened a support ticket by Microsoft. It seems the problem is starting to affect other peoples farm too.

Improve this question

2 Answers 2

Reset to default
2

Temporary solution/quick resolution: This error will occur when you have "Title linked with edit" field selected in your view. Remove this and hopefully it should start working fine.

Long term solution: This happened due to misconfiguration in the list by any custom code trying to modify this. Unfortunately there is no direct way to identify the issue and has to be rectified manually by checking your solution files.

Improve this answer
3
  • Temporary solution/quick resolution does not work, removing the LinkTitle and/or the Edit the problem persists. What do you mean with ...custom code trying to modify this...? Commented Apr 28, 2016 at 12:17
  • Custom code involves any CSR script injections or custom solutions making modifications in the specified list. When SharePoint tries to link the specific item with its internal ID in core.js its not able to identify the element, this is the root cause for this error. For the problem temporary solution not working, you can try removing any other OOB fields included in the view which is pointing to Dispform or Edit form (title linked with display/edit). Commented Apr 29, 2016 at 7:26
  • There is no custom code...I tryied many things, but the problem is the query itself: the parameter FilterLookupId1=1 is not recognized by the called service. Commented May 17, 2017 at 13:21
1

I opened a ticked by Microsoft, after few weeks they told me that the Lookupfield of the Lookupcolumn must refer to the ID. When selecting another one, the related items list does not work. Doing so it works, but in my opinion it does not make much sense. I tested it also on a new SharePoint 2016 installation (without updates) and it behavies the same, this means that the problem does not appear by installing a CU. Unfortunately I can't test it on the ols 2013 farm.

Since I did not like this entire scenario, I decided to go further and debug the javascript code. I ended up that the error was given due to the fact that the query to the server returns an invalid response, because the server does not handle the FilterLookupId1=1 parameter.

Problem:

Let's taks this FilterField1=Customer&FilterValue1=305&FilterLookupId1=1 as example:

  • The field is Customer
  • The value is 305
  • FilterLookupId1=1 is used to tell the system to look the id and not the value

So, since the server does not handle the FilterLookupId1=1 param, it tries to match 305 with the value field...and obviously it doesn't find anything.

My Solution:

The idea is to intercept these server calls and edit the query. Considering the above example, I tryied to change the query to FilterField1=CustomerID&FilterValue1=305. I simply removed the FilterLookupId1=1 and added the ID to the field. Yes, in this way it works fine, obviously I hade to add the field CustomerID (Lookup columns related to the Customer).

Since I did not want to modify the original Microsoft JS code, I decided to edit the master page, I added followings:

<script>
   SP.SOD.registerSod("CustomScript.js", "/SiteAssets/CustomScript.js");
   SP.SOD.registerSodDep("CustomScript.js", "core.js");
   SP.SOD.registerSodDep("CustomScript.js", "inplview.js");
   SP.SOD.executeFunc('CustomScript.js', null, function(){});
</script>

Short explanation: I register my script and tell the system that core.js and inplview.js have to be loaded before CustomScript.js. The last line is a call that my script gets loaded (did not find a nicer solution).

This is the CustomScript.js:

function customSharePointListRestUrlBuilder() {
    var v;
    this.setHttpRoot = function(a) {
        v = a
    };
    var x = false;
    this.setUseRest = function(a) {
        x = a
    };
    var e = false;
    this.setIsClientRendering = function(a) {
        e = a
    };
    var t = false;
    this.setIsEcbInfo = function(a) {
        t = a
    };
    var g;
    this.setListName = function(a) {
        g = a
    };
    var w;
    this.setListUrl = function(a) {
        w = a
    };
    var d;
    this.setView = function(a) {
        d = a
    };
    var y;
    this.setCtxId = function(a) {
        y = a
    };
    var u = false;
    this.setIsXslView = function(a) {
        u = a
    };
    var q;
    this.setOverrideSelectCommand = function(a) {
        q = a
    };
    var c;
    this.setOverrideFilterQstring = function(a) {
        c = a
    };
    var i;
    this.setOverrideScope = function(a) {
        i = a
    };
    var f;
    this.setSearchTerm = function(a) {
        f = a
    };
    var r = false;
    this.setIsFullListSearch = function(a) {
        r = a
    };
    var h = false;
    this.setIsRealHttpRoot = function(a) {
        h = a
    };
    var k;
    this.setRootFolder = function(a) {
        k = a
    };
    var j;
    this.setInGridMode = function(a) {
        j = a
    };
    var o;
    this.setCmd = function(a) {
        o = a
    };
    var p = false;
    this.setShouldCascadeDeleteWarningMessage = function(a) {
        p = a
    };
    var m;
    this.setWebPartID = function(a) {
        m = a
    };
    var a;
    this.setGroupString = function(b) {
        a = b
    };
    var b;
    this.setPagingParams = function(a) {
        b = a
    };
    var l;
    this.setSortField = function(a) {
        l = a
    };
    var n;
    this.setSortDir = function(a) {
        n = a
    };
    var s = false;
    this.setIgnoreQString = function(a) {
        s = a
    };
    var z = "";
    this.setMountPointUrl = function(a) {
        z = a
    };
    this.buildUrl = function() {
        var z = new URI(URI_Encoding.escapeUrlForCallback(v))
          , B = z.getPath();
        if (x)
            if (!h) {
                if (Boolean(g))
                    B += "/_api/web/lists/getById('" + g;
                else
                    B += "/_api/web/GetList('" + w;
                z.setPath(B + "')/RenderListDataAsStream");
                Boolean(d) && z.setQueryParameter("View", d)
            } else
                z.setPath(B + "/_api/SP.Requestcontext.Current/GetRemoteContext/list/RenderListDataAsStream");
        else {
            z.setPath(B + "/_layouts/15/inplview.aspx");
            z.setQueryParameter("List", g);
            d != null && z.setQueryParameter("View", d);
            z.setQueryParameter("ViewCount", y);
            u && z.setQueryParameter("IsXslView", "TRUE");
            e && z.setQueryParameter("IsCSR", "TRUE")
        }
        q && z.setQueryParameter("HasOverrideSelectCommand", "TRUE");
        var E = null;
        if (typeof c != "undefined")
            E = c.match(RegExp("OverrideScope=[^&]*"));
        typeof i != "undefined" && E == null && z.setQueryParameter("OverrideScope", i);
        typeof c != "undefined" && D(z, c);
        if (e) {
            var H = new URI(Nav.ajaxNavigate.get_href(),{
                disableEncodingDecodingForLegacyCode: true
            });
            z.setQueryParameter("ListViewPageUrl", URI_Encoding.encodeURIComponent(H.getStringWithoutQueryAndFragment(), false))
        }
        typeof f != "undefined" && f != null && z.setQueryParameter("InplaceSearchQuery", URI_Encoding.encodeURIComponent(f, true));
        r && z.setQueryParameter("InplaceFullListSearch", "true");
        if (h) {
            var F = ListModule.Util.makeMountedFolderQueryStrParams(true, false);
            D(z, F)
        }
        e && t && z.setQueryParameter("IsRibbon", "TRUE");
        Boolean(k) && z.setQueryParameter("RootFolder", URI_Encoding.encodeURIComponent(k, true));
        Boolean(o) && z.setQueryParameter("Cmd", o);
        var C = false;
        if (Boolean(b))
            for (var A in b) {
                if (A == "List" || A == "View" || A == "ID")
                    continue;
                if (A == "ShowInGrid") {
                    C = true;
                    z.setQueryParameter("ShowInGrid", Boolean(j) ? "True" : "False")
                } else if (A == "GroupString" && (Boolean(a) || a == ""))
                    z.setQueryParameter("GroupString", a);
                else
                    z.setQueryParameter(A, b[A])
            }
        Boolean(j) && !C && z.setQueryParameter("ShowInGrid", "True");
        Boolean(m) && z.setQueryParameter("WebPartID", m);
        p && z.setQueryParameter("CascDelWarnMessage", "1");
        if (Boolean(a) || a == "") {
            !b.hasOwnProperty("IsGroupRender") && z.setQueryParameter("IsGroupRender", "TRUE");
            z.setQueryParameter("DrillDown", "1");
            !b.hasOwnProperty("GroupString") && z.setQueryParameter("GroupString", a)
        }
        Boolean(l) && z.setQueryParameter("SortField", l);
        Boolean(n) && z.setQueryParameter("SortDir", n);
        s && z.setQueryParameter("IgnoreQString", "TRUE");
        var G = z.getString();

        //CUSTOM START
        if (G.indexOf('FilterLookupId') >= 0 && GetUrlKeyValue('ID')){
            var splitted = G.split('FilterLookupId');
            var counter = splitted[1][0];
            G = G.replace('FilterLookupId'+counter+"=1&", '');

            var values = G.split('&');
            for(var i = 0; i < values.length; ++i){
                if (values[i].startsWith('FilterField'+counter)){
                    G = G.replace(values[i], values[i]+"ID");
                    break;
                }
            }
        }
        //CUSTOM END

        return G;
        function D(e, c) {
            if (Boolean(c))
                for (var d = c.split("&"), b = 0, f = d.length; b < f; b++) {
                    var a = d[b].split("=");
                    Boolean(a[0]) && e.setQueryParameter(a[0], a[1])
                }
        }
    }
}


SP.SOD.executeOrDelayUntilScriptLoaded(function () {

    /* Client side rendering sorting fix START */
    var customRefreshPagingEx = function(c, a, b) {
        if (a != null){
            this.tBody = document.getElementById(a);
        }

        //CUSTOM START
        if (c.indexOf('&&') >= 0){
            c = c.replace(/&&/g, '&');
        }
        if (c.indexOf('FilterLookupId') >= 0){
            var splitted = c.split('FilterLookupId');
            var counter = splitted[1][0];
            var replace = 'FilterLookupId'+counter;
            if (c.indexOf(replace+"=1&") >= 0){
                replace += "=1&";
            }
            var regex = new RegExp(replace, "g")
            c = c.replace(regex, '');

            var values = c.split('&');
            for(var i = 0; i < values.length; ++i){
                if (values[i].startsWith('FilterField'+counter)){
                    var regex = new RegExp(values[i], "g")
                    c = c.replace(regex, values[i]+"ID");
                    break;
                }
            }
        }
        //CUSTOM END

        return this.RefreshPagingEx(c, true, null, b)
    }

    var intervalFindClvp = setInterval(function(){

        if (window.FindClvp){

            var customFindClvp = function(c) {
                if (typeof standaloneCtx != "undefined") {
                    var b = standaloneCtx;
                    if (!Boolean(b.clvp)) {
                        b.clvp = new CLVP(b);
                        b.clvp.Init()
                    }
                    return b.clvp
                } else {
                    var a = c;
                    while (a != null) {
                        if (a.tagName == "TABLE")
                            if (a.clvp != null)
                                break;
                        a = a.parentNode
                    }
                    var clvp =  a != null ? a.clvp : null;
                    if (clvp){
                        clvp.RefreshPaging = customRefreshPagingEx;
                    }
                    return clvp;
                }
            }
            window.FindClvp = customFindClvp;
            clearInterval(intervalFindClvp);
        }
    }, 100);
    /* Client side rendering sorting fix END */


    /* Client side rendering filtering fix START */
    var intervalTest = setInterval(function(){

        if (window.SharePointListRestUrlBuilder){

            window.SharePointListRestUrlBuilder = customSharePointListRestUrlBuilder;
            clearInterval(intervalTest);
        }
    }, 100);
    /* Client side rendering filtering fix END */


    /* Client rendering page navigation fix START */
    var customGetPagingQueryParams = function(e) {

        if (e.indexOf('FilterLookupId') >= 0 && GetUrlKeyValue('ID')){

            var splitted = e.split('FilterLookupId');
            var counter = splitted[1][0];
            var replace = 'FilterLookupId'+counter + "=1";
            if (e.indexOf(replace+"&") >= 0){
                replace += "&";
            }
            e = e.replace(replace, '');

            var values = e.split('&');
            for(var i = 0; i < values.length; ++i){
                if (values[i].startsWith('FilterField'+counter)){
                    e = e.replace(values[i], values[i]+"ID");
                    break;
                }
            }
        }

        for (var d = e.split("&"), c = [], b = 0, b = 0; b < d.length; b++) {
            var a = d[b].split("=");
            if (a[0] == "List" || a[0] == "View" || a[0] == "ID")
                continue;
            if (a.length > 1)
                c[a[0]] = a[1]
        }
        return c
    }
    var intervalPagingQueryParams = setInterval(function(){

        if (window.getPagingQueryParams){

            window.getPagingQueryParams = customGetPagingQueryParams;
            clearInterval(intervalPagingQueryParams);
        }
    }, 100);
    /* Client rendering page navigation fix END */

}, 'inplview.js')


/* Client side rendering query filters fix START */
SP.SOD.executeOrDelayUntilScriptLoaded(function () {

    var intervalAddFilterMenuItems = setInterval(function(){
        if (window.addFilterMenuItems){
            var customAddFilterMenuItems = function(a, b) {
                if (IsFieldNotFilterable(filterTable)){
                    return void addFilteringDisabledMenuItem(a);
                }
                var c = document.getElementById("FilterIframe" + filterTable.getAttribute("CtxNum"));
                if (null != c) {
                    var d = ctxFilter.queryString;
                    if (null != d && "" != d || (d = c.getAttribute("FilterLink")),
                    (null == d || "" == d) && window.alert("Unexpected"),
                    "?" == d) {
                        var e = ajaxNavigate.getParam("InplviewHash" + ctxFilter.view);
                        Boolean(e) && (d += InplViewUtil.DecodeHashAsQueryString(e))
                    }
                    var f = escapeProperly(filterTable.getAttribute("Name"));
                    strFilteredValue = null;
                    var i, j, g = "", h = 0;
                    do {
                        h++;
                        var k = !1;
                        if (i = d.match(new RegExp("FilterField" + String(h) + "=[^&#]*")),
                        Boolean(i) || (i = d.match(new RegExp("FilterFields" + String(h) + "=[^&#]*"))),
                        j = d.match(new RegExp("&FilterValue" + String(h) + "=[^&#]*")),
                        Boolean(j) || (j = d.match(new RegExp("&FilterValues" + String(h) + "=[^&#]*")),
                        k = !0),
                        null != i && null != j) {
                            null == strFilteredValue && (strFilteredValue = getFilterValueFromUrl(i.toString() + j.toString(), f),
                            bIsMultiFilter = k),
                            g = g + "&" + i.toString() + j.toString();
                            var l = d.match(new RegExp("&FilterOp" + String(h) + "=[^&#]*"));
                            null != l && (g += l.toString());
                            var m = d.match(new RegExp("&FilterLookupId" + String(h) + "=[^&#]*"));
                            null != m && (g += m.toString());
                            var n = d.match(new RegExp("&FilterData" + String(h) + "=[^&#]*"));
                            if (null != n && (g += n.toString()),
                            null != m && null == n && null != strFilteredValue)
                                return void addFilteringDisabledMenuItem(a)
                        }
                    } while (null != i);var r, o = null != strFilteredValue, p = StBuildParam(Strings.STS.L_DontFilterBy_Text, filterTable.getAttribute("DisplayName")), q = "javascript:HandleFilter(event, '" + STSScriptEncode(FilterFieldV3(ctxFilter.view, f, "", 0, ctxFilter.queryString, !0)) + "')";
                    r = o ? GetThemedImageUrl("DeleteFilterGlyph.png") : GetThemedImageUrl("DisabledDeleteFilterGlyph.png"),
                    CAMOptFilter(a, b, p, q, r, o, "fmi_clr");
                    CAMOpt(b, Strings.STS.L_Loading_Text, "").setAttribute("enabled", "false"),
                    setTimeout("ShowFilterLoadingMenu()", 500),
                    b._onDestroy = OnMouseOutFilter,
                    i = d.match(new RegExp("MembershipGroupId=[^&]*")),
                    null != i && (g = g + "&" + i.toString()),
                    i = d.match(new RegExp("InstanceID=[^&]*")),
                    null != i && (g = g + "&" + i.toString()),
                    null != g && g.length > 0 ? null != ctxFilter.overrideFilterQstring && ctxFilter.overrideFilterQstring.length > 0 && (g = "&" + ReconcileQstringFilters(g.substring(1), ctxFilter.overrideFilterQstring)) : null != ctxFilter.overrideFilterQstring && ctxFilter.overrideFilterQstring.length > 0 && (g = "&" + ctxFilter.overrideFilterQstring);
                    var u, t = "";
                    null != ctxFilter && null != (u = ctxFilter.clvp) && null != u.rootFolder && u.rootFolder.length > 0 ? t = "&RootFolder=" + URI_Encoding.encodeURIComponent(u.rootFolder) : null != (i = d.match(new RegExp("RootFolder=[^&]*"))) && (t = "&" + i.toString());
                    var v = "";
                    i = g.match(new RegExp("OverrideScope=[^&]*")),
                    null != ctxFilter && void 0 !== ctxFilter.overrideScope && null == i && (v = "&OverrideScope=" + escapeProperlyCore(ctxFilter.overrideScope, !1)),
                    browseris.safari && (c.src = "/_layouts/15/blank.htm",
                    c.style.offsetLeft = "-550px",
                    c.style.offsetTop = "-550px",
                    c.style.border = "0px",
                    c.style.display = "block");
                    if (g.indexOf('FilterLookupId') >= 0){
                        // c.src += "&ProcessQStringToCAML=1";

                        var splitted = g.split('FilterLookupId');
                        var counter = splitted[1][0];
                        var replace = 'FilterLookupId'+counter + "=1";
                        if (g.indexOf(replace+"&") >= 0){
                            replace += "&";
                        }
                        g = g.replace(replace, '');

                        var values = g.split('&');
                        for(var i = 0; i < values.length; ++i){
                            if (values[i].startsWith('FilterField'+counter)){
                                g = g.replace(values[i], values[i]+"ID");
                                break;
                            }
                        }
                    }
                    c.src = ctxFilter.HttpRoot + "/_layouts/15/filter.aspx?ListId=" + ctxFilter.listName + t + v + "&FieldInternalName=" + f + "&ViewId=" + ctxFilter.view + "&FilterOnly=1&Filter=1" + g;
                    bMenuLoadInProgress = !0;
                }
            }
            window.addFilterMenuItems = customAddFilterMenuItems;
            clearInterval(intervalAddFilterMenuItems);
        }
    }, 100);

}, 'core.js')
/* Client side rendering query filters fix END */

This is a prototype, I'll continue to debug and improve it. You can download it here in order to get the last version. Hope to get feedback and maybe suggestions.

Improve this answer
0

Your Answer

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

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.