title: SAPUI5 Semantic Page, button in footer content
body: <p>I am developing of SAPUI5 application by using semantic page. I plan to add a button in footer content of page. But it display me the following error</p>
  
  <blockquote>
    <p>For scenarios involving fragments and nested views, your project must
    contain an index.html like or a localIndex.html file containing the
    data-sap-resourceroots attribute. Currently, your project does not
    contain such files.found in negative cache:
    'sap/f/semantic/customFooterContent.js' from
    <a href="https://sapui5.hana.ondemand.com/1.56.4/resources/sap/f/semantic/customFooterContent.js" rel="nofollow noreferrer">https://sapui5.hana.ondemand.com/1.56.4/resources/sap/f/semantic/customFooterContent.js</a>:
    For scenarios involving fragments and nested views, your project must
    contain an index.html like or a localIndex.html file containing the
    data-sap-resourceroots attribute. Currently, your project does not
    contain such files.</p>
  </blockquote>
  
  <p>The following is my code of the page</p>
  
  <p></p>
  
  <pre><code>&lt;semantic:SemanticPage id="ViewCartPage" headerPinnable="false" toggleHeaderOnTitleClick="false" preserveHeaderStateOnScroll="false" showFooter="true"&gt;
      &lt;semantic:titleHeading&gt;
              &lt;Button id="continueShoppingButton" press="onContinueShoppingPressed" text="Continue Shopping" type="Transparent"/&gt;
      &lt;/semantic:titleHeading&gt;
  
      &lt;!-- Header Content --&gt;
      &lt;semantic:headerContent&gt;
          &lt;Label class="CartHeader" text="Your Cart"  width="100%" /&gt;
          &lt;FlexBox alignItems="Start" justifyContent="SpaceBetween"&gt;
              &lt;items&gt;
                  &lt;Panel backgroundDesign="Transparent"&gt;
                      &lt;content&gt;
                          &lt;core:Icon id="shoppingCartIcon" height="3rem" size="3rem" src="sap-icon://cart" alt="{i18n&gt;xfld.keyWord2}"/&gt;
                      &lt;/content&gt;
                  &lt;/Panel&gt;
                  &lt;Panel backgroundDesign="Transparent"&gt;
                      &lt;content&gt;
                          &lt;Label text="Customer : " width="100%" id="lbl1_Customer"/&gt;
                          &lt;Label class="OrderContent" text="{/objectDescription/customer}" width="100%" id="lbl2_Customer"/&gt;
                      &lt;/content&gt;
                  &lt;/Panel&gt;
                  &lt;Panel backgroundDesign="Transparent"&gt;
                      &lt;content&gt;
                          &lt;Label text="Salesperson : " width="100%" id="lbl1_Salesperson"/&gt;
                          &lt;Label class="OrderContent" text="{/objectDescription/salesperson}" width="100%" id="lbl2_Salesperson"/&gt;
                      &lt;/content&gt;
                  &lt;/Panel&gt;
                  &lt;Panel backgroundDesign="Transparent"&gt;
                      &lt;content&gt;
                          &lt;Label text="Number of Items : " width="100%" id="lbl1_NoOfItems"/&gt;
                          &lt;Label class="OrderContent" text="{/objectDescription/items}" width="100%" id="lbl2_NoOfItems"/&gt;
                      &lt;/content&gt;
                  &lt;/Panel&gt;
                  &lt;Panel backgroundDesign="Transparent" class="OrderColumn"&gt;
                      &lt;content&gt;
                          &lt;Label text="Total Amount : " width="100%" id="lbl1_TotalAmount"/&gt;
                          &lt;Label class="OrderContent" text="{/objectDescription/amount}" width="100%" id="lbl2_TotalAmount"/&gt;
                      &lt;/content&gt;
                  &lt;/Panel&gt;
                  &lt;!--&lt;ObjectStatus text="Continue Shopping" state="{/objectDescription/status}"/&gt;--&gt;
              &lt;/items&gt;
          &lt;/FlexBox&gt;
      &lt;/semantic:headerContent&gt;
  
      &lt;!-- Content --&gt;
      &lt;semantic:content&gt;
          &lt;Table id="idProductsTable" inset="false" items="{path:'/ProductCollection'}"&gt;
              &lt;columns&gt;
                  &lt;Column minScreenWidth="Tablet" demandPopin="true"&gt;
                      &lt;Text text="Name"/&gt;
                  &lt;/Column&gt;
                  &lt;Column minScreenWidth="Tablet" demandPopin="true"&gt;
                      &lt;Text text="Quantity"/&gt;
                  &lt;/Column&gt;
                  &lt;Column minScreenWidth="Tablet" demandPopin="true"&gt;
                      &lt;Text text="UOM"/&gt;
                  &lt;/Column&gt;
                  &lt;Column minScreenWidth="Tablet" demandPopin="true"&gt;
                      &lt;Text text="Price"/&gt;
                  &lt;/Column&gt;
                  &lt;Column minScreenWidth="Tablet" demandPopin="true"&gt;
                      &lt;Text text="Subtotal"/&gt;
                  &lt;/Column&gt;
                  &lt;Column id="buttonColumn" width="15%" minScreenWidth="Tablet" demandPopin="true" popinDisplay="WithoutHeader" hAlign="Right" class="sapMTableContentMargin"&gt;
                      &lt;header&gt;
                          &lt;Label id="cartItemDelete" text="Cancel" visible="{= ${device&gt;/system/phone}}"/&gt;
                      &lt;/header&gt;
                  &lt;/Column&gt;
              &lt;/columns&gt;
              &lt;items&gt;
                  &lt;ColumnListItem vAlign="Middle"&gt;
                      &lt;cells&gt;
                          &lt;ObjectIdentifier title="{Name}" text="{ProductId}"/&gt;
                          &lt;Input value="{Quantity}" width="70px"/&gt;
                          &lt;Text text="{UOM}"/&gt;
                          &lt;Text text="{Price}"/&gt;
                          &lt;Text text="{Subtotal}"/&gt;
                          &lt;!-- Add Button --&gt;
                          &lt;Button id="addToCartButton" tooltip="Delete Item" icon="sap-icon://decline" press="deleteCartItemPressed" type="Transparent"/&gt;
                      &lt;/cells&gt;
                  &lt;/ColumnListItem&gt;
              &lt;/items&gt;
          &lt;/Table&gt;
      &lt;/semantic:content&gt;
      &lt;semantic:customFooterContent&gt;
              &lt;Button id="confirmOrder" text="Confirm" press="onConfirmOrder"/&gt;
      &lt;/semantic:customFooterContent&gt;
  &lt;/semantic:SemanticPage&gt;
  </code></pre>
  
  <p></p>