JScript change function on MVC textboxfor event not firing

Question

So I have a textbox that is created in a for loop and the textbox needs to autosubmit the form on change. I had this working in a different page but not created within a loop. My code is as follows:

   using (Ajax.BeginForm("ReportInput","Reports",new AjaxOptions() { UpdateTargetId = "refresh", InsertionMode = InsertionMode.Replace }, new { @id = "refresh" }))
   {
.......for loop{
      //id of textbox <- only one of these textboxs is created at the moment.
      var temp = "#InputParameters_" + i +"__Value";
       <script type="text/javascript">
          $('@temp').change(function () {
          $('#refresh').submit();
          });
       </script>
       @Html.TextBoxFor(modelitem => Model.InputParameters[i].Value)
.......}
   }

With firebug the following error pops up on clicking on the textbox.

ReferenceError: reference to undefined property jQuery.event.triggered return event.result; jquery-1.9.1.js (line 3091) ReferenceError: reference to undefined property src.returnValue this.isDefaultPrevented = ( src.defaultPrevented || src.returnValue === false | jquery-1.9.1.js (line 3345) Use of getPreventDefault() is deprecated. Use defaultPrevented instead. src.getPreventDefault && src.getPreventDefault() ) ? returnTrue : returnFalse; jquery-1.9.1.js (line 3346) ReferenceError: reference to undefined property event.result return event.result;

Generated HTML:

<form id="refresh" method="post" data-ajax-update="#refresh" data-ajax-mode="replace" data-ajax="true" action="/Reports/ReportInput?Length=7">

<script type="text/javascript">
$('#InputParameters_0__Value').change(function () {
$('#refresh').submit();
});
</script>
<input id="InputParameters_0__Value" type="text" value="" name="InputParameters[0].Value">

Im stumped on why this isnt working, any help would be appreciated.

Mohammed Swillam · Accepted Answer · 2014-03-24 09:39:14Z

I think a better approach is to put your javascript block outside the for loop, taking into consideration that all of your textboxes IDs start with the same word "InputParameters", here is my thought solution:

1- You will generate your HTML as normal, just remove the part that renders the javascript from your loop.

2- At the end of your page, put a code block similar to the following one

<script type="text/javascript">
$(function(){
  $('[id^="InputParameters"]').change(function () {
  $('#refresh').submit();
  });
})
</script>

This code should get all the textboxes with an ID starting with "InputParameters" word, then it attaches the handler to the change event as normal.

This is better as it targets your textbox regardless of your randomly added string at the end, and should work as you expect.

Let me know if this has worked for you, or that you still need a tweak to this code.

Collectives™ on Stack Overflow

JScript change function on MVC textboxfor event not firing

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related