1

I want to upload a button image and when clicked I want it to be redirected to a different List view.

I used a JavaScript for a New List entry form using JavaScript

<a  href="javascript:(void SP.UI.ModalDialog.showModalDialog({title: &#39;New Form&#39;,showMaximized:false,url: &#39;../Lists/XYZForm/NewForm.aspx&#39;}));" target="_self"><img class="pic" alt="Leaver Form" src="http://XYZ/ABC/DE/FG%20Images/XYZForm.png" style="height: 30px; width: 140px"/> </a>

I used a Content Editor web part and supplied the link of the JavaScript.

I want to do the same for the List View.

I need help with the JavaScript Query to be used.

2

Add below script in content editor webpart (change your list view page url)

<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
<script type="text/javascript">    
    $(document).ready(function () {
        $("#btnGoToView").click(function () {
            window.location = "Your list view page URL";
        });        
    });
</script>
<img id="btnGoToView" src="images/image.jpg" alt="test image" height="42" width="42"/>

If there is any predefined image on page on which you want click event to redirect then find that image's id and replace it in code. Also remove image tag from above code if not needed.

  • there is no button present, I want to call an image, and on clicking the image I want the redirection. – CodeAbaddon Aug 18 '17 at 12:41
  • Are u want to add image through code or there is predefined image on page on which you want click event? – SP Developer Aug 18 '17 at 12:46
  • I have updated my answer. – SP Developer Aug 18 '17 at 13:02
1

Maybe I don't understand what you want to achieve, or maybe you are over-complicating things.

Create a list view.

Navigate to that list view and copy the URL.

Back on your original page, create the button and use a hyperlink to the list view URL you just copied.

  • In this scenario the permissions for the materpage is blocked, Hence the page cannot be edited, So I cannot add a button through the .aspx file. Which is why I have to use a Content Editor and then supply an image and load it by calling a JavaScript, but here I want the JavaScript Redirect function. – CodeAbaddon Aug 18 '17 at 9:47
  • So? Even with a button that is served by a CEWP, you can link to an existing view. What is the problem? – teylyn Aug 18 '17 at 10:07
  • I don't quite get why you use the ModalDialog if you just want to show a list view. The modal dialog is for a form, not a view. Do you understand the difference between view and a form? – teylyn Aug 18 '17 at 10:09
  • The above code I supplied was for a different scenario, I used that for new item entry, where user clicks on the image and it opens a modal. This here for the redirection of list is a different scenario, but I want to do it in similar fashion by calling a Javascript from content editor. I need the JavaScript code for redirection that I can use. – CodeAbaddon Aug 18 '17 at 12:38
  • Actually I tried your approach, Content Editor > Image > Hyperlink – CodeAbaddon Aug 18 '17 at 13:14
0

Using JQuery + HTML:

 <button type="button" id="Nav">Navigate to list</button>

 var site = "*yourlisturlhere*"

 $('#Nav').click(function(){
      window.location.assign(site)
 })
  • if you want this to open in a modal like you have in your post, add the "void SP.UI.ModalDialog.showModalDialog" and pass the site url with options. – Luke Walker Aug 18 '17 at 9:35
  • In this scenario the permissions for the materpage is blocked, Hence the page cannot be edited, So I cannot add a button through the .aspx file. Which is why I have to use a Content Editor and then supply an image and load it by calling a JavaScript, but here I want the JavaScript Redirect function. In my supplied code I used the Modal, while I am also calling the image from the file. I want the same but I couldn't figure out the redirect function or maybe I am doing something wrong. – CodeAbaddon Aug 18 '17 at 9:51

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.