CODEWITHSUNDEEP
htmlasp.net-mvc-4razor
user2739679
user2739679

Reputation: 847

Html.EditFor Onchange Event

I am developing an MVC4 application.
I want to change IsChanged field in my Model, when model.ExternalVenderNo is changed.

Below are codes on View page 

 <div class="editor-field">
        @Html.EditorFor(model => model.ExternalVenderNo, new { @onchange = "OnChangeEvent();" })
        @Html.ValidationMessageFor(model => model.ExternalVenderNo)
    </div>

and

 function OnChangeEvent()
{
    alert("value is changed");
    @{ Model.IsChanged = true;
    }
}

To check whether OnChangeEvent is being called , i put alert. But alert is also not working.
it means OnChangeEvent is not beign called.

I just want to change IsChanged field to true, when model.ExternalVenderNo is changed.

Model has bool IsChanged

Upvotes: 12

Views: 52432

Answers (5)

Truong Mai Van
Truong Mai Van

Reputation: 147

                <td>


                    @Html.EditorFor(modelItem => item.mahang,
                        new
                        {
                            htmlAttributes = new
                            {
                                @class = "text",
                                 id = @item.id,
                                 onkeydown = "return  event.keyCode != 13",
                                onChange = "replaceContentsOfDivupdatecodename(**this.id**, this.value)"
                            }
                        })

                    @Html.ValidationMessageFor(modelItem => item.mahang)



                </td>

it take me 3 day to find out it, may be it helf ful so some one i use this.id to take value and input to fuction script

 <script>
function replaceContentsOfDivupdatecodename(idxoa, mahang) {
    $.ajax({
        url: '@Url.Action("AddPaialTransferUpdate", "Home")',
        data: {
            id: "_DetailTransferlist.cshtml",
            mahang: mahang,
            idxoa: idxoa
        },
        type: "POST",
        success: function(data) {
            $('#placeHolderDiv2').html(data);
        }
    });
}

Upvotes: 0

Mark
Mark

Reputation: 131

Try adding to attributes

@Html.EditorFor(model => Model.Lengthofside1, new {  htmlAttributes = new { onchange = "OnChangeEvent(this)", @class = "form -control text-right" } })

This worked for me.

Upvotes: 13

Dilip Langhanoja
Dilip Langhanoja

Reputation: 4525

The following will definitely work for you.

$(document).ready(function()
{
   $('#ExternalVenderNo').on("change", function()
   {
      alert('Changed!');
   });
});

Upvotes: 6

AthibaN
AthibaN

Reputation: 2087

Try the same with @Html.TextBoxFor

@Html.TextBoxFor(model => model.ExternalVenderNo, new { onchange = "OnChangeEvent()" })

<script type="text/javascript">
 function OnChangeEvent(){
    alert("value is changed");
    @Model.IsChanged = true;
 }
</script>

or leave Jquery to handle the change event

@Html.EditorFor(model => model.ExternalVenderNo)

<script type="text/javascript">
$('#ExternalVenderNo').change(function(){
    alert('Changed!');
    @Model.IsChanged = true;
});
</script>

Upvotes: 19

Matt Bodily
Matt Bodily

Reputation: 6423

try jquery for this

$('#ExternalVenderNo').change(function(){
    alert('Changed!');
});

Upvotes: 1

Related Questions