0

I have this code on my Create view.

<div class="col-lg-6">
        <!--Ingredients-->
        @Html.LabelFor(model => model.Ingredients, htmlAttributes: new { @class = "control-label col-md-2" })<br />
        <textarea class="form-control" id="ingredients" rows="20" onsubmit="PopulateIngredients()"></textarea>
    </div>


    <script>
        function PopulateIngredients()
        {
            var ingredientArray = document.getElementById('ingredients').val().split('/n');
            if (ingredientArray.length !=0)
            {
                for (i = 0; i < ingredientArray.length; i++)
                {
                    @(Model.Ingredients).Add(ingredientArray[i]);
                }

            }

        }
    </script>

When the page is loading I get an error in the script saying "Object reference not set to an instance of an object." at this line;

    @(Model.Ingredients).Add(ingredientArray[i]);

Two problems exist. One is that I should be seeing the model.Ingredients IEnumerable object. Two is that his script shouldn't run until the submit button is clicked.

What am I doing wrong? I have to use a text area for input so I have to split it and add it to the ingredient list before it is posted back to the controller where it is handled as a list of ingredient objects. I did not include the classes for brevity.

Deblaton Jean-Philippe
  • 11,188
  • 3
  • 49
  • 66
ScottinTexas
  • 171
  • 1
  • 19
  • What is that serverside markup (with the `@`), ASP? Please tag your question with it. – Bergi May 02 '15 at 11:57
  • That error message is a .NET error, and the code is still parsed at runtime, even if the javascript function isn't called. – adeneo May 02 '15 at 11:59
  • And it looks like a dupe of this -> http://stackoverflow.com/questions/779091/what-does-object-reference-not-set-to-an-instance-of-an-object-mean – adeneo May 02 '15 at 11:59
  • isn't this a problem of javascript executing before the DOM is loaded ?.. – user1428716 May 02 '15 at 13:13
  • Are you passing a model to this view? It looks like @Model == null. And you can't mix JavaScript client-side code with the server-side Razor code (in this way). It'll not work. – romanoza May 02 '15 at 13:27
  • Yes I am passing the model. I could have included the entire cshtml but I did not because I didn't think it was necessary. I just included the lines that are causing a problem. – ScottinTexas May 02 '15 at 13:33
  • You don't pass the model in cshtml, but in the server-side C# code. Could you please show your controller code and the model code? – romanoza May 02 '15 at 13:39

2 Answers2

1
@(Model.Ingredients).Add(ingredientArray[i]);

is a server side script which will be executed when the view is prepared. So this line will be executed when you load the page. And that is why you are getting null reference error, because Model.Ingredients is not yet initialized.

Vikash Kesarwani
  • 850
  • 5
  • 14
  • Do you have any suggestions on how to handle this problem then? I am going to have to do something like this for a few more fields so I need to understand the problems. – ScottinTexas May 02 '15 at 13:34
  • You can use JSON string to post these values. First add these elements to an javascript array (say myArray), then create an JSON object some thing like this (var obj = {Ingredients : myArray}). then create the data to be send (data = JSON.stringify(obj)), then post this data using ajax. – Vikash Kesarwani May 02 '15 at 17:25
0

It looks like @Model == null. You have to pass the model instance to the view:

return View(model);

And you can't mix the JavaScript client-side code with the server-side Razor code (in the way you do it). It'll not work.

This might be helpful: Mix Razor and Javascript code or Mixing JavaScript and Razor syntax

Community
  • 1
  • 1
romanoza
  • 4,775
  • 3
  • 27
  • 44
  • I read the two references. No good. I just need a way to add items to the list in this javascript function. Unless there is a better way to post the list during the save. – ScottinTexas May 02 '15 at 17:11
  • @ScottinTexas You can do this in many ways, but I can't help you until you post the code of the controller and the model. I need to know what your data types are and how you want to interpret the values sent to the controller. – romanoza May 02 '15 at 19:31