textbox border

Question

my application has a textbox a validation control and a button control.i want that if textbox is empty and button i clicked i know the validator would work but i also want to set border color,style property to the textbox control.how can i do this.

Vaikesh K P · Answer

Hi, Check these links : 1) http://www.aspdotnet-suresh.com/2011/01/how-to-change-textbox-background-color.html 2) https://stackoverflow.com/questions/196859/change-text-box-color-using-required-field-validator-no-extender-controls-pleas 3) http://www.c-sharpcorner.com/blogs/5182/change-textbox-color-on-validation-fail-in-asp-net.aspx 4) http://www.c-sharpcorner.com/Blogs/13925/change-background-and-border-color-of-invalid-controls-when.aspx

Munesh Sharma · Answer

http://www.c-sharpcorner.com/Blogs/13925/change-background-and-border-color-of-invalid-controls-when.aspx

Sandeep Kumar · Answer

Hello, try this it will surely help you this code is done through jquery.just paste it in your document and you will able to see your result when you are connected to internet. You can also pffline run this code by including jquery.min.js file . $(document).ready(function(){ $("button").click(function(){ $("input").css({"border":"yellow 5px solid","background-color":"red"}); }); }); Set background-color of p

Mohammed Ibrahim · Answer

hi Umair, this may help you http://csharp.net-informations.com/gui/cs-textbox.htm

Upendra Pratap Shahi · Answer

Your welcome umair mohsin , Kindly accept the answer , this help in better discussion.

umair mohsin · Answer

yes it is working thank you Mr: Upendra Pratap Shahi

Upendra Pratap Shahi · Answer

hello umair mohsin , Kindly use this code- @ Page Language ="C#" AutoEventWireup ="true" CodeFile ="Test1.aspx.cs" Inherits ="Test1" %> DOCTYPE html > html xmlns ="http://www.w3.org/1999/xhtml"> head runat ="server"> title > c# corner forum title > script type ="text/javascript" language ="javascript"> function validate() { var txt = document.getElementById( ' = txtusername.ClientID %> ' ); var txt2 = document.getElementById( ' = txtpass.ClientID %> ' ); if (txt.value == "" ) { txt.style.border = "1px solid Red" ; return false ; } if (txt2.value == "" ) { txt2.style.border = "1px solid Red" ; return false ; } } script > head > body > form id ="form1" runat ="server"> div style =" width : 100%"> div style =" margin-bottom : 200px ; "> div > div style =" margin : 0px auto ; "> table width ="100%"> tbody > tr > td align ="center"> table border ="0" width ="400px"> tbody > tr > td align ="center"> strong style =" font-size : 18px ; "> User Login strong > td > tr > tr > td align ="center"> asp : TextBox ID ="txtusername" Height ="30px" Width ="200px" runat ="server"> asp : TextBox > asp : RequiredFieldValidator ID ="RequiredFieldValidator1" runat ="server" Display ="Dynamic" ValidationGroup ="Submit" ControlToValidate ="txtusername" ForeColor ="Red" ErrorMessage ="Enter UserName"> asp : RequiredFieldValidator > td > tr > tr > td align ="center"> strong style =" font-size : 18px ; "> Password strong > td > tr > tr > td align ="center"> asp : TextBox ID ="txtpass" Height ="30px" Width ="200px" TextMode ="Password" runat ="server"> asp : TextBox > asp : RequiredFieldValidator ID ="RequiredFieldValidator2" runat ="server" Display ="Dynamic" ValidationGroup ="Submit" ControlToValidate ="txtpass" ForeColor ="Red" ErrorMessage ="Enter Password"> asp : RequiredFieldValidator > td > tr > tr > td align ="center"> asp : Button ID ="Button1" runat ="server" Text ="Signin" OnClientClick ="return validate();"> asp : Button > td > tr > tbody > table > td > tr > tbody > table > div > div style =" margin-top : 300px ; "> div > div > form > body > html > Kindly accept the answer.

Upendra Pratap Shahi · Answer

Hello umair mohsin , Kindly use this code. @ Page Language ="C#" AutoEventWireup ="true" CodeFile ="Test1.aspx.cs" Inherits ="Test1" %> DOCTYPE html > html xmlns ="http://www.w3.org/1999/xhtml"> head runat ="server"> title > c# corner forum title > script type ="text/javascript" language ="javascript"> function validate() { var txt = document.getElementById( ' = txtusername.ClientID %> ' ); var txt2 = document.getElementById( ' = txtpass.ClientID %> ' ); if (txt.value == "" ) { txt.style.border = "1px solid Red" ; return false ; } if (txt2.value == "" ) { txt2.style.border = "1px solid Red" ; return false ; } } script > head > body > form id ="form1" runat ="server"> div style =" width : 100%"> div style =" margin-bottom : 200px ; "> div > div style =" margin : 0px auto ; "> table width ="100%"> tbody > tr > td align ="center"> table border ="0" width ="400px"> tbody > tr > td align ="center"> strong style =" font-size : 18px ; "> User Login strong > td > tr > tr > td align ="center"> asp : TextBox ID ="txtusername" Height ="30px" Width ="200px" runat ="server"> asp : TextBox > asp : RequiredFieldValidator ID ="RequiredFieldValidator1" runat ="server" Display ="Dynamic" ValidationGroup ="Submit" ControlToValidate ="txtusername" ForeColor ="Red" ErrorMessage ="Enter UserName"> asp : RequiredFieldValidator > td > tr > tr > td align ="center"> strong style =" font-size : 18px ; "> Password strong > td > tr > tr > td align ="center"> asp : TextBox ID ="txtpass" Height ="30px" Width ="200px" TextMode ="Password" runat ="server"> asp : TextBox > asp : RequiredFieldValidator ID ="RequiredFieldValidator2" runat ="server" Display ="Dynamic" ValidationGroup ="Submit" ControlToValidate ="txtpass" ForeColor ="Red" ErrorMessage ="Enter Password"> asp : RequiredFieldValidator > td > tr > tr > td align ="center"> asp : Button ID ="Button1" runat ="server" Text ="Signin" OnClientClick ="return validate();"> asp : Button > td > tr > tbody > table > td > tr > tbody > table > div > div style =" margin-top : 300px ; "> div > div > form > body > html > Kindly accept the answer.

umair mohsin · Answer

hi Upendra Pratap Shahi your code is working but when i leave button textbox border disappears.what to do to persist that red colored border on the textbox

Rahul Prajapat · Answer

hello @umair you can change the textbox style by javascript function on OnClientClick event. Try this : script type="text/javascript"> function chng() { document.getElementById('TextBox1').style.border = "2px solid #ff0000"; } onclick="Button1_Click1" />

Rajeesh Menoth · Answer

Hi, Ref this link also : http://savotdane.blogspot.in/2008/10/hightlight-or-change-background-color.html http://www.aspdotnet-suresh.com/2011/12/jquery-highlight-border-and-background.html

Upendra Pratap Shahi · Answer

Hello , Go through below link- http://www.c-sharpcorner.com/Blogs/13925/change-background-and-border-color-of-invalid-controls-when.aspx Kindly accept the answer .

Rojalin Sahoo · Answer

Hello, check this link may help you: http://www.aspsnippets.com/Articles/Change-Background-and-Border-Color-of-Invalid-Controls-when-Validation-fails-in-ASP.Net.aspx