Cleared textbox not being propigated to model

[Chrys]

I have a grid with a client template view attached. In the template view I have a textbox inside a span that I hide or show depending on the value of a textbox next to it. When the hidden textbox is hidden I want to clear its value. In jquery the setting the value of the hidden textbox by $('textboxid').val(''); works visually but this not propegating to the model when I save. here is my Form with the jquery i'm trying to use in it.

@model Papr2WebMvc4.Models.PiprForms.Tobacco

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)
    <h2>Edit Refering Tobacco users</h2>
    <fieldset>
        <legend></legend>
        <div>
            <label>Month</label>
            @Html.TextBoxFor(model => model.Month)/@Html.TextBoxFor(model => model.Year)
        </div>
        <div>
            <label>Number of peope referred this month to:</label>
            <div>
                <div>
                    <span>
                        <label>Quitline</label>
                        @Html.TextBoxFor(model => model.Count)
                    </span>
                </div>
                <div>
                    <span>
                        <label>QuitNet</label>
                        @Html.TextBoxFor(model => model.Count2)
                    </span>
                </div>
                <div>
                    <span>
                        <label>Local Cessation</label>
                        @Html.TextBoxFor(model => model.Count3)
                    </span>
                    <span class="hiddenElement" style="display: none">
                        <label>Local Group Name</label>
                        @Html.TextBoxFor(model => model.FormName)
                    </span>
                </div>
            </div>
        </div>
    </fieldset>
    <script>
        $(window).load(function () {
            trace("Begin");
            alert($('#Count3').val());
            var localCessation = $('#Count3').val();
            trace(localCessation);
        });
        $(document).ready(
            function myfunction() {

                trace("Begin");

                $('#Count3').change(function (event) {

                    trace("Text Changed");

                    var text = $(this).val();
                    if (text) {
                        trace("Has Text");
                        $('.hiddenElement').show("fast");
                    }
                    else {
                        trace("No Text");
                        $('#FormName').val(null);
                        $('.hiddenElement').hide("fast");
                    }

                });
            });
    </script>
}

Here is the grid it my form is connected to.

@(Html.Kendo()

   .Grid<Papr2WebMvc4.Models.PiprForms.Tobacco>()

   .Name("tobaccoGrid")

   .HtmlAttributes(new { @class = "primaryGridStyle" })

   .Columns(columns =>

   {

       columns.Bound(form => form.Date).Title("Date").Format("{0:M/yyyy}");

       columns.Bound(form => form.Count).Title("Quitline");

       columns.Bound(form => form.Count2).Title("QuitNet");

       columns.Bound(form => form.Count3).Title("Local Cessation");

       columns.Bound(form => form.FormName).Title("Local Group Name");

       columns.Command(command => { command.Edit(); command.Destroy(); }).Width(100);

   })//end columns

 

 

   .Editable(edit => edit.Mode(GridEditMode.PopUp).TemplateName("AddEditTobacco"))

 

   .ToolBar(toolbar => toolbar.Create())

 

   .Sortable()

 

   .Filterable()

 

   .Pageable(page => page.PageSizes(true))

 

   .DataSource(datasource => datasource

       .Ajax()

 

       .Model(model => model.Id(tobacco => tobacco.Id))

 

       .ServerOperation(false)

 

       .Read(read => read.Action("GetForm", "Form", new

       {

           planId = Convert.ToInt32(Session["PlanId"]),

           planActivityId = Model.PlanActivityId,

           activityType = Model.ActivityType,

           activityTypeId = Model.ActivityTypeId

       }))//end read

 

       .Create(create => create.Action("AddForm", "Form", new { planActivityId = Model.PlanActivityId, activityTypeId = 11 }))//end create

 

       .Update(update => update.Action("EditForm", "Form", new { planActivityId = Model.PlanActivityId, activityTypeId = 11, activityType = Model.ActivityType }))//end update

 

       .Destroy(update => update.Action("DeleteForm", "Form", new { planActivityId = Model.PlanActivityId }))//end destroy

        

       .Events(events=>events.RequestEnd("onRequestEnd"))//end events

   )//end datasoruce

 

   )@*End tobacco grid*@

Is there something else I should be using to reset the textbox value so it is consumed by my model using javascript/jquery.

[Petur Subev]

Hello Chrys,

Indeed, updating the html with JavaScript wont affect the underlying model which the Grid uses. You need to change the model with the .set('TheField','TheValue') method (this will also automatically apply changes to the HTML).
To get reference to the model which is currently being edit you can use the following code:

var model = $('#gridName').data().kendoGrid.editable.options.model;
model.set('FirstName','The Name IsChanged');

Kind Regards,
Petur Subev
the Telerik team