c# mvc4 Html.DropDownListFor calling the controller

Question

I have browsed through several posts and several codes and none of them seems to work.

I need to reload a WebGrid based on a DropDown selected key on same page, partial views. I am now building the dropdown element and using this code in the view:

@Html.DropDownListFor(model => model.Users, Model.Users, 
                                         new { autopostback = "true" })

Along with the following javascript code:

<script type="text/javascript">
    $(document).ready(function () {
        $('select:[autopostback=true],input[type=checkbox]:[autopostback=true],input[type=radio]:[autopostback=true]')
      .live('change',function () {
            $(this).closest('form').submit();
        });
    });
</script>

Javascript Console at browser says:

Uncaught Error:Syntax error, unrecognized expression:select:[autopostback=true],
         input[type=checkbox]:[autopostback=true],
         input[type=radio]:[autopostback=true]

No calls are being done at Controller. What am I doing wrong?

Thanks.

[EDIT]

As this is now working, here goes what IS working so far:

<script type="text/javascript">
    $(function () {
        $("#UserList").change(function (e) {
            var _this = $(this);

            $.post("@Url.Action("List","MainController", Model)", _this.closest("form").serialize(),
                                                             function (response) {
                                                                 // do something with response.
                                                             });
  });

And the View:

                <td class="tdatadata">@Html.DropDownList("UserList", Model.Users, new { autopostback = "true" })</td>

And the ViewModel:

public class ModelViewModel
{
    public int idSelected { get; set; }

    [Display(Name = "Usuários Cadastrados")]
    public IEnumerable<SelectListItem> Users { get; set; }
}

But I still have a problem: How to pass the selected field to the controller action ? I tried using DropDownListFor, but in that case I loose the object name and them the Jscript does not work.

why are you using such a huge selector you can just use id

COLD TOLD
– COLD TOLD

2013-09-18 02:19:47 +00:00
Commented Sep 18, 2013 at 2:19 — COLD TOLD
– COLD TOLD, Commented Sep 18, 2013 at 2:19
Would you be kind to tell me how to use id ?

Mendes
– Mendes

2013-09-18 13:02:38 +00:00
Commented Sep 18, 2013 at 13:02 — Mendes
– Mendes, Commented Sep 18, 2013 at 13:02

PSL · Accepted Answer · 2013-09-18 02:26:13Z

3

Try this:

$(document).ready(function () {
    $('select[autopostback=true],input[type=checkbox][autopostback=true],input[type=radio][autopostback=true]').live('change',function () {
        $(this).closest('form').submit();
    });
});

Remove column ":" from the selector which is a meta character and makes the selector invalid, also you don't need them.

EIther try to use id or to get all the input fields of the form use jquery :input selector $('form :input') to select all the input fields of the form.

i.e

$('form').find(':input').live('change',function () {
     $(this).closest('form').submit(); 
});

Also note that live has been deprecated and if you are using jquery version >=1.7 use on() instead of live

edited Sep 18, 2013 at 2:26

answered Sep 18, 2013 at 2:19

PSL

124k21 gold badges257 silver badges243 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Mendes Over a year ago

Thanks PSL for help. Did the changes and still npt working. Getting Uncaught TypeError: Object [object Object] has no method 'live' error from Javasctipt console. Can you please put the full view code. Thanks.

PSL Over a year ago

Use on instead of live as I have mentioned in my answer

PSL Over a year ago

@Mendez live has been deprecated in newer versions of jquery. here is an example jsfiddle.net/tjSmu

Konrad Kokosa · Accepted Answer · 2013-12-05 00:47:40Z

2

Try removing : and change .live by .on.

$(document).ready(function () {
    $('select[autopostback=true],input[type=checkbox][autopostback=true],input[type=radio][autopostback=true]').on('change',function () {
        $(this).closest('form').submit();
    });
});

edited Dec 5, 2013 at 0:47

Konrad Kokosa

17k2 gold badges41 silver badges59 bronze badges

answered Dec 5, 2013 at 0:30

Cherif

211 bronze badge

Collectives™ on Stack Overflow

c# mvc4 Html.DropDownListFor calling the controller

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related