1

I have a query below is my script :

<div  style="text-align: left;"> 
   <table id = "customListData" style="margin-top:-70px;" width="100%" align="right" cellspacing="0"> 
      <tbody> 
         <tr> 
         </tr> 
      </tbody> 
   </table> 
</div> 
</style>
<style type="text/css">
<style type="text/css">
   .hover_img a{position:relative;float:right;}
   .hover_img a span {position:absolute;display:none;}
    .hover_img  a:hover  span {display:block;}
    .image
    {
    background-image:url('/sites/IMI/SiteAssets/b2.jpg');
    background-size:100% 100%;
    }
</style>
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<script src="http://ecm-qa/sites/IMI/SiteAssets/jquery-1.8.3.min.js"></script>
<script>
$(document).ready(function(){ExecuteOrDelayUntilScriptLoaded(DataInfo, "sp.js"); });
function DataInfo() {
    this.clientContext1 = new SP.ClientContext.get_current();
    var oListdata = clientContext1.get_web().get_lists().getByTitle('FAQ');
    var camlQuery = new SP.CamlQuery();
    camlQuery.set_viewXml('<View><RowLimit>100</RowLimit></View>');
    this.collListItemdata = oListdata.getItems(camlQuery);
    clientContext1.load(
        collListItemdata,          'Include(ID,Attachments,FileDirRef,Title,Description,HasUniqueRoleAssignments)'
    );
    clientContext1.executeQueryAsync(
        Function.createDelegate(this, Succeeded), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}
function Succeeded(sender, args) {
 document.getElementById('customListData').innerHTML = "" ;
  var dataInfo = '';
    var title = '';
    var description = '';
    var txtHTML = '';
    var txtdescHTML = '';
    TitleArray=new Array();
    var TitleCount = 0;
    DescriptionArray=new Array();
    var DescriptionCount = 0;
    var dataInfo = collListItemdata.getEnumerator()
    while (dataInfo.moveNext()) {
        var i = 0
        var currentItem = dataInfo.get_current();
        title = currentItem.get_item('Title');
        TitleArray[TitleCount++] = title;
        var ItemID = currentItem.get_item('ID');
        var hasattachments = currentItem.get_item('Attachments');
        if(hasattachments){
        getAttachmentFiles(currentItem, ItemID);
        }
        else{
            success([]);
            }
        //var filename = _spPageContextInfo.webAbsoluteUrl + "/Lists/FAQ/Attachments/" + ItemID;
        //alert("The Attachment path would be :"+filename);
        //attachmentFiles= filename.get_files();
        //var testing = _spPageContextInfo.webAbsoluteUrl + "/Lists/FAQ/Attachments/" + ItemID + "/" + filename;
        //alert("The filename is :" +attachmentFiles.get_serverRelativeUrl());
        description = currentItem.get_item('Description');
        DescriptionArray[DescriptionCount++]=description;
    }
    txtHTML = txtHTML + "<div style='margin-bottom: 50px;' width='100%'>";
     txtHTML = txtHTML +  "<label id='deptName' style=' font-size: 25px;'  >FAQ </label>    ";
     txtHTML = txtHTML + "</div>";
    txtHTML = txtHTML + "<table>";
    for(var i = 0 ; i < TitleCount; i++)
    {
            txtHTML = txtHTML + "<tr>";       
        txtHTML  = txtHTML + "<td    ><li style='font-size:200%;margin-left:20px;'>";
        var id = TitleArray[i];
        id = id.replace(/\s/g,'');
        txtHTML = txtHTML + "<div >";
        if(title != '')
        {
            txtHTML = txtHTML + "<a title='"+ DescriptionArray[i] +"' id='"+id+"'  style='font-Size:20px; '  href = '#' onclick=show('"+id+"')  >" + TitleArray[i] + "</a>";
        }
        txtHTML  = txtHTML + "<div id='desc_"+id+"'  style='padding-bottom: 20px; font-size: 18px; border-bottom-width: 1px; border-bottom-style: solid; display: none; border-collapse: separate;' >";
        if(description != '')
        {
                txtHTML = txtHTML + DescriptionArray[i];
                 txtHTML  = txtHTML + "</div>";  
        }
        txtHTML = txtHTML + "</li></td>";
        txtHTML = txtHTML + "<div width='90'>";
        txtHTML = txtHTML + "</div>";
            txtHTML = txtHTML + "</tr>";
    }
    txtHTML = txtHTML + "</table>"; 
    $('#customListData').append(txtHTML); 
}
function getAttachmentFiles(listItem, itemID) {
    var ctx = listItem.get_context();
    //var attachmentFolderUrl = String.format('{0}/Attachments/{1}',listItem.get_fieldValues()['FileDirRef'],listItem.get_fieldValues()['ID']);
    var folder = ctx.get_web().getFolderByServerRelativeUrl(_spPageContextInfo.webAbsoluteUrl + "/Lists/FAQ/Attachments/" + itemID);
    var files = folder.get_files();
    ctx.load(files);
    ctx.executeQueryAsync(
       function () {
          this.attachmenturl = '';
          this.attachmentname = '';     
              this.attachmenturl = files.get_serverRelativeUrl();
              alert(this.attachmenturl);
              this.attachmentname = files.get_name();
          //success(attachmenturl, attachmentname);      
    },
    Function.createDelegate(this, this.onQueryFailed));
}
function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}
function show(id)
{
    var display = document.getElementById('desc_' + id).style.display;
    if(display == 'none')
    {
        document.getElementById('desc_' + id).style.display="block";
         document.getElementById(id).style.color="Orange";
    }
    else
    { 
        document.getElementById('desc_' + id).style.display="none";
         document.getElementById(id).style.color="#0072c6";
    }
}
 document.getElementById('DeltaPlaceHolderPageTitleInTitleArea').innerHTML= "<div style='text-align:left;'>Some Name</div>"; 
</script>

I have a custom list called "FAQ", which has six entries and has two columns : Title and Description

Each List item has exactly one attachment and currently there are 6 such List items

The title and description for each are working fine in HTML, but on trying to retrieve the Attachment URL and name I'm getting an error : Object doesn't support property or method 'get_serverRelativeUrl' for the line :this.attachmenturl = files.get_serverRelativeUrl();

I would like to add the Attachment URL and Name just below the Description in an tag.

I read online that this is the only way to retrieve an attachment URL and Name using CSOm and unfortunately REST is not an option for me

Please help any inputs would be appreciated, I've spent the whole day today trying to figure out this error

  • clean up your script, no-one is going to try and understand it with all that whitespace – Danny '365CSI' Engelman Apr 7 '17 at 20:15
  • Hi @Danny '365CSI' Engelman...thanks for your suggestion. I have removed all the white spaces, please let me know if you have any other inputs. – Hank Apr 9 '17 at 15:28
1

You problem most likely is the scope of variables in anyschronous functions

Read and understand:

additional notes:

txtHtml = txtHtml + "something";

is the same as:

txtHtml += "something";

TitleArray[TitleCount++] = title

=

TitleArray.push(title)

and then

TitleCount = TileArray.length;


For all that looping spend a day learning the Array .map and .reduce methods;
they might seem weird at first, but once you understand the concept, you won't want to use anything else and make you code a whole lot easier.

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.