Search code examples
javascriptajaxasp.net-mvcasp.net-mvc-4modalpopupextender

how to pass data from a form to popup form on clicking on a link in mvc


I am doing a project in mvc and in that I have created a table. It works fine and what I need to get is that on one row I have given a link . On clicking on that link I have to get a popup form with the data same as that particular column.

view - Students.cshtml

<tr>
    <td style="font-weight:bold; text-align: center;">
         Sl No
    </td>
    <td style="font-weight:bold; text-align: center;">
        Name
    </td>
    <td style="font-weight:bold; text-align: center;">
        div
    </td>
    <td style="font-weight:bold; text-align: center;">
        <a href="@Url.Action("Home", "Admin", new { id = @item.ID})">
  <i class="fa fa-plus-circle" aria-hidden="true"></i>
  </a>
   </td>                                                
</tr>

Here My problem is, how can I get the popup form with the data of the students.cshtml form to the popup form. That is, the Sl.No, Name and div on that pop up form. whether need to write ajax script for popup?? but to pass data?? Don't know what to do. Can anyone please help me find a solution for this ??


Solution

  • It's worth remembering that a modal popup is not a separate page but just some standard markup that is styled to look like it's sitting ontop of the current page.

    On clicking on that link I have to get a popup form with the data same as that particular column.

    If all of that information that you want to show is already on the page then there is no need to make an AJAX request to fetch it, instead you can use some basic JavaScript to show a modal popup when the link is clicked.

    See How to create a modal popup using JavaScript? or How to create a modal popup using javascript and CSS for details of how to create a modal popup using JavaScript.