Develop Reference

How to update database when switch toggle is changed in asp.net c#

I have page where switch toggle is used and when toggle is switched to on and off update value in database.
<div class="card rounded" style="margin-bottom: 20px">
<asp:Image ID="coverpic" runat="server" CssClass="card-img" Height="500" AlternateText="Cover Picture" />
<div class="card-img-overlay card-inverse social-profile d-flex " style="top: auto">
<div class="align-self-center rounded" style="margin: auto">
<asp:Image ID="profilepic" runat="server" CssClass="img-circle" Height="100" Width="100" AlternateText="Profile Picture" />
<h4 class="card-title">
<asp:Label ID="fullname" runat="server"></asp:Label></h4>
<h6 class="card-subtitle">
<asp:Label ID="unametop" Font-Size="Large" runat="server"></asp:Label></h6>
<div class="switch">
<label>
User
<input id="userrole" type="checkbox" runat="server"><span class="lever switch-col-red"></span>Admin</label>
</div>
</div>
</div>
</div>
As you can see input checkbox with switch class is used, when i turn switch on i want to update user role in database to admin and when switch is turned off i want to update user role to normal user. Please help if you can.

By design the input control doesn't have a click event, so in my opinion the most elegant way to do it is with jQuery, if you're using it. See this answer.
Alternatively you could do something like this:
<script>
function triggerpostback(obj) {
//check if textbox is readyonly
if (obj.readOnly) {
__doPostBack('Button', "");
}
}
</script>
<asp:Button ID="Button" runat="server" Text="Button" OnClick="Button_Click" style="display:none" />
<input id="userrole" type="checkbox" runat="Server" onclick="triggerpostback(this)" />
Code-behind:
protected void Button_Click(object sender, EventArgs e)
{
// Add the code to update user role in database
}

Cant get text from textbox

So, I need to get a string from a textbox to use in a backend program, but I'm unable to get it when im one the site, however it works if i set Text="Test1" prior, even though i change the text in the textbox, "Test1" always gets sent to to my function and works! (Talking about Box3)
Code to the text boxes below
<div class="row">
<form action="#" method="post" class="contact-form">
<div class="col-md-4 col-sm-6">
<asp:TextBox ID="Box3" Text="Test1" runat="server" placeholder="Gamepin..."></asp:TextBox>
</div>
<div class="col-md-4 col-sm-6">
<asp:TextBox ID="Box2" runat="server" placeholder="Name ..."></asp:TextBox>
</div>
<div class="col-md-4 col-sm-12">
<asp:TextBox ID="Box1" runat="server" placeholder="Amount ..."></asp:TextBox>
</div>
<div >
<asp:CheckBox ID="CheckBoxREPLY" runat="server" style="vertical-align: central" Text="YesNo" TextAlign="Left" />
</div>
<div class="col-md-12 col-sm-12">
<input type="button" runat="server" onserverclick="Funcactivate" class="button big green" value="Launch!"/>
</div>
</form>
</div>
And my code to get textbox.text
protected void Funcactivate(object sender, EventArgs e)
{
//Get textbox(s)
string Game = Box1.Text;
string Namepref = Box2.Text;
string Amount = Box3.Text;
}

Changing your button could work.
<asp:Button ID="btnLaunch" runat="server" Text="Launch!" class="button big green" OnClick="Funcactivate" CausesValidation="False"/>

If you are using web forms, you should be able to capture the text box entry in the "if(!IsPostBack){...}" event and set it to a variable and use it in your "Funcactivate" method.
Hello Sleepwalker, here is a code sample that works for me, I am not using the isPostBack. I am also using an asp:button Instead of using an HTML input control.
<div>
<asp:TextBox ID="txtBox1" runat="server"></asp:TextBox>
</div>
<div>
<asp:TextBox ID="txtBox2" runat="server"></asp:TextBox>
</div>
<div>
<asp:TextBox ID="txtBox3" runat="server"></asp:TextBox>
</div>
<div>
<asp:Button ID="btnSubmit" runat="server" Text="Button" OnClick="btnSubmit_Click" />
</div>
protected void btnSubmit_Click(object sender, EventArgs e)
{
string game = this.txtBox1.Text.ToString();
string Namepref = this.txtBox2.Text.ToString();
string Amount = this.txtBox3.Text.ToString(); //box3;
}

