Displaying partila view in dialog box (popup)
I am trying to display a popup by clicking a button using jquery, this button is placed at each end of the line corresponding to the element.
View:
<input type="button" id="DetailButton" value="Details" onclick="GetDetails(this);"/>
Script:
function GetDetails(sender) {
var IdElement = $($(sender).parent().parent()).find('input').val();
$.ajax({
type: 'GET',
url: "/ControllerName/ActionName",
data: encodeURI("IdElement=" + IdElement) ,
success: function (view) {
//How to render a view in popup ?
}
});
}
The DialogDetails dialog is in partial view:
<div id="PopUpDetails" >
<table>
<thead>
<tr>
<th colspan="1">Element</th>
</tr>
</thead>
<tbody>
<%
foreach (var Item in Model.List)
{ %>
<tr>
<td>
<%:Html.DisplayFor(model => Item.IdElement) %>
</td>
</tr>
<%} %>
</tbody>
</table>
</div>
Controller:
public ActionResult ActionName(int IdElement)
{
ElementViewModel model = new ElementViewModel ();
return View("DialogDetails", model);
}
+3
source to share
1 answer
First, return your view as a partial view. (Viewing might be fine, but I haven't used it like this)
Then what you want to do is set the return result in the ajax call to be the content of your dialog containing the div.
eg.
<div id="dialogDiv"><div>
then n handler of your ajax call will do the following:
$('#dialogDiv').html(view);
$('#dialogDiv').dialog();
You must first set the content before calling the dialog function.
This works for me.
0
source to share