MVC disable EditFor() based on value

Question

I'm using MVC 4

I have in my *.ascx page the following to display a textbox on a page:

<div class="editor-field inner">
       <%: Html.EditorFor(model => model.Number) %>
</div>

my model has a bool property allowEdit that indicates if the user should be allowed to edit a certain piece of information. When the value is false, I want to still show the textbox but disable it.

I've tried using jquery as follows:

<script type="text/javascript">
    $(document).ready(function () {
        var myModel = '<%=Model.allowEdit%>';

        if(myModel == false)
        {
            alert("HELLO");
        }
        });
</script>

How can i dynamically enable/disable certain textboxes based on model value?

Try using myModel === 'false'. 'false' == false evaluates to false. — JLRishe
– JLRishe, Commented Jan 28, 2015 at 19:50
Also could you show the view the html that the EditorFor is injecting in. — mattfetz
– mattfetz, Commented Jan 28, 2015 at 19:50
sorry, the alert("HELLO"); was left in for testing and I was not able to see it either... I will try @Erik's answer and see how it goes — fifamaniac04
– fifamaniac04, Commented Jan 28, 2015 at 21:29

Erik Funkenbusch · Accepted Answer · 2015-01-29 17:08:29Z

3

First, let me say that you need to do validation not just on the client, but on the server as well. Since a client could bypass the javascript, or submit values manually to bypass it.

Having said that, if you're using MVC5.1 or greater, you can simply do this:

<%: Html.EditorFor(model => model.Number, new { htmlAttributes = 
   Model.allowEdit ? (object)new {} : new { disabled = "disabled" }}) %>

Also, be aware that disabled controls do not post their values back to the server, so make sure that your post handler isn't expecting the value. You could replace disabled with readonly above to use the readonly attribute instead.

EDIT:

If you can't use MVC5.1 or later, then you have two choices. Either create a custom EditorTemplate, which is probably more work than it's worth for this. Or just use TextBoxFor instead. You would change the syntax slightly to this:

<%: Html.TextBoxFor(model => model.Number, 
        Model.allowEdit ? (object)new {} : new { disabled = "disabled" }) %>

edited Jan 29, 2015 at 17:08

answered Jan 28, 2015 at 19:53

Erik Funkenbusch

93.7k29 gold badges201 silver badges292 bronze badges

Sign up to request clarification or add additional context in comments.

15 Comments

Tommy Over a year ago

Given that disabled controls do not post their values back, if that is something that one needs, use the readonly property on the control. This prevents changing the value but still allows the value to POST back (and be copied from the text box) w3schools.com/TAGS/att_input_readonly.asp

dom Over a year ago

Pretty sure this won't work. I believe setting disabledto an empty string also makes the input disabled. Edit: in fact, whatever value you give it, as long as the attribute is present, the input ends up disabled.

Erik Funkenbusch Over a year ago

@Dom As of razor2, that should not render if it's empty.

dom Over a year ago

@Erik You're right, actually. Didn't notice you used EditorFor. I guess it should be noted that TextBoxFor will actually render empty attributes though.

Erik Funkenbusch Over a year ago

@Dom - no, looks like you're right.. Razor2+ will only not render if it's actually in the html not if it's in a helper. I'll update.

|

Collectives™ on Stack Overflow

MVC disable EditFor() based on value

1 Answer 1

15 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

15 Comments

Your Answer

Sign up or log in

Post as a guest

Related