I fixed it by moving my form to only get the < asp:X, because i discovered that if the < asp:x was nested too deep within a ton of divs, it didnt work properly.
It may have been due to something else, but it worked for me.

Trying to enable show/hide feature in asp.net

I am trying to enable show/hide password feature. I am creating an asp.net web form using C#.
My code is as below,
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class show : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void CheckBox1_CheckedChanged(object sender, EventArgs e)
{
if (CheckBox1.Checked == false)
{
TextBox1.TextMode = TextBoxMode.Password;
}
if (CheckBox1.Checked == true)
{
TextBox1.TextMode = TextBoxMode.SingleLine;
}
}
}
On mypage.aspx,
there is a checkbox whose autopostback property is true and a textbox whose textmode is password.
The expected result is:-
show password into text when checkbox is checked.
hide password when checkbox is unchecked.
The problem is :-
This code is working only once i.e. it is not being executed when checkbox is checked or unchecked again.
The textbox becomes blank.
Please help me soon.

You are losing value within TextBox because on selection change, the page loads again, you need to check whether its a postBack or first time load and set the textBox value.
protected void Page_Load(object sender, EventArgs e)
{
if (IsPostBack)
{
string Password = TextBox1.Text;
TextBox1.Attributes.Add("value", Password);
}
}
Your problem will be solved. I've tested it.
Hope it helps!

There's exactly zero need to use a postback for this. An example using jQuery:
Markup:
<label>Password fields are just a UI convenience:</label>
<input type="password" id="password" value="super secret password" />
<label>
<input type="checkbox" id="toggle-password" /> Toggle
</label>
jQuery code:
$(function() {
$('#toggle-password').on('change', function(e) {
var _this = $(this);
if (_this.is(':checked')) {
$('#password').attr({
'type': 'text'
});
} else {
$('#password').attr({
'type': 'password'
});
}
})
});
A vanilla JS version:
var toggle = document.getElementById('toggle-password');
var textbox = document.getElementById('password');
toggle.addEventListener("click", function() {
var isChecked = toggle.checked;
if (isChecked) {
textbox.type = "text";
} else {
textbox.type = "password";
}
})

You can't set the text property of a Password Type field for security reasons.So another way to set the value after changing mode is
if (CheckBox1.Checked == false)
{
string pass = TextBox1.Text;
TextBox1.TextMode = TextBoxMode.Password;
TextBox1.Attributes.Add("value", pass);
}
if (CheckBox1.Checked)
{
TextBox1.TextMode = TextBoxMode.SingleLine;
}

