hiI used below code to change checkboxs appereance an show password in textbox ltscript type34textjavascript34 src34httpajaxgoogleapiscomajaxlibsjquery191jqueryminjs34gtltscriptgtltscript src34scriptsicheckjs34gtltscriptgtltlink href34skinssquareredcss34 rel34stylesheet34 gtltscript type34textjavascript34gt windowonload function ApplyCss function ApplyCss

Hi nedashI have cross checked the code and its working fine and please refer below sample code and modify it according to your needHTMLltdivgt ltdiv id34AMOL1134gt ltdiv id34chadM34gt ltlabel id34Label134 runat34server34 class34chadML34gt ltinput type34checkbox34 id34ChAllTra34 runat34server34 class34transpo34 gtltlabelgtltdivgt ltdiv id34chadM134gt ltlabel id34Label234 runat34server34 class34chadM1L34gt ltinput type34checkbox34 id34ChRE34 runat34server34 class34transpo34 gtltlabelgtltdivgt ltdiv id34chadM234gt ltlabel id34Label334 runat34server34 class34chadM2L34gt ltinput type34checkbox34 id34ChR34 runat34server34 class34transpo34 gtltlabel

Change TextBox textmode property based on jQuery iCheck CheckBox click using jQuery in ASP.Net

nedash

SOLVED CLOSED ACTIVE ANSWERED
User: nedash
Posted: on Apr 25, 2017 02:12 AM
Forum: jQuery and jQuery Plugins
Answer: 1
Views: 3947
Sample Code: Download

I used below code to change checkboxs appereance an show password in textbox...

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="../scripts/icheck.js"></script>
<link href="../skins/square/red.css" rel="stylesheet" />
<script type="text/javascript">
    window.onload = function () {
        ApplyCss();
    };
    function ApplyCss() {
        $('input').iCheck({
            checkboxClass: 'icheckbox_square-red',
            radioClass: 'iradio_square-red',
            increaseArea: '20%' // optional
        });
    };
    //On PostBack
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    if (prm != null) {
        prm.add_endRequest(function (sender, e) {
            if (sender._postBackSettings.panelsToUpdate != null) {
                ApplyCss();
            }
        });
    };
</script>
<script type="text/javascript">
    $(function () {
        $('#Chpass').on('ifChecked', function (event) {
            $("#txtpass").attr("type", "text");
        });
        $('#Chpass').on('ifUnchecked', function (event) {
            $("#txtpass").attr("type", "password");
        });
    });
</script>

in this page are 2 other textboxs that I used watermark for them :

<script type="text/javascript">
        window.onload = function SetColorOnPageLoad() {
            var defalutNameText = "با پیشوند آقا یا خانوم وارد نمایید";
            var defalutTellText = "جستجو بر اساس کد ملک";
            functionSetColor(document.getElementById("TxtName"), defalutNameText);
            functionSetColor(document.getElementById("Txtsearch"), defalutTellText);
        }
        function functionSetColor(Textbox, WaterMark) {
            if (Textbox.value.length > 0 && Textbox.value == WaterMark) {
                Textbox.style.color = "#b1b1b1";
            } else {
                Textbox.style.color = "black";
            }
        }
        function WaterMark(txt, evt, msg) {
            if (txt.value.length == 0 && evt.type == "blur") {
                txt.style.color = "#b1b1b1";
                txt.value = msg;
            }
            if (txt.value == msg && evt.type == "focus") {
                txt.style.color = "black";
                txt.value = "";
            }
        }
    </script>

now problem is that when I add above code(put watermark for textbox)

2 other javacodes (checkboxs and show password in textbox) codes that I put at first of question doesn't work...

best regards

neda

Download FREE API for Word, Excel and PDF in ASP.Net

AnandM

0 9

Reply
ANSWER
User: AnandM
Replied: on Apr 26, 2017 02:03 AM
Report

Hi nedash,

I have cross checked the code and its working fine and please refer below sample code and modify it according to your need.

HTML

