Array not passing from Javascript to MVC

Question

I'm trying to pass an array from javascript back into my MVC app. There is a console.log(selected) in the javascript and it outputs an array of data:

["<img src="https://owlexpress.kennesaw.edu/stugifs/open.gif">", "MATH 1190/01 - Calculus I", "84528", "       4.000", "Full Term", "40", "34", "6", "0", "0", "0", "Kennesaw Campus", "Classroom - 100%", "Mathematics &amp; StatisticsRoom 108", "8:00 am - 9:10 amLecture", "Aug 17, 2015", "Dec 14, 2015", "Xiaohui Rebecca  Shi (P)", ""]

But when the breakpoint in the controller hits I see that selectedClassesArray == null

Javascript:

$('#WatchButton').on('click', function (e) {
    var selected = [];
    $("tr.selected").each(function () {
        $(this).find('td').each(function(){
            selected.push($(this).html());                
        });
    });
    console.log(selected);
    $.ajax({
        type: "POST",
        url: "/ClassSearch/watchClasses",
        // I have tried setting data both ways with the same result:
        //data: { selectedClassesArray: selected },
        data: [selected],
        traditional: true,
        success: function (data) { alert("SUCCESS"); }
    });
});

ViewModel:

public class SelectedClassesArray
{
    public string[] arrayOfClasses { get; set; }
}

Controller ACtion:

//Had to set ValidateInput to false since one of the strings contains < (it errored without this)
[HttpPost, ValidateInput(false)]
    public ActionResult watchClasses(IEnumerable<SelectedClassesArray> selectedClassesArray)        
    { //Breakpoint here shows that selectedClassesArray is null
        foreach (var item in selectedClassesArray)
        {
            Console.WriteLine(item.ToString());
        }
        return View();
    }

DontVoteMeDown · Accepted Answer · 2015-04-15 18:11:44Z

2

Your action is expecting a List of arrays:

watchClasses(IEnumerable<SelectedClassesArray> selectedClassesArray)

You probably want to get only the array, which is in the view model:

watchClasses(SelectedClassesArray selectedClassesArray)

And what @taxicala said makes sense, try passing only the array, not an array inside another array:

data: { selectedClassesArray: selected }

The posted property name must match the view model parameter's name.

edited Apr 15, 2015 at 18:11

answered Apr 15, 2015 at 18:06

DontVoteMeDown

21.5k10 gold badges72 silver badges113 bronze badges

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

7 Comments

Jrow Over a year ago

Using data: selected lets me then see the property arrayOfClasses but it's still empty as seen here http://imgur.com/Eg0hsiP

DontVoteMeDown Over a year ago

@Jrow but did you change the action params as I said ?

Jrow Over a year ago

Yes, it's

[HttpPost, ValidateInput(false)]         public ActionResult watchClasses(SelectedClassesArray selectedClassesArray)                 {                          return View();         }

now

DontVoteMeDown Over a year ago

@Jrow ok, I'm almost sure that if you use watchClasses(string[] arrayOfClasses) it will work. I'm afraid for using that class as parameter you would change a little you data to post.

DontVoteMeDown Over a year ago

@Jrow how it worked, with watchClasses(string[] arrayOfClasses) ?

|

taxicala · Accepted Answer · 2015-04-15 18:03:53Z

0

Did you try:

$.ajax({
    type: "POST",
    url: "/ClassSearch/watchClasses",
    // I have tried setting data both ways with the same result:
    //data: { selectedClassesArray: selected },
    data: selected,
    traditional: true,
    success: function (data) { alert("SUCCESS"); }
});

Or perhaps the traditional serialization is failing:

$.ajax({
    type: "POST",
    url: "/ClassSearch/watchClasses",
    // I have tried setting data both ways with the same result:
    //data: { selectedClassesArray: selected },
    data: { selectedClassesArray: selected },
    traditional: false,
    success: function (data) { alert("SUCCESS"); }
});

answered Apr 15, 2015 at 18:03

taxicala

21.8k7 gold badges41 silver badges67 bronze badges

1 Comment

Jrow Over a year ago

When I use data: { selectedClassesArray: selected} I get this http://imgur.com/IvaUNNp and when I use data: selected I get this http://imgur.com/Eg0hsiP so it seems like data: selected is working "better"?

Collectives™ on Stack Overflow

Array not passing from Javascript to MVC

2 Answers 2

7 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related