1

I have an HTML page that acts as a phone directory for departments. I want users to be able to click on a department button and the script looks for that department in a SharePoint list to display each column.

This is what my list (TransferGuide) looks like: enter image description here

This is what the HTML page (still needs somemore CSS) looks like (or rather what I want it to look like: enter image description here

So far what I have I can't seem to pull the correct data. I think I'm having trouble with the GetListItems section. The side buttons are a simple CSS 'tabs' hidden/unhide IDs. I don't think they're affecting the script.

Here is the page code:

<body>
<div class="tabs">
  <input type="radio" name="tabs" id="tab1" checked>
    <label for="tab1">ASC</label>
  <input type="radio" name="tabs" id="tab2">
    <label for="tab2">CSS</label>
  <input type="radio" name="tabs" id="tab3">
    <label for="tab3">CSG</label>
  <input type="radio" name="tabs" id="tab4">
    <label for="tab4">CRT</label>

  // repeat with the other departments, just skipping to the one displayed on the 2nd image
  <div id="tab-content4" class="tab-content">
    <div id="displayTitle"></div>
    <div id="dTitle"></div>
     // repeat with each column id
  </div>
</div>

<script language="javascript" type"text/javascript">
   $(document).ready(function() {
      $().SPServices ({
         operation: "GetListItems",
         async: false,
         listName: "TransferGuide",
         CAMLViewFields:"<ViewFields><FieldRef Name="Title" /><FieldRef Name="HoursDate" /><FieldRef Name="HoursTime" /><FieldRef Name="Extension" /><FieldRef Name="Email" /><FieldRef Name="PhoneNumber" /><Field Name="FaxNumber" /><FieldRef Name="ReasonForTransfer" />
         completefunc: function (xData, Status) {
           $(xData.responseXML).find("z\\:row, row").each(function() {
             var dTitle = $(this).attr("ows_Title");
             var dHoursDate = $(this).attr("ows_HoursDate");
             //...repeat with the other columns.
           });
       });
   });

    document.getElementById("dTitle").innerHTML = dTitle
     // ... so on repeat with the other list columns.
</script>
</body>

I know the script works because I've used it for another application, I just can't figure out the part to display it in the section. I'm pretty sure my issue has something to do with the way it's stored in the variables, but also the way it uses IDs, since I believe you can only have one ID (right?), this won't work because each department uses the same ID.

Also, more obviously, I'm missing the crucial part where it knows which item to pull the rest of the columns from. I don't even know where to start searching for this information. Something like:

if title = label then ...get the rest of the columns

just before it runs the SPServices part.

I'm sorry I know I'm a bit over my head here and I'm not giving you much to work on, but any help or tips would be great.

1

Replace

CAMLViewFields:"<ViewFields><FieldRef Name="Title" /><FieldRef Name="HoursDate" /><FieldRef Name="HoursTime" /><FieldRef Name="Extension" /><FieldRef Name="Email" /><FieldRef Name="PhoneNumber" /><Field Name="FaxNumber" /><FieldRef Name="ReasonForTransfer" />

with

CAMLQuery: "<Query><Where><Eq><FieldRef Name='Title' /><Value Type='Text'>Pass Dynamic Label Value</Value></Eq></Where></Query>",
CAMLViewFields:"<ViewFields><FieldRef Name='Title' /><FieldRef Name='HoursDate' /><FieldRef Name='HoursTime' /><FieldRef Name='Extension' /><FieldRef Name='Email' /><FieldRef Name='PhoneNumber' /><Field Name='FaxNumber' /><FieldRef Name='ReasonForTransfer' />",

Pass your lable value in caml query.

  • Should the FieldRef Names match exactly the label names? – Chester May 4 '16 at 16:56
  • Yes, it will return result, if your label name and SharePoint title column value are matched. – Viraj Gorajia May 5 '16 at 7:10
  • Also found one mistake in CAMLViewFields regarding quotes, it breaks the syntax. Please try this answer and check that you achieve what you want. – Viraj Gorajia May 5 '16 at 7:13
  • It didn't work unfortunately. – Chester May 7 '16 at 5:09
  • What you got result after applying camlquery? – Viraj Gorajia May 10 '16 at 5:48
1

If i understood your problem correctly, your data is displaying correctly but you want some conditional data to be extracted from SharePoint list and want your conditions to be executed before it runs SPServices part. I would try to give you the idea for doing this.

I think you can use Where in your CAML query. You can check this answer on how to use Where in CAML query.

<script language="javascript" type"text/javascript">
   $(document).ready(function() {


//////Make your calculations here and assign to some variable xyz////////


      $().SPServices ({
         operation: "GetListItems",
         async: false,
         listName: "TransferGuide",

/////// Update your CAML Query and pass the value stored in XYZ variable. Follow the link i have shared//////

         CAMLViewFields:"<ViewFields><FieldRef Name="Title" /><FieldRef Name="HoursDate" /><FieldRef Name="HoursTime" /><FieldRef Name="Extension" /><FieldRef Name="Email" /><FieldRef Name="PhoneNumber" /><Field Name="FaxNumber" /><FieldRef Name="ReasonForTransfer" />
         completefunc: function (xData, Status) {
           $(xData.responseXML).find("z\\:row, row").each(function() {
             var dTitle = $(this).attr("ows_Title");
             var dHoursDate = $(this).attr("ows_HoursDate");
             //...repeat with the other columns.
           });
       });
   });

    document.getElementById("dTitle").innerHTML = dTitle
     // ... so on repeat with the other list columns.
</script>

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.