0

All,

I am using this jslink code for chosen.js on a multiple choice lookup column.. The problem is that when you click properties and look at the metadata the value is blank - any ideas at all so the column value is not missing, thanks..

    var DataCogsJSLink = DataCogsJSLink || {};



DataCogsJSLink.Loaded = false;



(function () {





    (window.jQuery || document.write('<script src="//ajax.aspnetcdn.com/ajax/jquery/jquery-1.10.0.min.js"><\/script>'));

    document.write('<script src="//cdnjs.cloudflare.com/ajax/libs/chosen/1.1.0/chosen.jquery.min.js"><\/script>')

    document.write('<link href="//cdnjs.cloudflare.com/ajax/libs/chosen/1.1.0/chosen.css" rel="stylesheet" type="text\/css"><\/script>')





    var equipmentContext = {};

    equipmentContext.Templates = {};

    equipmentContext.Templates.Fields = {





    "Local%5Fx0020%5FKeywords": {

            "NewForm": LocalKeywordTemplate,

            "EditForm": LocalKeywordTemplate

        }

    };



    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(equipmentContext);



    _spBodyOnLoadFunctionNames.push("getLocalKeywords");







})();



function LocalKeywordTemplate(ctx) {



    var formCtx = SPClientTemplates.Utility.GetFormContextForCurrentField(ctx);





    formCtx.registerGetValueCallback(formCtx.fieldName, function () {

    //var countryString = "";

     $('#Local%5Fx0020%5FKeywordsSelectField').children('option:selected').each( function() {

            var $this = $(this);

            countryString += $this.val() + ';#' + $this.text() + ';#';

        });

    //strip off the last ;#

    var len = countryString.length;

        if (countryString.substr(len-2,2) == ";#") {

            countryString = countryString.substring(0,len-2);

        }

    return countryString;

    });



    var fieldHtml = '<select multiple  ';

    fieldHtml += 'id="Local%5Fx0020%5FKeywordsSelectField">';

    fieldHtml += '"</select>&nbsp;&nbsp;';



    return fieldHtml;

}



function getLocalKeywords(continent, selectedCountries) {

    var queryUrl = "https://xxxx.sharepoint.com/teams/xxx/site/_api/web/lists/GetByTitle%28%27Local%20Keywords%20Enhanced%27%29/items?select=ID%2cTitle&$top=5000&$orderby=Title";





    $.ajax({

        cache: false,

        url: queryUrl,

        type: 'GET',

        dataType: 'json',

        async: false,

        headers: {

            "accept": "application/json;odata=verbose;charset=utf-8"

        },

        success: function (data) {



            //$('#Local%5Fx0020%5FKeywordsSelectField').empty();



            $.each(data.d.results, function (i, result) {

                var optionString;

                optionString = "<option value='" + result.ID + "'>" + result.Title + "</option>"

                $('#Local%5Fx0020%5FKeywordsSelectField').append(optionString);

            });

            $('#Local%5Fx0020%5FKeywordsSelectField').chosen({placeholder_text_multiple:'Select the Local Keywords for this document'});

            if (selectedCountries){

                $('#Local%5Fx0020%5FKeywordsSelectField').val(selectedCountries);

            }

            $("#Local%5Fx0020%5FKeywordsSelectField_chosen").width(400);

            $('#Local%5Fx0020%5FKeywordsSelectField').trigger("chosen:updated")



        }, //end of success

        error: function ajaxError(response) {

            alert(response.status + ' ' + response.statusText);

        },

    }); //end of ajax

}
0

There is no countryString defined in your script(tested script in my environment).

<script type="text/javascript">
        var DataCogsJSLink = DataCogsJSLink || {};        
        DataCogsJSLink.Loaded = false;
        (function () {            
            (window.jQuery || document.write('<script src="https://code.jquery.com/jquery-1.12.4.js"><\/script>'));
            document.write('<script src="//cdnjs.cloudflare.com/ajax/libs/chosen/1.1.0/chosen.jquery.min.js"><\/script>')
            document.write('<link href="//cdnjs.cloudflare.com/ajax/libs/chosen/1.1.0/chosen.css" rel="stylesheet" type="text\/css"><\/script>')            
            var equipmentContext = {};
            equipmentContext.Templates = {};
            equipmentContext.Templates.Fields = {                
                "LocalKeywords": {
                    "NewForm": LocalKeywordTemplate,
                    "EditForm": LocalKeywordTemplate
                }
            };            
            SPClientTemplates.TemplateManager.RegisterTemplateOverrides(equipmentContext);            
            _spBodyOnLoadFunctionNames.push("getLocalKeywords");
        })();

        function LocalKeywordTemplate(ctx) {            
            var formCtx = SPClientTemplates.Utility.GetFormContextForCurrentField(ctx);      
            var countryString = "";
            formCtx.registerGetValueCallback(formCtx.fieldName, function () {
                //var countryString = "";
                $('#LocalKeywordsSelectField').children('option:selected').each(function () {
                    var $this = $(this);
                    countryString += $this.val() + ';#' + $this.text() + ';#';
                });
                //strip off the last ;#
                var len = countryString.length;
                if (countryString.substr(len - 2, 2) == ";#") {
                    countryString = countryString.substring(0, len - 2);
                }
                return countryString;
            });

            var fieldHtml = '<select multiple  ';
            fieldHtml += 'id="LocalKeywordsSelectField">';
            fieldHtml += '"</select>&nbsp;&nbsp;';
            return fieldHtml;
        }

        function getLocalKeywords(continent, selectedCountries) {
            var queryUrl = "https://wendytest123.sharepoint.com/sites/lee/_api/web/lists/GetByTitle('testlist')/items?$select=Id,Title&$top=50&$orderby=Title";
            $.ajax({
                cache: false,
                url: queryUrl,
                type: 'GET',
                dataType: 'json',
                async: false,
                headers: {
                    "accept": "application/json;odata=verbose;charset=utf-8"
                },
                success: function (data) {
                    $.each(data.d.results, function (i, result) {
                        var optionString;
                        optionString = "<option value='" + result.ID + "'>" + result.Title + "</option>"
                        $('#LocalKeywordsSelectField').append(optionString);
                    });

                    $('#LocalKeywordsSelectField').chosen({ placeholder_text_multiple: 'Select the Local Keywords for this document' });
                    if (selectedCountries) {
                        $('#LocalKeywordsSelectField').val(selectedCountries);
                    }
                    $("#LocalKeywordsSelectField_chosen").width(400);
                    $('#LocalKeywordsSelectField').trigger("chosen:updated")
                }, //end of success
                error: function ajaxError(response) {
                    alert(response.status + ' ' + response.statusText);
                },
            }); //end of ajax
        }
    </script>
2
  • is that because I commented it out ?? It made no difference to me ? Does it mean that you have tested this and it works and it remembers in your edit form.aspx ? – Jason Hough Mar 17 '20 at 8:34
  • works for new form, for edit form, I think you need bind the option in fieldHtml. – Lee_MSFT Mar 17 '20 at 9:08

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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