Asp mvc5 dropdownlist ajax结果

Question

我想显示在某个Div的下拉列表中选择的值，我有以下代码：

<select id="SelectedItem">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

<script>
$('#SelectedItem').change(function(){
    $.ajax({
        url: '@Url.Action("ajaxGetValue", "Test")',
        type: "POST",
        data: {id:$('#SelectedItem:selected').val()},
        success: function(){
            $('#ajaxDisplay').html('...');
    }
    });
});
</script>

在控制器方面，我有：

   public PartialViewResult ajaxGetValue(int id)
    {
        ViewBag.str = id.ToString();
        return PartialView("Student");
    }

我想在这里显示我的结果：

<div id="ajaxDisplay">

但它没有给出任何结果

Answer 1

您的选择器应该只是元素的ID： SelectedItem （Not SelectedItem：selected），例如：

$( document ).ready(function() {
  $('#ajaxDisplay').html($('#SelectedItem').val());
});

http://jsbin.com/kuheg/1/edit?html,js,output

要在每次更改选择框时更新，您需要更改我的示例以包含事件侦听器：

$( document ).ready(function() {
  $('#SelectedItem').change(function() {
    $('#ajaxDisplay').html($('#SelectedItem').val());
  });
  $('#ajaxDisplay').html($('#SelectedItem').val()); //sets the HTMl from the default value
});

但是，问题是相同的，您要向服务器发送null以获取AJAX对象的data属性。 另一个可能的罪魁祸首是div - 它是否有一个结束div标签？ 很难说提供的代码。

jsbin更新了。

Answer 2

你需要接受成功的结果 - 像这样：

$('#SelectedItem').change(function(){
    $.ajax({
        url: '@Url.Action("ajaxGetValue", "Test")',
        type: "POST",
        data: {id:$('#SelectedItem:selected').val()},
    success: function(result){
        $('#ajaxDisplay').html(result);
    }
    });
});