<div>
    <div id="AMOL11">
        <div id="chadM">
            <label id="Label1" runat="server" class="chadML">
                <input type="checkbox" id="ChAllTra" runat="server" class="transpo" /></label></div>
        <div id="chadM1">
            <label id="Label2" runat="server" class="chadM1L">
                <input type="checkbox" id="ChRE" runat="server" class="transpo" /></label></div>
        <div id="chadM2">
            <label id="Label3" runat="server" class="chadM2L">
                <input type="checkbox" id="ChR" runat="server" class="transpo" /></label></div>
        <div id="chadM3">
            <label id="Label4" runat="server" class="chadM3L">
                <input type="checkbox" id="ChF" runat="server" class="transpo" /></label></div>
        <div id="chadM4">
            <label id="Label5" runat="server" class="chadM3L">
                <input type="checkbox" id="ChPF" runat="server" class="transpo" /></label></div>
        <div id="chadM5">
            <label id="Label6" runat="server" class="chadM3L">
                <input type="checkbox" id="ChMo" runat="server" class="transpo" /></label></div>
    </div>
    <div id="AM12">
        <asp:TextBox ID="TxtName" runat="server" CssClass="TxtNaM" Text="با پیشوند آقا یا خانوم وارد نمایید"
            onkeydown="return isNumeric(event.keyCode);" onpaste="return false;" ForeColor="#b1b1b1"
            onblur="WaterMark(this, event,'با پیشوند آقا یا خانوم وارد نمایید');" onfocus="WaterMark(this, event,'با پیشوند آقا یا خانوم وارد نمایید');"></asp:TextBox>
    </div>
    <asp:TextBox ID="Txtsearch" runat="server" CssClass="txtseA" Text="جستجو بر اساس کد ملک"
        onkeydown="return isNumeric(event.keyCode);" onpaste="return false;" ForeColor="#b1b1b1"
        onblur="WaterMark(this, event,'جستجو بر اساس کد ملک');" onfocus="WaterMark(this, event,'جستجو بر اساس کد ملک');"></asp:TextBox>
    <div id="chadM2R">
        <label runat="server" class="chadM2L">
            <input type="checkbox" id="Chpass" runat="server" /></label></div>
    <asp:TextBox ID="txtpass" runat="server" CssClass="txtramzD" TextMode="Password"></asp:TextBox>
</div>
<div>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <link href="red.css" rel="stylesheet" />
    <script type="text/javascript" src="icheck.js"></script>
    <script type="text/javascript">
        function ApplyCss() {
            $('input').iCheck({
                checkboxClass: 'icheckbox_square-red',
                radioClass: 'iradio_square-red',
                increaseArea: '20%' // optional
            });
        };
        
    </script>
    <script type="text/javascript">
        $(function () {
            $('[id*=Chpass]').on('ifChecked', function (event) {
                $("[id*=txtpass]").attr("type", "text");
            });
            $('[id*=Chpass]').on('ifUnchecked', function (event) {
                $("[id*=txtpass]").attr("type", "password");
            });
        });
    </script>
    <script type="text/javascript">
        window.onload = function SetColorOnPageLoad() {
            var defalutNameText = "با پیشوند آقا یا خانوم وارد نمایید";
            var defalutTellText = "جستجو بر اساس کد ملک";
            functionSetColor(document.getElementById("TxtName"), defalutNameText);
            functionSetColor(document.getElementById("Txtsearch"), defalutTellText);
            ApplyCss();
        }
        function functionSetColor(Textbox, WaterMark) {
            if (Textbox.value.length > 0 && Textbox.value == WaterMark) {
                Textbox.style.color = "#b1b1b1";
            } else {
                Textbox.style.color = "black";
            }
        }
        function WaterMark(txt, evt, msg) {
            if (txt.value.length == 0 && evt.type == "blur") {
                txt.style.color = "#b1b1b1";
                txt.value = msg;
            }
            if (txt.value == msg && evt.type == "focus") {
                txt.style.color = "black";
                txt.value = "";
            }
        }
    </script>
</div>

ScreenShot

I agree, here is the link: https://www.e-iceblue.com/Introduce/spire-office-for-net-free.html

Change TextBox textmode property based on jQuery iCheck CheckBox click using jQuery in ASP.Net

Company

Explore

Follow us

Contact Us