I have an asp.net listbox that has an option of "Other". If a user selects "Other" I want to enable a textbox. When the form is submitted I want the text inside of of the textbox to replace "Other". So far I have gotten the textbox to enable if the "Other" value is selected but not sure how to replace "Other" with the text from the textbox. Any ideas?
<script type="text/javascript">
$(document).ready(function () {
$("#ListBox1").click(function () {
var arr = [];
$.each($("#ListBox1 option:selected"), function () {
arr.push($(this).val());
});
if ($.inArray("Other", arr) >= 0) {
$("#TextBox12").prop("disabled", false);
}
else {
$("#TextBox12").prop("disabled", true);
}
});
});
</script>
<asp:ListBox ID="ListBox1" runat="server" SelectionMode="Multiple">
<asp:ListItem Text="Other" Value="other"></asp:ListItem>
<asp:ListItem Text="Blue" Value="blue"></asp:ListItem>
<asp:ListItem Text="Red" Value="red"></asp:ListItem>
<asp:ListItem Text="Green" Value="green"></asp:ListItem>
</asp:ListBox>
<asp:TextBox ID="TextBox12" runat="server" Enabled="false"></asp:TextBox>
You should be careful with case sensitivity. The listbox item value is other but you are trying to find value in the array as Other.
if ($.inArray("other", arr) >= 0) {
$("#TextBox12").prop("disabled", false);
}
else {
$("#TextBox12").prop("disabled", true);
}
The simplest way may be to work through the code behind:
protected void TextBox12_TextChanged(object sender, EventArgs e)
{
if (ListBox1.SelectedItem != null && ListBox1.SelectedItem.Text == "Other")
{
ListBox1.SelectedItem.Text = TextBox12.Text;
}
}
Related
I'm new in asp.net and java script.
i want to check value of asp:dropdownlist' with java script.
selected value define in database but when i select an item with value 9 i didn't get back "hello" alert.any body can help me ? thanks.
<script>
$(document).ready(function offermessage() {
var a = ($('#<%=offermessage.ClientID %> option:selected').val());
if(a==9)
{
alert("hello");
}
});
</script>
<div class="col-12">
<asp:DropDownList ID="offermessage" CssClass="farsi-font drp-down-list" required="" runat="server" >
<asp:ListItem Value="Baseid">value</asp:ListItem>
</asp:DropDownList>
</div>
can you try with the below code
$(document).ready(function(){
function offermessage() {
var a = $('#<%=offermessage.ClientID%>').val();
if(a == 9)
{
alert("hello");
}
}
});
if you want to get the value of the dropdown on change event of dropdown then you can add below code
$(document).ready(function(){
$('#<%=offermessage.ClientID%>').on('change',function(){
var a = $(this).val();
if(a == 9)
{
alert("hello");
}
});
});
This is a Datalist in my code.
<asp:DataList runat="server" ID="dlstate" RepeatColumns="6">
<ItemTemplate>
<asp:CheckBox runat="server" ID="chk" Text='<%#Eval("area_state") %>' OnCheckedChanged="chk_state_SelectedIndexChanged" onchange="return checkconfirm(this);" AutoPostBack="true" />
</ItemTemplate>
</asp:DataList>
This is the Javascript code.
<script type="text/javascript">
function checkconfirm(a) {
if (a.checked == true) {
return true;
}
else {
debugger;
var box = confirm("Are you sure you want to unselect this state as areas alloted under this state will be lost?");
if (box == true)
return true;
else {
a.checked = true;
return false;
}
}
}
</script>
The problem is that when this apsx page is rendered in html the onchange="return checkconfirm(this);" appears on a span rather than the checkbox. I have tried several ways for confirmation and yet I am not able to put the onchange event on the checkbox.
You can use a jQuery listener for this.
<script type="text/javascript">
$(document).ready(function () {
$("#<%= dlstate.ClientID %> input[type='checkbox']").change(function () {
if (!$(this).prop("checked")) {
var box = confirm("Are you sure you want to unselect this state as areas alloted under this state will be lost?");
if (box == true)
return true;
else {
$(this).prop("checked", "checked");
return false;
}
}
});
});
</script>
hey everyone i have two view
1- Index
2- Edit
i have a grid its header have one checkbox i want to click checkbox all rows checkbox is checkbox. in my header checkbox its not working first time when i click uncheck then check its work fine. i dont know why and what is the problem in my code please help
here is my index view its have Script
function Check_Uncheck() {
$('#SelectAll').click(function () {
if (this.checked) {
$('.checkbox:enabled').each(function () {
this.checked = true;
});
}
else {
$('.checkbox:enabled').each(function () {
this.checked = false;
});
}
});
}
and here is my Edit its have checkbox
<input type="checkbox" id="SelectAll" onclick="Check_Uncheck();" tabindex="3" />
If you want to select and unselect all checkboxes of the gridview row, then you can do something like below:-
<script type="text/javascript">
function SelectAll(obj) {
var valid = false;
var chkselectcount = 0;
var gridview = document.getElementById('<%= GridView1.ClientID %>');
for (var i = 0; i < gridview.getElementsByTagName("input").length; i++) {
var node = gridview.getElementsByTagName("input")[i];
if (node != null && node.type == "checkbox") {
node.checked = obj;
}
}
return false;
}
</script>
Gridview aspx:-
<asp:GridView ID="GridView1"
runat="server" AutoGenerateColumns="false"></asp:GridView>
And onButton click
Select :
<asp:LinkButton ID="lnkdelete" runat="server" CausesValidation="false" Text="All" OnClientClick="SelectAll(true); return false"></asp:LinkButton>
|
<asp:LinkButton ID="lnkundelete" runat="server" CausesValidation="false" Text="None" OnClientClick="SelectAll(false); return false"></asp:LinkButton>
I'm using this code to check if a radiobuttonlist has been selected, however it doesn't return false if nothing has been checked, and continues through to the function in the class behind. The radiobutton list is generated from databinding in codebehind.
<asp:LinkButton class="btn" id="linkDelete" runat="server" onclick="link_Delete" OnClientClick="checkform()">Delete Template</asp:LinkButton>
<asp:radiobuttonlist id="optMessageType" runat="server" onselectedindexchanged="optMessageType_SelectedIndexChanged" RepeatDirection="Vertical" CssClass="none-table">
</asp:radiobuttonlist>
function checkform() {
var radiolist = document.getElementById('<%= optMessageType.ClientID %>');
var radio = radiolist.getElementsByTagName("input");
if (radio.length > 0) {
for (var x = 0; x < radio.length; x++) {
if (radio[x].type === "radio" && radio[x].checked) {
//alert("Checking...");
// alert("Selected item Value " + radio[x].value);
var r = confirm("Are you sure you want to delete this template?")
if (r == true) {
//alert("You pressed OK!")
return true;
}
else {
//alert("You pressed Cancel!");
return;
}
}
else {
alert("Select a template to delete");
return;
}
}
}
else {
alert("nope");
return;
}
}
Code Behind:
protected void link_Delete(object sender, System.EventArgs e)
{
Label3.Text = "Deleted!"; //For Testing
}
You should write
<asp:LinkButton class="btn" id="linkDelete" runat="server" onclick="link_Delete" OnClientClick="return checkform();">Delete Template</asp:LinkButton>
i have added return in OnClientClick atribute funcion call
hope this may solve our problem.
We have a RadioButtonList with three ListItems. When the user makes a selection, we want to display a confirm box. If they hit cancel, we just want the selection change to be undone. The below code works fine in everything -BUT- IE 7, 8, and 9. In IE, none of the ListItems are selected after the return false executes, but in all others, with only the code below, the selection is undone and the previously selected item is then selected, like we want. Y U NO WORK IE?
Markup:
<asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatDirection="Horizontal" OnSelectedIndexChanged="RadioButtonList1_SelectedIndexChanged" AutoPostBack="False">
<asp:ListItem Selected="True" onClick="return confirmSubmit(this, event);">Value 1</asp:ListItem>
<asp:ListItem onClick="return confirmSubmit(this, event);">Value 2</asp:ListItem>
<asp:ListItem onClick="return confirmSubmit(this, event);">Value 3</asp:ListItem>
</asp:RadioButtonList>
Javascript:
function confirmSubmit(listItem, e) {
var agree = confirm("Do you really want to change the value?");
if (!agree) {
return false;
}
else {
document.forms[0].submit();
}
}
The most straight forward cross browser compliant way of handling this is with the jQuery javascript library. Here's the solution in using jQuery that will work with your code.
<script type="text/javascript">
var rblContainer;
var lastChecked;
$(document).ready(function () {
rblContainer = $('#<%= RadioButtonList1.ClientID %>');
lastChecked = rblContainer.children().find('input[checked]');
});
function confirmSubmit(listItem, e) {
var l = $(listItem);
var agree = confirm("Do you really want to change the recipient type?");
if (!agree) {
lastChecked.attr("checked", "checked");
return false;
}
else {
lastChecked = l;
document.forms[0].submit();
}
}
</script>