Get selected value of Javascript Modified Dropdownlist in C# - c#

I have a dropDownlist in my project and i am adding items to it in javascript. Now i want to get selected index in C# (on a button click event). But i am unable to do this because it seems to be a problem that viewstate is not maintained.
Further more i have
EnableEventValidation="false"
in my Page
Please tell me how can i achieve this functionality? Right Now i am adding selected values in a hidden field and then accessing that hidden field in C#. Its working but i want "cleanliness".
Regards

When ASP.NET performs a form POST the drop down options need to be passed through to the server and be recreated there for further processing.This is achieved through ViewState.
I'm not aware of any other way of doing this, what you can do however is retrieve the selected value of the drop down using Request.Form[ddlProducts.UniqueID] if you can figure out the item index based on the selected value, great! Else I think hidden fields are your only option
Here's a complete example:
<head runat="server">
<title></title>
<script type="text/javascript">
window.onload = function () {
var select = document.getElementById("ddlProducts");
select.options[select.options.length] = new Option('Product 1', 'Value 1');
select.options[select.options.length] = new Option('Product 2', 'Value 2');
select.options[select.options.length] = new Option('Product 3', 'Value 3');
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:DropDownList ID="ddlProducts" runat="server">
</asp:DropDownList>
<asp:Button ID="btnOK" runat="server" Text="OK" OnClick="Process" /> <span id="output"
runat="server" />
</div>
</form>
</body>
</html>
protected void Process(object sender, EventArgs e)
{
int selectedIndex = ddlProducts.SelectedIndex;
output.InnerHtml = Request.Form[ddlProducts.UniqueID];
}

Related

asp.net display textbox on item checked

So just starting out with asp.net... I want to display my textbox when my checkbox is checked, but this doesn't seem to be working. I also tried with the visible property, but that didn't work either. What am I doing wrong exactly?
Code:
protected void checked_CheckedChanged(object sender, EventArgs e)
{
text.Style["display"] = "block";
}
Layout:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<p>gehuwd/samenwonend<asp:checkbox runat="server" ID="checked" OnCheckedChanged="checked_CheckedChanged"></asp:checkbox>
</p>
<asp:TextBox runat="server" ID="text" style="display:none"></asp:TextBox>
</form>
</body>
</html>
Use the AutoPostBack property for checkbox and set it to true:
<asp:checkbox runat="server" ID="checked" OnCheckedChanged="checked_CheckedChanged" AutoPostBack="true"></asp:checkbox>
You can use add css property of textbox in c# as given below. If your checkbox OnCheckedChanged is not working then you can set property AutoPostBack is true in checkbox.
protected void checked_CheckedChanged(object sender, EventArgs e)
{
text.Attributes.Add("display","block");
}
You can also do this completely client side, using jQuery or javascript.Making a post back to the server everytime you need to change the visual appearance of your HTML can put unnecessary strain on the server and have a negative effect on the user experience by slowing down the overall performance of your site.
<head runat="server">
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
var id = "<%: text.ClientID %>";
id = "#" + id;
$(id).hide();
$("#chkShowHide").change(function () {
if (this.checked) {
$(id).show();
}
else{
$(id).hide();
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<input id="chkShowHide" type="checkbox" /> Show\Hide<br />
<asp:TextBox runat="server" ID="text"></asp:TextBox>
</form>
</body>

Chosen Select Selected Item Returns False

I'm trying to get selected items from chosen select in server-side.
Here is my HTML:
<head>
<title></title>
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<link href="Content/chosen.css" rel="stylesheet" />
<form id="form1" runat="server">
<select id="chsn" runat="server" class="chzn-select" multiple="true" name="faculty" style="width: 200px;">
</select>
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
<script src="Scripts/chosen.jquery.js"></script>
<script type="text/javascript">
$(function () {
$(".chzn-select").chosen();
$(".chosen-select").chosen();
});
</script>
</form>
Here is server-side:
protected void Button1_Click(object sender, EventArgs e)
{
List<ListItem> tmpLst = new List<ListItem>();
for (int i = 0; i < chsn.Items.Count; i++)
{
if (chsn.Items[i].Selected)
tmpLst.Add(chsn.Items[i]);
}
}
chsn.Items[i].Selected always returns false. Is there a better way to get selected items?
The problem is not with your Button1_Click event. ( I have tested it ).
The problem must be with the Page_Load event where you bind the select chsn with values. Make sure that you are binding the HTMLSelect under !IsPostBack
Naveen is right .. I am just answering this as i though you might not get Naveens point.
Everything in you pageload event.
put it under this check
if(!isPostBack)
{
//here comes the code you have in pageload event.
}

how to set visibility for asp.net drop downlist in the javascript

I have one dropdownlist in my asp.net web application. I want to set visibility for that dropdownlist in the Client side javascript such as visible=true or false. Can any one know solution for that means it will really appreciated.
Thank you..
Use jquery .show() and .hide() methods. You will need to find the dropdownlist using the clientid value like so:
$('#<%= myDropDown.ClientID %>').show() // shows dropdown
$('#<%= myDropDown.ClientID %>').hide() // hides dropdown
This is a sample with Javascript alone:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" language="javascript">
function doToggle() {
var ddl = document.getElementById("<%Response.Write(DropDownList1.ClientID.ToString()); %>");
if (ddl.style.display == "none") {
ddl.style.display = "block";
}
else {
ddl.style.display = "none";
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:DropDownList ID="DropDownList1" runat="server">
</asp:DropDownList>
<input id="Button1" onclick="doToggle();" type="button" value="Toggle" />
</div>
</form>
</body>
</html>
Good luck!

C# Disable/Enable Button based on Empty/Populated Text Boxes

I have a form with 5 text boxes and a button, and when the button is clicked it send the data to a SQL database. I would like the button to be disabled if any of the text boxes are null, how do I do this in C#? (I am in Visual Studio 2010 ASP.NET web app)
You need to write JavaScript/jQuery code.
Yes, What Sam said is right!!
you need to check first whether all your text boxes are empty or not.
that will be done by
If(txtbox1.text == "" || txtbox2.text == "" || txtbox3.text == "" || txtbox4.text == "" || txtbox5.text == "")
If any of the text box is empty then make the button disabled.
button1.enable = false;
If all are filled then make it as enabled.
button1.enable = true;
If you do not want to use Client side scripts, you can use validations for your controls
<asp:TextBox id="TextBox1" runat="server" />
<asp:RequiredFieldValidator id="RequiredFieldValidator1"
runat="server" ErrorMessage="Required!" ControlToValidate="TextBox1" >
</asp:RequiredFieldValidator>
Validation will trigger on postbacks.
If you have multiple controls, but you do not want to validate them all, you can use Validation Group. Check this link for using Validation Groups
use javascript setInterval on Page load if if you are using this single form on the page and check each textbox value length .. if anyone is null then disable submit button..
use jquery to disable and enable them.. check following code snippet that i have created for sample..
use this to access server control id if you are using these controls inside some container control eg. panel, contentplaceholder etc : $("#<%=button1.ClientID>%>")
$("#text1").val().length will check then length of text in textbox.. and then use jquery to enable and disable them..
<head runat="server">
<title></title>
<script src="http://code.jquery.com/jquery-1.7.min.js" type="text/javascript"></script>
<%-- <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.min.js" type="text/javascript"></script>--%>
<%--<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7-vsdoc.js" type="text/javascript"></script>--%>
<script type="text/javascript">
$(document).ready(function () {
$("#submit").attr('disabled', 'disabled');
$("#text1").keypress(function () {
check();
});
var intv = self.setInterval("check()", 1000);
});
function check() {
if ($("#text1").val().length > 0) {
$("#submit").removeAttr('disabled');
}
else {
$("#submit").attr('disabled', 'disabled');
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="text1" runat="server"></asp:TextBox>
<asp:Button ID="submit" runat="server" Text="Button" />
</div>
</form>
</body>
</html>

Validating textbox using javascript in MasterPage

I am using javascript for customValidator to validate textboxes in ASP.Net.
The code works perfectly when I am using a normal page, but as soon as I put that inside a MasterPage, the code doesn't work.
Below is the code for my aspx page. If I put this code inside a MasterPage it doesn't work.
Could you guys advise me how to make this work inside a MasterPage
Thanks,
Abhi.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<script type="text/javascript">
function validateOrFields(source, args){
var sUser = document.getElementById('TextBox1');
if (sUser.value == "")
{
args.IsValid = false;
}
else
{
args.IsValid = true;
}
return;
}
<div>
<asp:TextBox ID="TextBox1"
runat="server"></asp:TextBox>
<asp:CustomValidator ID="FieldValidator"
runat="server"
Text="Enter either a user name"
ClientValidationFunction="validateOrFields" onservervalidate="FieldValidator_ServerValidate"/>
<asp:Button ID="Button1" runat="server" Text="Button" />
</div>
</form>
</body>
</html>
The problem is the ID of the TextBox. When placed in the Master Page, it gets a different ClientID.
var sUser = document.getElementById('<%= TextBox1.ClientID %>');
you need to get the id by using ClientID
Replace your code by
var sUser = document.getElementById('<%= TextBox1.ClientID %>');
Try document.getElementById('ct100_TextBox1').value. It is just a temporary fix!! But anyone please suggest how to get this ID dynamically using code. I got this by viewing source of the page generated. I have also posted the same question here
link text

Categories