Uncaught ReferenceError: drop is not defined

[Matt]

It seems that every different attempt I try to get one dropdownlist to populate based on a different dropdownlist fails miserably.  Here's my latest attempt.

Instead of doing GridEditMode.InLine I'm doing GridEditMode.PopUp with this:

.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("EditTemplate"))

When I click the edit button I get:

Uncaught ReferenceError: drop is not defined
(anonymous function)
dt.extend.get
x.extend.get
D.widget.value.v.extend.init
_.extend.applyBinding
_.extend.bind
a
a
a
a
a
a
s
d.extend.refresh
d.extend.init
(anonymous function)
e.extend.each
e.fn.e.each
e.fn.(anonymous function)
T.extend._createPopupEditor
T.extend.editRow
(anonymous function)
f.event.dispatch
h.handle.i

Here is the code to EditTemplate:

@using GIS.Services.HTRAM.Types
@using HResource = ResourceHelper;

@model GIS.Services.HTRAM.Types.HtramProjectCategoryResults

<input name="DropDownSelected" type="Hidden" id="DropDownSelected" value="0" />

<script type="text/javascript">
    function filterCategoryValues() {
        return 13;
    }
</script>

<div class="display-label-table">
    <div class="display-label-row">
        @Html.Label(@HResource.HTRAMResource.Category, new { @class = "display-label-cell" })
        @(Html.Kendo().DropDownList()
          .Name("categories")
          .DataTextField("Name")
          .DataValueField("CategoryID")
          .DataSource(source => {
                   source.Read(read => {
                       read.Action("GetCategories", "Category");
                   });
              })
          .Value(Model.CategoryID.ToString())
        )

    </div>
</div>

@{
    if ( (ViewData["categoryValues"] as List<HtramCategoryValue>).Count > 0)
    {
    <div class="display-label-table">
        <div class="display-label-row">
            @Html.Label(@HResource.HTRAMResource.MilePostFrom, new { @class = "display-label-cell" })
            @Html.EditorFor(model => model.MilePostFrom, new { @class = "display-field-cell" })
            @Html.ValidationMessageFor(model => model.MilePostFrom)
        </div>
        <div class="display-label-row">
            @Html.Label(@HResource.HTRAMResource.MilePostTo, new { @class = "display-label-cell" })
            @Html.EditorFor(model => model.MilePostTo, new { @class = "display-field-cell" })
            @Html.ValidationMessageFor(model => model.MilePostTo)
        </div>
        <div class="display-label-row">
            @Html.Label(@HResource.HTRAMResource.Comment, new { @class = "display-label-cell" })
            @Html.EditorFor(model => model.Comment, new { @class = "display-field-cell" })
            @Html.ValidationMessageFor(model => model.Comment)
        </div>
        <div class="display-label-row">
            @Html.Label(@HResource.HTRAMResource.Reference, new { @class = "display-label-cell" })
            @Html.EditorFor(model => model.Reference, new { @class = "display-field-cell" })
            @Html.ValidationMessageFor(model => model.Reference)
        </div>

        @{
        if ((ViewData["categoryValues"] as List<HtramCategoryValue>)[0].Name != "")
        {
            <div class="display-label-row">
                @Html.Label(@HResource.HTRAMResource.Value, new { @class = "display-label-cell" })

                @(Html.Kendo().DropDownList()
                      .Name("category-drop-val")
                      .DataTextField("Name")
                      .DataValueField("CategoryValueID")
                      .DataSource(source => {
                            source.Read(read =>
                            {
                                read.Action("GetCategoryValues", "Category")
                                    .Data("filterCategoryValues");
                            })
                                .ServerFiltering(true);
                      })
                      .Enable(false)
                      .AutoBind(false)
                      .CascadeFrom("categories")
                      .Value(Model.CategoryValueID.ToString())
                      )
            </div>

        }
        else
        {
            <div class="display-label-row">
                @Html.Label(@HResource.HTRAMResource.Value, new { @class = "display-label-cell" })
                @Html.EditorFor(model => model.CategoryValue, new { @class = "display-field-cell" })
                @Html.ValidationMessageFor(model => model.CategoryValue)
            </div>
        }
        }
    </div>
    }
}
@Html.HiddenFor(model => model.ProjectID)
@Html.HiddenFor(model => model.CategoryID)
@Html.HiddenFor(model => model.CategoryID)
@Html.HiddenFor(model => model.CategoryName)
@Html.HiddenFor(model => model.CategoryValueID)
@Html.HiddenFor(model => model.CategoryWeight)
@Html.HiddenFor(model => model.CreateDate)
@Html.HiddenFor(model => model.CreateUser)
@Html.HiddenFor(model => model.ProjectID)
@Html.HiddenFor(model => model.ProjectsCategoryResultsID)
@Html.HiddenFor(model => model.VulnerabilityValue)

Does anyone have an idea what is causing this?

[Matt]

I forgot....
I'm hardcoding 13 here because I get this error:

<script>
    function filterCategoryValues() {
        return 13;
    }
</script>

Uncaught Error: Invalid template:'<script>    function filterCategoryValues() {        return {

This error is huge so I only pasted a portion.

[Matt]

I get the preceding error if I have this:

<script>
    function filterCategoryValues() {
        return {
            categories: $("#categories").val()
        };
    }
</script>

[Matt]

I have a workaround for this and no longer need this ticket.