Aspnet change textbox characteristics dynamically

Asked

Viewed 372 times

0

For testing I created a button which calls a function in javascript through onclick(). In this function I would like to change for example the border color of the textbox, even better would change the color of that standard blue border that has when the textbox is selected.

1 answer

0


You can add styles dynamically to change the characteristics of your textbox. Example:

 <html>
 <head>
 //Você pode usar classe
<style type="text/css">
    .borda {
        border: 1px solid red;
    }
</style>

  <script type="text/javascript">
    function mudarEstilo() {

        //exemplo sem usar classe, aqui eu adiciono uma borda de 1px de largura do formato solid e vermelha diretamente na propriedade css do input
        $('#txtTeste').css("border", "1px solid red"); 

        //aqui eu uso uma classe para o input, essa classe também tem borda de 1px de largura forma
        //prefiro essa solução
        $('#txtTeste').addClass("borda"); 
    }
</script>
</head>
 <body>
   <input type="button" value="Teste" onclick="mudarEstilo();" /> 
   <input type="text" id="txtTeste" />
 </body>
</html>
  • thanks, it worked. I had tried it in a similar way, I can’t remember why it didn’t work. You have a site that has all these properties . css that jquery uses?

  • in fact, what I really wanted to change was the textbox color, standard blue color, of when it is selected. Do you know how to do this? I’ve been seeing something about taking the element and using some property of it to modify something, I can’t quite understand how it does it yet. Ah, and the textbox is in Asp.

  • @Heyjoe jquery site : http://jquery.com/download/ I downloaded 2.2.3. The native css did not use a framework. Hugs

  • @Heyjoe You can change the color of the textbox when it is selected without using javascript. In the following example css will only be applied when the field has focus, I am painting the edge of the field red and putting a blue shadow: #txtTeste:Focus { border-color: red; box-shadow: 0 0 10px blue; }

Browser other questions tagged

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