CODEWITHSUNDEEP
c#jqueryasp.net-mvcrazor
Dinand
Dinand

Reputation: 359

MVC checkbox by loading, check to disable textbox

Who can help me. When loading data to a mvc view, i'll load the value of the checkbox, but if true, i'll need to disable 2 textbox fields.

Code is a piece of my for loop

@Html.TextBoxFor(m => m.Items[i].StartIntervalTime, "{0:HH:mm}", new {                   
               Value = Model.Items[i].Available ? "" : Model.Items[i].StartIntervalTime.ToString("HH:mm"),
               id = "startTime" + i                                      
})
<span>untill</span>
@Html.TextBoxFor(m => m.Items[i].EndIntervalTime, "{0:HH:mm}", new {
               Value = Model.Items[i].Available ? "" : Model.Items[i].EndIntervalTime.ToString("HH:mm"),
               id = "endTime" + i
})
@Html.CheckBoxFor(m => m.Items[i].Available, new { id = i, @class = "closedallday" })

I've tried, in the textbox tag, with "disabled" like i did with "value", but disabled will always disables the textbox even without a value. So..

Disabled = Model.Items[i].Available ? "disabled" : "",

I need a real working solution.

Thank you Dinand

Upvotes: 1

Views: 3886

Answers (3)

joetinger
joetinger

Reputation: 2729

I would use jQuery to catch the change in the checkbox then alter your text boxes. Here is a working jsfiddle

jQuery

$('#checkbox').on("change", function () {
    if ($(this).is(":checked")) {
        textbox.addClass('disabled');
        textbox.val("");
        textbox.prop('disabled',true);
    }else {
        textbox.removeClass('disabled');
        textbox.prop('disabled',false);
    }
}

CSS

.disabled {
    background-color:lightgray;
}

Upvotes: 1

Younis Qadir
Younis Qadir

Reputation: 435

Simply make it with jquery

<script>
    jQuery(document).ready(function() {
        if ($("input:checkbox").is(":checked")) 
        {               
             $("input:text").prop("readonly", "readonly");
        }
    });
</script>

Upvotes: 0

user2120121
user2120121

Reputation: 655

You can make something like this:

//Check if the value is true, draw the textbox disabled , otherwise draw it normally:

  if(m.Items[i].Availabl == true)
    {
     @Html.TextBoxFor(m => m.Items[i].StartIntervalTime, "{0:HH:mm}"
    , new {ANYTHINK ELSE, disabled="disabled" })
    }
    else
    {
    @Html.TextBoxFor(m => m.Items[i].StartIntervalTime, "{0:HH:mm}"
    , new {ANYTHINK ELSE })
    }

Upvotes: 2

Related Questions