ボタンをクリックすると、「View_Name」の新しいコピーがページに追加されます。javasciptでこれを行うにはどうすればよいですか? 以下は、開始時のページの外観です。
<fieldset>
<legend>Some Form</legend>
@{ Html.RenderPartial("Partiale"); }
<input type="button" value="Add new Item" />
</fieldset
ボタンをクリックすると、「View_Name」の新しいコピーがページに追加されます。javasciptでこれを行うにはどうすればよいですか? 以下は、開始時のページの外観です。
<fieldset>
<legend>Some Form</legend>
@{ Html.RenderPartial("Partiale"); }
<input type="button" value="Add new Item" />
</fieldset
以下の例を参照してください
HTML:
<fieldset>
<legend>Some Form</legend>
<div id="divPartial">
</div>
<input type="button" id="mybutton" value="Add new Item" />
</fieldset>
Jクエリ:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script>
$(document).ready(function () {
$("#mybutton").click(function () {
var url = "/Item/FilteredItemGallery/";
$.ajax({
url: url,
cache: false,
type: "POST",
success: function (data) {
$('#divPartial').html(data);
/* little fade in effect */
$('#divPartial').fadeIn('fast');
},
error: function (reponse) {
alert("error : " + reponse);
}
});
});
});
</script>
コントローラーのアクション:
public ActionResult FilteredItemGallery()
{
return PartialView("GalleryPartial");//return your partial view here
}