current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Join the Stack Overflow Community
Stack Overflow is a community of 6.5 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up
up vote 0 down vote favorite
1

I have a cshtml as follow,

DoPost.cshtml

@using (Html.BeginForm("Purchase", "PurchaseOrder", FormMethod.Post, new { @id = "frmPurchase" }))
{

// statements

// statements

<input type="button" id="submitPurchase" onclick = "myPurchase()" value="Select" />
}

In Javascript I have an array strings in variable "ExtraItems"

ExtraItems[0] ="123"
ExtraItems[1] ="124"
ExtraItems[2] ="125"

My Action which accept the data is as follows,

public ActionResult Purchase(PurchaseOrderModel model)
        {            
            //Do some stuff with the passed data
            return View("Purchase", model);
        }

In the above PurchaseOrderModel, I have the property 

public string[] SelectedProducts { get; set; }

to accept the Javascript Array elements.

What I tried: The simple post did not work as the JavaScript array elements are not part of the Form elements,I couldn't use a @Html.HiddenFor because it is an array.

Hence tried to do an Ajax post under function myPurchase(),

$a.post('@Url.Action("Purchase", "PurchaseOrder")', { SelectedProducts: ExtraItems });

Here I did not get the ExtraItems details under model.SelectedProducts in the action. The biggest issue was i wanted to load the Purchase.cshtml View from the action, instead I got the controll back to the Jquery Post.

Please help me how can I solve this.

share|improve this question
up vote 1 down vote accepted

Take a string property in your model and then send the data as comma separated string

var dataToSent = ExtraItems.join(',')

If you have a property named Datum of type string in your model Purchase then the data to be sent will be, passing model

data : 'Datum=' + dataToSent

In your action you can split data into array also for return response you have to redirect the page in the success function of your ajax call

$.ajax( {
        type: 'POST',
        url: '/Default1/Index',
        data: { SelectedProducts: ExtraItems },

        traditional: true,
        success: function ( response )
        {
            window.location.href = "/controller/action" <--your url


        }
    } );
share|improve this answer
    
No I need to pass a model too. return View("Purchase", model); The model is updated with the ExtraItems data. So it is not possible to pass using window.location, as the model has too much data. – TBA Jul 9 '14 at 12:47
    
@TBA write the response to the screen . .document.write(response) – Arjuna Jul 9 '14 at 12:58
    
document.write does worked !! thanks :) – TBA Jul 10 '14 at 11:42
    
you should consider this post : Why is document.write considered a “bad practice”? – NicoD Jul 10 '14 at 12:11
up vote 3 down vote

You should post your javascript array as a json object. You use the JSON.stringify() method converts a value to JSON. Something like :

 $.ajax({
        url: '@Url.Action("Purchase", "PurchaseOrder")',
        type: 'POST',
        contentType: 'application/json',
        data: JSON.stringify({ 
            SelectedProducts: ExtraItems
        })
    });
share|improve this answer
    
Thanks, The problem is it is not doing the return View("Purchase", model); part. I came back to my success part of Ajax but no redirection. – TBA Jul 9 '14 at 12:21
up vote 2 down vote 
Here is my example for solving your issue
-----------------------------------------
//Script
@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>
<script>
    var ExtraItems = ["aa","bb","cc","ff"];
    function a()
    {
        $.ajax( {
            type: 'POST',
            url: '/Default1/Index',
            data: { SelectedProducts: ExtraItems },

            traditional: true,
            success: function ( response )
            {
                alert( 'Sucs' );


            }
        } );
    }

</script>
<button onclick="a();">click</button>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.js"></script>

//Controller

 [HttpPost]
        public ActionResult Index( string[] SelectedProducts )
        {
              return View();
        }
share|improve this answer
    
Thanks Arun But, I get the success and Alert too, however the return View(); part does't work?? – TBA Jul 9 '14 at 12:31
    
Do you want to redirect to another view? – ARUNRAJ Jul 9 '14 at 12:32
    
You cant redirect through return View() when using ajax.You should redirect from javascript.success: function ( response ) { window.location.href = "/controller/action" <--your url } – ARUNRAJ Jul 9 '14 at 12:37
    
Sorry I have some model to be passed to the view which is pretty big. Return View("Purchase", model). I think then I should post this data right? – TBA Jul 9 '14 at 12:46
    
Ok then you use a hidden field.Save that array to hidden field and bind it to model – ARUNRAJ Jul 9 '14 at 13:17
up vote 1 down vote

Use $.ajax function with the option traditional:true for enabling ASP.NET MVC default model binding for the list of string items.

share|improve this answer
    
Thanks, The problem is it is not doing the return View("Purchase", model); part. I came back to my success part of Ajax but no redirection. – TBA Jul 9 '14 at 12:22

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.