SharePoint 2013 - On clicking of Edit icon, show popup box (or) modal dialog

Kumar32490 1 Reputation point
2021-02-16T04:54:33.207+00:00

I have a grid which displays data from the SharePoint list. On clicking of Edit icon, it should display a popup, where it allows users to edit Expiration date and notes field as per below screenshots.

Once user clicks on save, it should save the data back to SharePoint list and grid. May I know how it can be achieved in SP2013 visual web part ?

68486-11.png

68521-12.png

SharePoint Server
SharePoint Server
A family of Microsoft on-premises document management and storage systems.
2,206 questions
SharePoint Development
SharePoint Development
SharePoint: A group of Microsoft Products and technologies used for sharing and managing content, knowledge, and applications.Development: The process of researching, productizing, and refining new or existing technologies.
2,657 questions
SharePoint Server Development
SharePoint Server Development
SharePoint Server: A family of Microsoft on-premises document management and storage systems.Development: The process of researching, productizing, and refining new or existing technologies.
1,569 questions
{count} votes

1 answer

Sort by: Most helpful
  1. MichaelHan-MSFT 18,016 Reputation points
    2021-02-17T08:36:50.07+00:00

    Hi @Kumar32490 ,

    To open popup box or modal dialog in the visual web part . You need to use javascript to achieve this, you could refer to these articles:

    How To Show And Hide A Modal Pop Up Dialog In A SharePoint 2013 Page Or A Visual WebPart

    How To Programmatically Show Or Hide A Modal Popup Dialog With Server Side Code In Share Point 2013

    You also need to get the item ID data in your grid to edit the corrsponding item. You could open the edit form page in the modal dialog to edit the item, the url of edit listitem is: http://yoursite/Lists/ListName/EditForm.aspx?ID=<ID>


    If an Answer is helpful, please click "Accept Answer" and upvote it.
    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

    0 comments No comments