HTML view of the field

Asked

Viewed 63 times

1

I have an input field where I bring the value of the bank, which I use this way:

<input asp-for="TICMS" name="TICMS" onKeyPress="return(MascaraMoeda(this,'.',',',event))" class="form-control" />

However the following doubt arose: This field it is not changed by the user, it is only changed by means of accounts via javascript then there is no need to appear as a textbox, but I need him saved at the bank, because there may be changes, what would be the best way for him to appear ? I tried something like:

 @Html.Raw(model.TICMS);

But it does not save in the bank if it is this way. What is the best exit?

EDIT

If I take out the edges via css, and put readonly the field stays like this: inserir a descrição da imagem aqui

  • but if the field cannot be changed, why does it have an event keypress?

  • @Ricardopunctual was placed before these conditions. Before it was possible this change, as it is a standard account, it is made according to the data entered in the table, it is made via javascript, then it needs to be visible, and it needs to be saved in the bank.

  • tried to use the parameter: readonly="true"

  • understood. in this case, you can use another element, such as span for example, it accepts html as well

  • But this way I can change it javascript and save in the bank equal to the elements inputs ?

  • Pq doesn’t style it with CSS, removes the edges and leaves it readonly. It will look like text, but it will be a normal input that you can’t edit.

  • I have css, but if I put it in readonly the field is as if it had disabled, there is the appearance of the text box.

  • Yes you can, and also post the values for the model, just use the correct name/id according to the model. You can also use the attribute readonly in the input that will work, just can not disable because otherwise it will not be posted to the model.

  • @Ricardopunctual has some example to help me?

  • If it will never be changed, why not show in a <span> and have a <input type="hidden"> with that amount?

  • Simply replace input by label: <label asp-for="TICMS" name="TICMS" ....

Show 6 more comments

2 answers

2


First, to transform the input in something that doesn’t look like a input I think it’s not appropriate... but if it’s what you want here has an example that can serve you.

I believe you’re wearing Bootstrap, because I noticed the class form-control in his input so I had to consider this in the CSS I did. First I gave a all:unset to try to clean the default styles of input Bootstrap, but the Bootstrap CSS hierarchy is very strong and I needed to use some !important to remove all the same!

See how it looked in the model below:

.form-control.labelcss {
    all:unset;
    border:none !important;
    box-shadow:none !important;
    outline: none !important;
    background-color: #fff !important;
    display: inline-block;
    margin-bottom: 5px;
    font-weight: 700;

}
    <link rel="stylesheet" type="text/css" media="screen" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />

        <input asp-for="TICMS" value="input customizado" name="TICMS" onKeyPress="return(MascaraMoeda(this,'.',',',event))" readonly class="form-control labelcss" />
        <label for="">isso é um label</label>
        <input asp-for="TICMS" value="input padrão com readonly" readonly name="TICMS" onKeyPress="return(MascaraMoeda(this,'.',',',event))"  class="form-control" />

  • It worked Hugo, thank you. This is exactly what I needed.

  • @marianac_costa cool that worked! I’m not developer per se, so take into consideration the comments of friends. I know the way I did will solve your problem, but I don’t know if it’s the best option, or if it’s the option a programmer would rss :) Good luck on the project!

0

<input asp-for="TICMS" name="TICMS" onKeyPress="return(MascaraMoeda(this,'.',',',event))" class="form-control" type="hidden"/>

Puts him as type="hidden", so the user will not see it, but will be there :)

  • But I need it to be shown in order of query, and it can be "changed", so it needs to be visible, for the user to see the information. These fields are results of other accounts, and need to be visible and saved.

  • So put it like this: <input asp-for="TICMS" name="TICMS" onKeyPress="return(MascaraMoeda(this,'.',',',event))" class="form-control" readonly/> So it will get read only, user can not change, and can see

  • I wanted him to look like label, for the sake of aesthetics.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.