TAMANHO DO TEXTBOXFOR NO MODAL

 Tópico anterior Próximo tópico Novo tópico

TAMANHO DO TEXTBOXFOR NO MODAL

ASP.NET

 Compartilhe  Compartilhe  Compartilhe
#481437 - 04/05/2018 09:05:30

PERCIFILHO
MATAO [SP]
Cadast. em:Dezembro/2009


Bom dia, pessoal!!! Uma ótima sexta-feira a todos.
É o seguinte: estou num projeto MVC e tenho uma view Index que abre a view Create numa janela Modal. Até aí, tudo bem.
Só que o meu primeiro campo (Nome) tem o tamanho de 50 caracteres, e não estou conseguindo fazer com que o meu TextBoxFor fique com um tamanho onde o usuário consiga digitar os 50 caracteres, ou seja, ele sempre fica com um tamanho (que parece que é o máximo) e à medida que vai digitando, o texto vai rolando.

<table>
    <tr>
        <td style="font-family:Verdana; font-size:11px;">
            @Html.LabelFor(model => model.Nome)
        </td>
        <td style="font-family: Verdana; font-size:11px;">
            @Html.TextBoxFor(model => model.Nome, htmlAttributes: new { @style = "width:500px;" })
            @Html.ValidationMessageFor(model => model.Nome, "", new { @class = "text-danger" })
        </td>
    </tr>
</table>

Se eu abrir a view Create sem Modal, o TextBoxFor fica com o tamanho que eu especifiquei, somente se eu abrir numa Modal é que o tamanho sempre fica fixo, mesmo definindo o style como no código acima. Existe uma maneira de contornar isso?

Abrindo view Create sem Modal


Abrindo view Create em janela Modal


____________________________________________________
Você sabe que alguém te ama não pelo que ele fala, mas pelo o que faz.
O amor não sobrevive de teorias.




#481438 - 04/05/2018 09:18:42

GUIMORAES
ITAPETININGA
Cadast. em:Agosto/2009


Tenta deixar a sua table com 100% de tamanho.
  style="width: 100%"  


Você está usando algum framework, como bootstrap por exemplo?




#481439 - 04/05/2018 09:20:26

KERPLUNK
RIO GRANDE DO SUL
Cadast. em:Junho/2009


Membro da equipe
Width, se refere à largura da textbox e não o número de caracteres máximo. A propriedade para isso é MaxLength:

@Html.TextBoxFor(model => model.Nome, htmlAttributes: new { @style = "width:500px;", maxlength=50 })


_______________________________________________________________________
Gostaria de ter seu sistema Desktop "traduzido" para uma interface web? Podemos conversar...
Virei Oráculo!
The end is nigh, be ready for the nukes!


#481440 - 04/05/2018 09:21:36

KERPLUNK
RIO GRANDE DO SUL
Cadast. em:Junho/2009


Membro da equipe
Isso é questão de entender o vínculo entre HTML e CSS. Estude bem essa parte que vai te fazer muita falta se não entender bem.

_______________________________________________________________________
Gostaria de ter seu sistema Desktop "traduzido" para uma interface web? Podemos conversar...
Virei Oráculo!
The end is nigh, be ready for the nukes!


#481441 - 04/05/2018 09:31:57

PERCIFILHO
MATAO [SP]
Cadast. em:Dezembro/2009


Obrigado GUIMORAES e KERPLUNK, porém o problema não é esse.
Depois de muito lutar e vasculhar na internet, encontrei a solução:
Acontece que na view Layout.cshtml existe uma referência:
@Styles.Render("~/Content/css")
nesta pasta Content existe um arquivo "site.css" onde limita o tamanho máximo do input:

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;    ---> aqui, deixei a linha comentada
}



Deixei a linha comentada e funcionou.

____________________________________________________
Você sabe que alguém te ama não pelo que ele fala, mas pelo o que faz.
O amor não sobrevive de teorias.




#481443 - 04/05/2018 10:01:39

KERPLUNK
RIO GRANDE DO SUL
Cadast. em:Junho/2009


Membro da equipe
Bem, largura de componentes, é melhor que seja dinâmico e não fixo dessa maneira. Você vai ver do que estou falando quando começar a acessar com monitores menores ou maiores que o seu. E vai se acentuar bastante quando usar um tablet ou um celular pra ver sua página.


_______________________________________________________________________
Gostaria de ter seu sistema Desktop "traduzido" para uma interface web? Podemos conversar...
Virei Oráculo!
The end is nigh, be ready for the nukes!


#481444 - 04/05/2018 10:09:35

PERCIFILHO
MATAO [SP]
Cadast. em:Dezembro/2009


Valeu pela dica Kerplunk, abraços.

____________________________________________________
Você sabe que alguém te ama não pelo que ele fala, mas pelo o que faz.
O amor não sobrevive de teorias.




#481445 - 04/05/2018 10:09:58

GUIMORAES
ITAPETININGA
Cadast. em:Agosto/2009


Citação:
:
Bem, largura de componentes, é melhor que seja dinâmico e não fixo dessa maneira. Você vai ver do que estou falando quando começar a acessar com monitores menores ou maiores que o seu. E vai se acentuar bastante quando usar um tablet ou um celular pra ver sua página.


O Kerplunk tem razão, se você comentou o tamanho máximo do seu componente, em tamanho de telas diferentes, você terá um comportamento anormal do mesmo. Se tentar acessar o seu aplicativo pelo celular, irá entender, principalmente quando você exibir o modal, todos os componentes se ajustarão ao tamanho do modal, que estará estreito, devido ao tamanho da tela.
O ideal é você ter um css com tamanhos diferentes para resoluções diferentes, pois caso contrário, você só terá dor de cabeça.



#481446 - 04/05/2018 10:44:01

KERPLUNK
RIO GRANDE DO SUL
Cadast. em:Junho/2009


Membro da equipe
MVC(Razor) é notório por não fornecer muita facilidade no que diz respeito à adaptabilidade. Sugiro que não siga por esse caminho, partindo para uma solução mais robusta, como React ou Angular.

_______________________________________________________________________
Gostaria de ter seu sistema Desktop "traduzido" para uma interface web? Podemos conversar...
Virei Oráculo!
The end is nigh, be ready for the nukes!


#481447 - 04/05/2018 11:02:13

KERPLUNK
RIO GRANDE DO SUL
Cadast. em:Junho/2009


Membro da equipe

Última edição em 04/05/2018 11:03:55 por KERPLUNK

Para remediar a sua situação, sugiro o uso de um framework CSS como o Material Design, que vai ajudar muito nessa coisa de layout de tela.


_______________________________________________________________________
Gostaria de ter seu sistema Desktop "traduzido" para uma interface web? Podemos conversar...
Virei Oráculo!
The end is nigh, be ready for the nukes!


#481448 - 04/05/2018 11:02:31

PERCIFILHO
MATAO [SP]
Cadast. em:Dezembro/2009


Citação:
MVC(Razor) é notório por não fornecer muita facilidade no que diz respeito à adaptabilidade. Sugiro que não siga por esse caminho, partindo para uma solução mais robusta, como React ou Angular.  


Prometo que vou estudar à respeito, Kerplunk, nunca me arrependi de seguir seus conselhos.

____________________________________________________
Você sabe que alguém te ama não pelo que ele fala, mas pelo o que faz.
O amor não sobrevive de teorias.




 Tópico anterior Próximo tópico Novo tópico


Para responder este tópico o login é requerido
Se você já possui uma conta de usuário por favor faça seu login
Se você não possui uma conta de usuário use a opção Criar usuário