LabelFor + EditorFor 在同一行？

Question

I have this code:

<div class="editor-label">
    @Html.LabelFor(model => model.Ticket)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.Ticket)
    @Html.ValidationMessageFor(model => model.Ticket)
</div>

How do I get the label and checkbox(in this case its a checkbox) on the same line? I have tried removing the divs and they still come out on different lines.

Thank you.

Answer 1

Removing the didn't work for my app, but adding new { @style = "display:inline-block" } as the second argument on the LabelFor() did.

I prefer the checkbox before the label so it would be:

<div>
    @Html.EditorFor(model => model.GetAll)
    @Html.LabelFor(model => model.GetAll, new { @style = "display:inline-block" })
</div>

Answer 2

Just remove the divs separating them, this works for me, I get Ticket [] with this.

Also, use CheckBoxFor if you know it is a CheckBox

<div>
    @Html.LabelFor(model => model.Ticket)
    @Html.CheckBoxFor(model => model.Ticket)
    @Html.ValidationMessageFor(model => model.Ticket)
</div>

I have also used this code as the OP stated this is his code

<div class="editor-field">
    @Html.Label("SMS Alerts?")
    @Html.EditorFor(model => model.GetAll)
</div>

I get GetAll []

GetAll is a bool in my ViewModel

Also used this

<div>
    @Html.LabelFor(model => model.GetAll)
    @Html.EditorFor(model => model.GetAll)
</div>

I get GetAll []

And this

<div class="editor-field">
    @Html.LabelFor(model => model.GetAll)
    @Html.EditorFor(model => model.GetAll)
</div>

I get GetAll []

In every case my tests are label and checkbox are inline

Answer 3

In my case just add the row to the main div because I want to use the col-md-2

classes so after searching for solution when use col-*

classes then the parent element needs the row classes:

it was without row class

<div class="form-group ">

and just add row class:

 <div class="form-group row">
            @Html.LabelFor(model => model.BATCH_NO, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-3">
                @Html.EditorFor(model => model.BATCH_NO, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.BATCH_NO, "", new { @class = "text-danger" })
            </div>
        </div>