title: Serializing MVC model to JSON in view - Uncaught SyntaxError: Unexpected token i
body: <p>I am using JQWidgets and I am trying to serialize my model to JSON before using the JSON to populate a JQWidgets table. However I get this error:</p>
  
  <pre><code>Uncaught SyntaxError: Unexpected token i 
  </code></pre>
  
  <p>I think that my JSON is invalid because of how I serialize my model object by mixing RAZOR with javaScript/jQuery. This is the rest of my code:</p>
  
  <hr>
  
  <pre><code>public ActionResult _NewsWidget()
          {
  
              var v = JArray.Parse(JsonConvert.SerializeObject(news.GetNewsItems(), formatting: Formatting.Indented));
              var model = (from p in v
                                  select new ModelNewsWidget()
                                  {
                                      Id = p["UniqueId"].ToString(),
                                      ImagePath = "&lt;a onclick=\"initSingleNews(" + p["UniqueId"] + ")\" href=\"javasscript:void(0)\"&gt;" +
                                      "&lt;img style=\"width: 100px;\" alt=\"\" src=\"" + _imagePath + p["NewsItemImageReference"] + "\"&gt;&lt;/img&gt;" +
                                      "&lt;/a&gt;",
                                      BodyText = 
                                      "&lt;b&gt;" + p["Title"] + "&lt;/b&gt;&lt;/br&gt;&lt;/br&gt;" +
                                      "&lt;b&gt;" + p["AddedOn"].ToString().Substring(0, 10) + "&lt;/b&gt;&lt;/br&gt;" +
                                      p["BodyTextFormatted"].ToString().Substring(0, 18) + "&lt;/br&gt;&lt;/br&gt;" +
                                      p["BodyText"].ToString().Substring(18, 100).Insert(100, "...&lt;a class=\"newsMore\" href=\"#\" onclick=\"initSingleNews(" + p["UniqueId"] + ")\" &gt;More&lt;/a&gt;")
                                  }).ToList();
  
              ViewBag.StartupScript = "initNewsWidget();";
              return View("~/PartialViews/News/_NewsWidget.cshtml", model);
          }
  </code></pre>
  
  <p><strong>Partial View</strong></p>
  
  <pre><code>@model List&lt;AMT2014_Prototype.Models.News.ModelNewsWidget&gt;
  
  &lt;script&gt;
  
      function _createWindow() {
          $("#jqxwindow-news").jqxWindow({ width: 720, height: 600, autoOpen: false, draggable: true });
      };
  
      function bindNewsTable(data) {
          var source =
          {
              dataType: "json",
              dataFields: [
                  { name: 'id', type: 'int' },
                  { name: 'imagePath', type: 'string' },
                  { name: 'title', type: 'string' },
                  { name: 'text', type: 'string' }
              ],
              localData: data,
          };
          var dataAdapter = new $.jqx.dataAdapter(source);
  
          $("#newsTable").jqxDataTable(
          {
              source: dataAdapter,
              showHeader: false,
              autoRowHeight: false,
              width: '100%',
              columns: [
                  { text: 'Image', dataField: 'imagePath', width: 120 },
                  { text: 'Body Text', dataField: 'text', width: 320 }
              ]
          });
      }
  
  function initNewsWidget() {
      var json = '@Html.Raw(Json.Encode(Model))';
      console.log(json);
      bindNewsTable(json);
  }
  </code></pre>
  
  <p></p>
  
  <pre><code>&lt;div id='jqxWidget' caption="News" style="height: 400px; width: 600px;"&gt;
      &lt;div id="newsTable"&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div id='jqxwindow-news' style=" overflow: scroll;"&gt;
      &lt;div&gt;Details&lt;/div&gt;
      &lt;div id="newsDetailsTable" style="padding: 10px;"&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;script type="text/javascript" defer="defer"&gt;
      @Html.Raw(ViewBag.StartupScript)
  &lt;/script&gt;
  </code></pre>
  
  <p><strong>JSON LINT</strong></p>
  
  <pre><code>[
      {
          "Id": "6",
          "ImagePath": "&lt;a onclick="initSingleNews(6)" href="javasscript: void(0)"&gt;&lt;img style="width: 100px;" alt="" src="9750cf57-bc14-4205-9e6c-83c8406f3f82.jpg"&gt;&lt;/img&gt;&lt;/a&gt;",
          "BodyText": "&lt;b&gt;Tree fungus ID: Inonotus dryadeus&lt;/b&gt;&lt;/br&gt;&lt;/br&gt;&lt;b&gt;16/09/2013&lt;/b&gt;&lt;/br&gt;Ref: 204201/252874&lt;/br&gt;&lt;/br&gt;
  The fruiting bodies are those of a fungus called Inonotus dryadeus. Oak is the most common host of...&lt;a class="newsMore" href="#" onclick="initSingleNews(6)" &gt;More&lt;/a&gt;"
      }
  ]ick="initSingleNews(6)"&gt;More&lt;/a&gt;"
      }
  ]
  
  
  Results
  
  Parse error on line 4:
  ...Path": "&lt;a onclick="initSingleNews(6)" h
  -----------------------^
  Expecting '}', ':', ',', ']'
  </code></pre>
  
  <ol>
  <li>Should I return JSON from my controller instead? I had problems with encoding before which is why I am trying to encode my model in my view.</li>
  <li>Why is my JSON invalid in Lint?</li>
  </ol>