i attempting use ajax call render partial view when radio button selected. have searched , have tried appears best approach via comments on stack. when click radio button, have no result, in debug, status code: 500 internal server error? assistance great.
partial view names:
_boa.cshtml _ta.cshtml _mnb.cshtml
view:
<td class="radio-inline"> @html.radiobutton("bankselect", "mnbconvert", false, new { @class = "radiomnb" }) mnb conversion @html.radiobutton("bankselect", "boaconvert", false, new { @class = "radioboa" }) boa conversion @html.radiobutton("bankselect", "taconvert", false, new { @class = "radiota" }) ta conversion </td>
javascript:
<script src="~/scripts/jquery-1.9.0.js"></script> <script type="text/javascript"> $(function () { $("[name=bankselect]").on('change', function () { // var $radio = $(this); var checked = $("input[name='bankselect']:checked").val(); $.ajax({ url: '@url.action("getbanktoconvert", "home")', data: checked, type: 'get', success: function (data) { $("#renderpartialview").html(data); } }); }); }); </script>
controller:
[httpget] public actionresult getbanktoconvert(string bankselect) { if (bankselect == "mnbconvert") { return partialview("_mnb"); } else if (bankselect == "boaconvert") { return partialview("_boa"); } else { return partialview("_ta"); } }
you aren't sending key/value pair data, value
.
try
$.ajax({ url: '@url.action("getbanktoconvert", "home")', data: {bankselect: checked }, type: 'get', success: function (data) { $("#renderpartialview").html(data); } });
when in doubt, inspect actual request in network tab of browser dev tools see sent , received among other components of request