<head runat="server">
<title>Show Hide Password</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#show_password').hover(function show() {
//Change the attribute to text
$('#txtCurrentpassword').attr('type', 'text');
$('.icon').removeClass('fa fa-eye-slash').addClass('fa fa-eye');
},
function () {
//Change the attribute back to password
$('#txtCurrentpassword').attr('type', 'password');
$('.icon').removeClass('fa fa-eye').addClass('fa fa-eye-slash');
});
//CheckBox Show Password
$('#ShowPassword').click(function () {
$('#Password').attr('type', $(this).is(':checked') ? 'text' : 'password');
});
});
</script>
<script type="text/javascript">
$(document).ready(function () {
$('#show_password1').hover(function show() {
//Change the attribute to text
$('#txtNewPassword').attr('type', 'text');
$('.icon').removeClass('fa fa-eye-slash').addClass('fa fa-eye');
},
function () {
//Change the attribute back to password
$('#txtNewPassword').attr('type', 'password');
$('.icon').removeClass('fa fa-eye').addClass('fa fa-eye-slash');
});
//CheckBox Show Password
$('#ShowPassword').click(function () {
$('#Password').attr('type', $(this).is(':checked') ? 'text' : 'password');
});
});
</script>
<script type="text/javascript">
$(document).ready(function () {
$('#show_password2').hover(function show() {
//Change the attribute to text
$('#txtConfirmPassword').attr('type', 'text');
$('.icon').removeClass('fa fa-eye-slash').addClass('fa fa-eye');
},
function () {
//Change the attribute back to password
$('#txtConfirmPassword').attr('type', 'password');
$('.icon').removeClass('fa fa-eye').addClass('fa fa-eye-slash');
});
//CheckBox Show Password
$('#ShowPassword').click(function () {
$('#Password').attr('type', $(this).is(':checked') ? 'text' : 'password');
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div class="container">
<br />
<br />
<br />
<div class="col-md-10">
<div class="" style="display: none" runat="server" id="divStatusMsg">
<asp:HiddenField ID="lblLoginUserId" runat="server" />
<asp:HiddenField ID="HidEncrptedPWD" runat="server" />
<asp:HiddenField ID="HidCurrEncrptedPWD" runat="server" />
<asp:HiddenField ID="hidError" runat="server" />
</div>
</div>
<h2>Update Password</h2>
<label class="col-form-label" style="color: red">(Min 10 Character including 1 Upper, 1 Lower Charcter, 1 Numeric & 1 Special Character)</label>
<div class="row">
<div class="col-md-6">
<label>User Name</label>
<div class="input-group">
<asp:TextBox ID="txtUserName" TextMode="SingleLine" runat="server" CssClass="form-control" Enabled="false"></asp:TextBox>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<label>Current Password</label>
<div class="input-group">
<asp:TextBox ID="txtCurrentpassword" TextMode="Password" runat="server" CssClass="form-control"></asp:TextBox>
<div class="input-group-append">
<button id="show_password" class="btn btn-primary" type="button">
<span class="fa fa-eye-slash icon"></span>
</button>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<label>New Password</label>
<div class="input-group">
<asp:TextBox ID="txtNewPassword" TextMode="Password" runat="server" CssClass="form-control"></asp:TextBox>
<div class="input-group-append">
<button id="show_password1" class="btn btn-primary" type="button">
<span class="fa fa-eye-slash icon"></span>
</button>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<label>Re-Enter Password :</label>
<div class="input-group">
<asp:TextBox ID="txtConfirmPassword" TextMode="Password" runat="server" CssClass="form-control"></asp:TextBox>
<div class="input-group-append">
<button id="show_password2" class="btn btn-primary" type="button">
<span class="fa fa-eye-slash icon"></span>
</button>
</div>
</div>
</div>
</div>
<br />
<!--Button Region-->
<div class="row">
<div class="col-lg-6 text-right" id="divDateSearch">
<div class="form-group">
<button type="button" id="btnSave" runat="server" class="btn btn-success btn-border btn-sm" onserverclick="btnSave_click">Change</button>
<button type="button" id="btnReset" runat="server" class="btn btn-default btn-border btn-sm" onserverclick="btnReset_click">Reset</button>
</div>
</div>
</div>
<!--Button Region-->
</div>
</form>
</body>

Radio button value is null

I'm trying to get the value of the radio button clicked but so far the value is null. The code below has a couple of things going on:
1) when the button is clicked it should move the radio buttons to the left.
2) I need to the get value of which radio button is clicked
The first part works but I can't get the second part. This is my code:
<script>
$(document).ready(function(){
$("#form1").click(function(){
$("#list_of_btns").animate({left: '-150px'});
});
});
</script>
//this is the form for radio button...it must be centered to middle of the page
<div id="list_of_btns" style="padding-top: 80px; position:fixed;">
<div class="row" style="position:fixed;">
<div class="col-md-8 col-md-offset-4" style="position:fixed;">
<div class="list-group" style="position:fixed;">
<form role="radio_button_form" style="position:fixed;">
<div class="radio">
<label><input type="radio" value="male" name="method">male</label>
</div>
<div class="radio">
<label><input type="radio" value="female" name="method">female</label>
</div>
</form>
</div>
</div>
</div>
</div>
//this is the enter button.
<div class="row" style="padding-top: 80px; position:relative;">
<div class="col-md-8 col-md-offset-16" style="position:relative;">
<form id="form1" runat="server" style="position:relative;">
<asp:LinkButton class="btn btn-info" ID="getStarted_btn" runat="server" OnClick="btn_clicked" Text="Enter" />
</form>
</div>
</div>
This is where I am trying to get value of the radio button, in my c# code:
public void btn_clicked (object sender, EventArgs args)
{
Console.Out.WriteLine ("sdsfdsfdfsdf");
if (Request.Form["method"] != null)
{
string selectedGender = Request.Form["method"].ToString();
Console.Out.WriteLine (selectedGender);
}
}
Does anybody have any idea on what I'm doing wrong or is there a better way in achieving this?

I have edited your code and this is working.Plz check
<body>
<form id="form1" runat="server" style="position: relative;">
<div id="list_of_btns" style="padding-top: 80px; position: fixed;">
<div class="row" style="position: absolute;">
<div class="col-md-8 col-md-offset-4" style="position: fixed;">
<div class="list-group" style="position: fixed;">
<div class="radio">
<label>
<input type="radio" value="male" name="method">male</label>
</div>
<div class="radio">
<label>
<input type="radio" value="female" name="method">female</label>
</div>
</div>
</div>
</div>
</div>
<div class="row" style="padding-top: 80px; position: relative;">
<div style="position: relative;">
<asp:LinkButton class="btn btn-info" ID="getStarted_btn" runat="server" OnClick="btn_clicked" Text="Enter" />
</div>
</div>
</form>
Enclose the whole content inside single Form..

Selected Index Changed event not firing both Autopostback property

In my Dropdownlist Selected index change event not firing.Here i use auto post back true &
View state also true.But Selected Index Changed Event not firing
My Code
<%# Page Language="C#" AutoEventWireup="true" CodeFile="AdminEagleViewLogin.aspx.cs" Inherits="AdminEagleViewLogin" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<style>
body{padding-top:20px;}
</style>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div class="container">
<div class="row">
User : <asp:DropDownList ID="drpusr" runat="server" Visible="true" OnSelectedIndexChanged="drpusr_SelectedIndexChanged" AutoPostBack="true" EnableViewState="true" ></asp:DropDownList>
Password: <asp:Label ID="lbluserpw" runat="server"></asp:Label>
<div class="col-md-4 col-md-offset-4">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Please sign in</h3>
</div>
<div class="panel-body">
<form accept-charset="UTF-8" role="form">
<fieldset>
<div class="form-group">
<asp:TextBox ID="txtusr" runat="server"></asp:TextBox>
</div>
<div class="form-group">
<asp:TextBox ID="txtpw" runat="server" TextMode="Password"></asp:TextBox>
</div>
<div class="checkbox">
<label>
<input name="remember" type="checkbox" value="Remember Me"> Remember Me
</label>
</div>
<asp:CheckBox ID="chkremember" runat="server" Visible="false" class="remchkbox" />
<asp:Button ID="submit" runat="server" class="btn btn-lg btn-success btn-block" Text="Submit" OnClick="submit_Click" />
</fieldset>
</form>
</div>
</div>
</div>
</div>
</div>
</form>
</body>
</html>
ServerSide
User bind to Dropdown is working.
public partial class AdminEagleViewLogin : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
BindUsers();
//lbluserpw.Text = Membership.Provider.GetPassword(drpusr.SelectedValue, String.Empty);
}
protected void submit_Click(object sender, EventArgs e)
{
if (Membership.ValidateUser(txtusr.Text, txtpw.Text))
{
FormsAuthentication.SetAuthCookie(txtusr.Text, chkremember.Checked);
string[] CurrentUserRole = Roles.GetRolesForUser(txtusr.Text);
var admin = "Administrator";
var manager = "Manager";
var user = "User";
if (CurrentUserRole.Contains(admin))
{
Response.Redirect("Administrator.aspx");
}
else if (CurrentUserRole.Contains(manager))
{
Response.Redirect("Manager.aspx");
}
else
{
Response.Redirect("UserPage.aspx");
}
}
else
{
Response.Redirect("AdminEagleViewLogin.aspx");
}
}
protected void BindUsers()
{
DataAccess da = new DataAccess();
drpusr.DataSource = da.GetUsers();
drpusr.DataTextField = "UserName";
drpusr.DataValueField = "UserId";
drpusr.DataBind();
drpusr.Items.Insert(0, new ListItem("-- Select User --", "0"));
drpusr.Items.RemoveAt(1);
}
protected void drpusr_SelectedIndexChanged(object sender, EventArgs e)
{
lbluserpw.Text = Membership.Provider.GetPassword(drpusr.SelectedValue, String.Empty);
}
}

Try this:
protected void Page_Load(object sender, EventArgs e)
{
if(!IsPostBack)
{
BindUsers();
}
}

You shouldn't put a form element inside another form:
<form accept-charset="UTF-8" role="form">
<fieldset>
...
<asp:Button ID="submit" runat="server" class="btn btn-lg btn-success btn-block" Text="Submit" OnClick="submit_Click" />
</fieldset>
</form>
remove the inner form.
[Update]
Another problem is the "ID" property of the button.
change it to something else, other than "submit".