Change Image on Every Page Load using Random Number Generator

-
How to Change Image on Every Page Load using Random Number Generator

You can use the below code to change Image on Every Page Load

 JS Code:-

var length;
$(document).ready(function() {
getFoldersTraining_dev();
});
     function getFoldersTraining_dev() { 
        $.ajax({
            url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/GetFolderByServerRelativeUrl('/teams/FMHub/Quotes_image_homepage')?$expand=Folders,Files",
            type: "GET",
            headers: { "Accept": "application/json;odata=verbose" }, // return data format
            success: function (data) {
              var html = "";
               if(data.d.Files.results.length >0){ 
                     length = data.d.Files.results.length;
                       var x = Math.floor((Math.random() * (length  - 1)));
                                                                                                                                                 
FileURL = data.d.Files.results[x].ServerRelativeUrl;
if(FileURL != ""){
  html ="<img src='"+FileURL+"'></a>";
}
                             
                                 $("#quote_img_homepage").html(html);
                                                                                                                                                             
                 }           
                                                                                             
else{
html = "Comming Soon";
}
                                                             
                  $("#quote_img_homepage").html(html);
         
             
       
            },
            error: function (error) {
                alert(JSON.stringify(error));
            }
        }); 
    }

Comments

Post a Comment

Popular posts from this blog

Customizing SharePoint list and implementing Quick search using jQuery

-
Image
How to Customize SharePoint list and implementing Quick search using jQuery 1. Create a SharePoint list and create a view for it. 2. Now choose the created view and go to modify view, under Style choose Shaded as shown below.  3. Edit the list and add script editor web part to it and paste the below code. Code:- <script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.0.min.js"></script> <style> .ms-addnew {   display: none; } input[type=button] {     background-color: #4CAF50;     border: none;     color: white;     padding: 16px 32px;     text-decoration: none;     margin: 4px 2px;     cursor: pointer; } </style> <script type="text/javascript"> $(document).ready(function(){   $("input.search").change(function() { debugger;      var txt = $("input....
Read more

Clear DataTable on button click

-
Image
How to clear DataTable on button click In this post we will learn how we can clear a datatable on a jQuery event. By click on "btnReset" we have to call datatable's destroy method to completely clear a datatable. We may need to clear a datatable on an event. Please follow the below code to achieve the same. HTML - <table id="tblResourcesData" class="display" width="100%" cellspacing="0">           <thead>               <tr>                   <th>Title</th>                   <th>Region</th>                 <th>Country</th>                <th>Email</th>             </tr>           </thead>  </table...
Read more

Populate dropdown using jquery ajax in SharePoint

-
Image
How to Populate dropdown using jquery ajax in SharePoint Step 1: Create a page and add Script Editor Web Part to it. Step 2: Paste the below code to Script Editor Web Part. Code:               <script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.0.min.js"></script> <script type="text/javascript"> var option; var Banks;  $(document).ready(function () {      Banks = $("#ddlbanks");  // html control      option = $("<option/>").attr("value",0).text("-Select-");      Banks.append(option);      populateBanks();   }); function populateBanks(){      $.ajax({ url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/Lists/GetByTitle('Banks')/Items", type: 'GET', dataType: 'json', async: false, headers: {     "accept": "application/json;odata=verbose;charset=ut...
Read more