none
Vista Create y Edit alineadas RRS feed

  • Pregunta

  • Hola a todos, como hago para que en mi vista create  aparezcan dos o tres campos por linea alieneados? algo como:

    Fecha:     _______________________ Nombre:_______________________

    Apellido:  _______________________ Ciudad: _______________________

    Gracias.   

    lunes, 24 de junio de 2013 19:43

Todas las respuestas

  • hola

    podrias usar el tag <hr>

    Horizontal Lines!

    saludos


    Leandro Tuttini

    Blog
    Buenos Aires
    Argentina

    lunes, 24 de junio de 2013 20:31
  • Pero se puede usar esta tag dentro del fieldset? Esta es mi vista Create que quiero arreglar:

    @using (Html.BeginForm()) {
        @Html.ValidationSummary(true)
        <fieldset>
            <legend>Solicitudes</legend>

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

            <div class="editor-label">
                @Html.LabelFor(model => model.Id_Servicio, "Servicios")
            </div>
            <div class="editor-field">
                @Html.DropDownList("Id_Servicio", String.Empty)
                @Html.ValidationMessageFor(model => model.Id_Servicio)
            </div>

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

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

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

            <div class="editor-label">
                @Html.LabelFor(model => model.Id_Medio, "Medios")
            </div>
            <div class="editor-field">
                @Html.DropDownList("Id_Medio", String.Empty)
                @Html.ValidationMessageFor(model => model.Id_Medio)
            </div>

            <div class="editor-label">
                @Html.LabelFor(model => model.Id_Estado, "Estados")
            </div>
            <div class="editor-field">
                @Html.DropDownList("Id_Estado", String.Empty)
                @Html.ValidationMessageFor(model => model.Id_Estado)
            </div>

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

            <div class="editor-label">
                @Html.LabelFor(model => model.Prioridad, "Prioridad1")
            </div>
            <div class="editor-field">
                @Html.DropDownList("Prioridad", String.Empty)
                @Html.ValidationMessageFor(model => model.Prioridad)
            </div>

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


            <p>
                <input type="submit" value="Crear" />
            </p>
        </fieldset>
    }

    lunes, 24 de junio de 2013 21:10
  • mm si en ese caso no creo que aplique

    lo que no entendi es esta linea a que control se la quieres definir ? es a un textbox o a un label

    porque podrias definir un estilo que aplique un subrayado a la fuente

    si ese label no tiene contenido podrias poner espacios con &nbsp;

    saludos


    Leandro Tuttini

    Blog
    Buenos Aires
    Argentina

    lunes, 24 de junio de 2013 21:21
  • No es subrayado, cuando hago la linea   _______________________ , me refiero a un

    control: @Html.EditorFor. lo que quiero es que en una sola linea se desplieguen

    2 @Html.LabelFor y 2 @Html.EditorFor. Lo qeu una comunmente hacia en un WebForm alinear los campos del formulario. Pero en MVC 3 me muestra el formulario vertical.

    Fecha:     _______________________ Nombre:_______________________

    Apellido:  _______________________ Ciudad: _______________________

    lunes, 24 de junio de 2013 22:14
  • Hola titoalomia

    Para que te queden alineados tendrás que usar CSS.

    Yo por ejemplo agruparía los elementos "editor-label y editor-field" en un div que podría llamar "editor-group" (por poner un ejemplo) y con CSS indicar algo como esto:

    fieldset {
       margin: auto;
       width: 610px;
    }
    
    .editor-group {
       display: inline-block;
       width: 300px;
    }
    
    .editor-group .editor-field, 
    .editor-group .editor-label {
       display: inline-block;
    }
    
    .editor-group .editor-field {
       width: 200px;
    }

    En su defecto y, aunque no es una buena práctica, tienes la posibilidad de usar tablas para mostrar esos datos.

    Por último, comentar que el uso del <hr> no es una buena práctica tampoco, así como el <br>. Para ese tipo de comportamientos siempre se debe usar (como buena práctica) CSS


    "En los momentos de crisis, sólo la imaginación es más importante que el conocimiento"
    MCTS | SharePoint 2010, Application Development
    MCTS | SharePoint 2010, Configuring
    MS | Programming in HTML5 with JavaScript and CSS3 (MS), Developing ASP.NET MVC 4 Web Applications
    Twitter | @saintwukong

    martes, 25 de junio de 2013 9:46
  • Gracias lo intentaré y comento.
    martes, 25 de junio de 2013 20:37