Unexpected token ILLEGAL while assigning Razor Code to JavaScript variable

Question

I am using JavaScript to dynamically add rows to a table using ASP .NET MVC's Razor syntax.Assigning a text-box to a variable works fine However, when I want to assign a drop-down list , it throw's an error - "Unexpected Illegal Token".

   var expH = '@Html.DropDownList("TransDebit[{id}].Expenditure_Head",new SelectList(ViewBag.ExpCodes,"Expenditure_Code","Expenditure_Code"))';

Converts to (As seen from chrome's console) :

var expH = '<select id="TransDebit__id___Expenditure_Head" name="TransDebit[{id}].Expenditure_Head"><option value="313">313</option>
<option value="414">414</option>
</select>';

Which is exactly what I want but why does it throw an error ? I can't see anything wrong with it. Please Help. Thanks. EDIT 1: SCREENSHOT

I doubt very much that that's what you want since it would never bind to anything. What is `{id}`? — , Mar 13 '16 at 06:56
@StephenMuecke I replace {id} to datetime to assign each one a unique id. — shubhamr, Mar 13 '16 at 06:57
Because if you want to bind to a collection it needs to be `name="TransDebit[0].Expenditure_Head"`, `name="TransDebit[1].Expenditure_Head"` etc. If you want to dynamically add collection items, suggest you look at the answers [here](http://stackoverflow.com/questions/29161481/post-a-form-array-without-successful/29161796#29161796) and [here](http://stackoverflow.com/questions/28019793/submit-same-partial-view-called-multiple-times-data-to-controller/28081308#28081308) — , Mar 13 '16 at 07:01
what if I replace `{id}` by count ? by using `ExpH.replace("{id}", count)` — shubhamr, Mar 13 '16 at 07:03
The problem is your have invalid `{` and `}` characters - but look at the links I gave you to understand how to do this correctly. — , Mar 13 '16 at 07:06
Ok .I will read your links. Strange Though `var ExpH = '@Html.TextBox("TransDebit[{id}].Expenditure_Head")'` works completely fine. — shubhamr, Mar 13 '16 at 07:11
Can you provide your Viewbag data?? I am trying to replicate your issue on my side — Rajshekar Reddy, Mar 13 '16 at 08:17
@Reddy ViewBag.ExpCodes data contains two values as shown :313 and 414. — shubhamr, Mar 13 '16 at 08:20
`Unexpected token ILLEGAL` this error is because your Razor expression rendered in multiple lines and javascript cant find a proper line ending and throws as error. you can notice that there is not string concatenation — Rajshekar Reddy, Mar 13 '16 at 08:22
What you can do is render it properly in Razor code but keep it hidden and then access it from the javascript code and use it. — Rajshekar Reddy, Mar 13 '16 at 08:24

score 0 · Accepted Answer · edited May 23 '17 at 11:50

Thanks To Stephen , I have finally found a work-around. What I did was create an hidden div only for this variable:

<div id="NewDebit" style="display:none">

 @Html.DropDownList("TransDebit[{id}].Expenditure_Head", new SelectList(ViewBag.ExpCodes, "Expenditure_Code", "Expenditure_Code"),"Select Expenditure Code")

</div>

and the in my java script code:

var ExpH = document.getElementById("NewDebit").innerHTML;

This works great , I think the error might be there due to some character escape issue.

Unexpected token ILLEGAL while assigning Razor Code to JavaScript variable

1 Answers1