0

I have a SharePoint list and the form is full radio button choices. For example, let's says one of my choice fields is comprised of "Option 1", "Option 2", and "Option 3". When a user selects a value and goes to view the form, it will show only the value that they have selected. However, I would still like the user to be able to see all 3 options when viewing the form. How can I have the list retain the radio button choices? Thank you!

BTW, right now I am using a custom form and am using this code that I found on the web as my JS file. Do I need to change something within here to make the dispform.aspx show the radio buttons?

<script src="//code.jquery.com/jquery-1.10.1.min.js"></script>
<style type="text/css">

.ms-formtable

{display:none;}

</style>


<script type="text/javascript">

 $(document).ready(function() {

    //loop through all the spans in the custom layout

    $("span.hillbillyForm").each(function()

    {

        //get the display name from the custom layout

        displayName = $(this).attr("data-displayName");

        elem = $(this);

        //find the corresponding field from the default form and move it

        //into the custom layout

        $("table.ms-formtable td").each(function(){

            if (this.innerHTML.indexOf('FieldName="'+displayName+'"') != -1){

                $(this).contents().appendTo(elem);

            }

        });

    });

});

1

Open Site in Designer->Click on List and libraries in left Pane->click on List for which you want to make modification--> Click on 'New' in form section->Enter name->Select form type as display form->Set this form as default form.->Right click on the form-->Click on edit file in advance mode-->Find required field controls "SharePoint:FormField"-->Change the value of Controlmode attribute form "Display" to "Edit" Or Replace control for following control.

<SharePoint:FormField runat="server" id="FieldInternalName" ControlMode="Edit" FieldName="FieldInternalName" __designer:bind="{ddwrt:DataBind('u','FieldInternalName','Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@FieldInternalName')}"/>

Replace "FieldInternalName" with your internal name of field.

Once you add control on form Using jQuery disable this control.

  • <SharePoint:FormField runat="server" id="FieldInternalName" ControlMode="Edit" FieldName="FieldInternalName" __designer:bind="{ddwrt:DataBind('u','FieldInternalName','Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@FieldInternalName')}"/> – Akshay Belure Aug 14 '18 at 4:47
0

Javascript approach can also help as below :

 <script src="https://code.jquery.com/jquery-3.3.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
    var fieldTitle="test";
    var currentFieldValue=$(".ms-h3.ms-standardheader:contains('"+fieldTitle+"')").parent().next()[0].innerText.trim();
    var fieldHTML=GetFieldChoices(currentFieldValue,fieldTitle);
    $(".ms-h3.ms-standardheader:contains('"+fieldTitle+"')").parent().next().html(fieldHTML);
});
function GetFieldChoices(currentFieldValue,fieldTitle){
    var listId = _spPageContextInfo.pageListId.replace("{","").replace("}","");
    var fieldHTML="";
    var url = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists(guid'"+listId+"')/fields?$select=Choices&$filter= Title eq '"+fieldTitle+"'";
    $.ajax({
        url: url,
        method: "GET",
        async:false,
        headers: { "Accept": "application/json; odata=verbose" },
        success: function (data) {       
            var choices = data.d.results[0].Choices.results;
            $.each(choices,function(index,choice){
                if(choice==currentFieldValue){
                    fieldHTML+="<input type='radio' disabled='disabled' checked='checked' name='"+fieldTitle+"' value='"+choice+"'>"+choice;
                }else{
                    fieldHTML+="<input type='radio' disabled='disabled' name='"+fieldTitle+"' value='"+choice+"'>"+choice;
                }
                if(index<choices.length){
                    fieldHTML+="<br>";
                }
            });         
        },
        error: function (error) {
            console.log(JSON.stringify(error));
        }
    });
    return fieldHTML;
}</script>

Just provide your field name in example above is test to your field and add this script on your display form using content editor.

  • So if the title of my column is 'AP Coding', do I just add that where test is? – brayk Aug 14 '18 at 15:23
  • Yes to above code snippet just replace your column title – Bhaskar Dhone Aug 16 '18 at 5:30

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.