I am trying to deselect item (once selected) when user will click on the item in listbox.
I have a script which is deselecting the item on user click but that is happening even when the item is selected for first time as well.
This is what I have:
JS:
function deselect()
{
var list = document.getElementById('<%=ddlCity.ClientID%>');
var listLength = list.options.length;
for (var i = 0; i < listLength; i++) {
if (list.options[i].selected) {
list.selectedIndex = -1;
}
}
}
And the html:
<asp:ListBox ID="ddlCity" CssClass="formfield" runat="server" DataSourceID="SqlDataSourceCity"
DataTextField="Description" DataValueField="CityID" SelectionMode="Multiple" onclick="deselect();"
OnDataBound="DropDownList3_DataBound"></asp:ListBox>
Any idea how I can edit that JS to deselect the value once the value is selected, but when user selects the value for first time the value to be selected.
Thanks, Laziale
Related
There is an issue I have not been able to solve which is where there is an 'Add Item' button on a form. When clicked this opens a Modal window which contains two dropdown lists. The first dropdown list is prepopulated with a set of items and based on this selection, the 2nd dropdown box ideally needs to update with its own set of items.
This is the first Dropdown List which contains the Type
<asp:DropDownList ID="DDLType" CssClass="form-control" runat="server" OnSelectedIndexChanged="LoadSubTypes" AutoPostBack="true">
<asp:ListItem Value="Automobile">Automobile</asp:ListItem>
<asp:ListItem Value="Aeroplane">Aeroplane</asp:ListItem>
<asp:ListItem Value="Boat">Boat</asp:ListItem>
</asp:DropDownList>
This is the second Dropdown List which currently sits empty until a selection is made from the first dropdown list.
<asp:DropDownList ID="DDLSubType" CssClass="form-control" runat="server">
</asp:DropDownList>
With the first DDL where there is an OnSelectedIndexChange, this is the code behind.
protected void LoadSubTypes(object sender, EventArgs e) {
string strSubTypeList = "";
switch (DDLType.SelectedValue)
{
case "Automobile":
strSubTypeList = "Car#Motorbike#Scooter";
break;
case "Aeroplane":
strSubTypeList = "Commercial#Private";
break;
case "Boat":
strSubTypeList = "Boat#Jetski";
break;
}
StringBuilder sbSubTypes = new StringBuilder();
Char delimiter = '#';
String[] substrings = strSubTypeList.Split(delimiter);
foreach (var substring in substrings)
{
DDLSubType.DataTextField = substring;
DDLSubType.DataValueField = substring;
DDLSubType.DataBind();
} }
Normally this type of setup works well for me, but the only difference this time is I have them loaded into a Modal. What happens when I make a selection from the DDL is that the modal closes and causes the postback. This resets any values that were then changed dynamically.
My ideal behavior here is that when a selection is made on the first DDL, the 2nd DDL updates within the modal and do not close.
Any help would be greatly appreciated!
I think you are saying that when I select an item from a dropdown list, then its relevent options will be shown on the next dropdown. You will have to use jquery ajax(it will be more easy).
When an item is selected from a dropdown, its value will be passed using ajax, which will without refreshing your page get your dropdown.
e.g.
<select class="form-control" id="Departments" ><option value="">-Select Department-</option>
<option value="17">No Department</option>
<option value="19">Men</option>
<option value="1018">Danial</option>
</select>
JavaScript with jquery:
$("#Departments").change(function () {
var deptId = $(this).select("option:selected").val();
$.ajax(
{
url: "/Categories/M_Level2/" + deptId
}).done(function (categories)
{
$("#category").html(categories);
});
In url, Categories is the controller and M_Level2 is the action that is getting a value deptId and on that basis returning a PartialView and then adding it on #category
Im new to ASP. can any body give the sample code for select all the checkbox while selecting one checkbox from the check box list.
Select All
A
B
C
once checking the select all check from the checkbox list all other items also should get selected.
First off, Please try to search internet for answers, since you are new to ASP, its better to try examples from the internet.--> Link to W3
what you can try is on click of "select all" check box, iterate through the checkbox collection list, and set the selected property to true.
Something like this
foreach (ListItem item in this.CheckBoxes.Items)
{
item.Selected = true;
}
use jquery for this purpose , use this id input#chkView for the main checkbox that will select/deselect all checkboxes and assign this class .viewPerm to all the checkboxes that you want to to check/uncheck on click of input#chkView .
<script type="text/javascript">
$(document).ready(function () {
$('input#chkView').change(function () {
if ($(this).attr('checked')) {
$('.viewPerm > input:checkbox').each(function () {
$(this).attr('checked', true);
});
}
else {
$('.viewPerm > input:checkbox').each(function () {
$(this).attr('checked', false);
});
}
});
});
take a one checkboxlist add item, add first item text as Select All ,after creating checkbox, set autopostback property to true, and handle selectedindexchanged event of checkboxlist
use following code in in the selectedindexchaged event:
if (CheckBoxList1.Items[0].Selected == true)
{
for (int i = 0; i < CheckBoxList1.Items.Count; i++)
{
CheckBoxList1.Items[i].Selected = true;
}
}
i have a datalist contains checkboxlist.
<asp:DataList ID="dtlstfilter" runat="server">
<ItemTemplate>
<asp:CheckBoxList ForeColor="Gray" AutoPostBack="true" OnSelectedIndexChanged="chklist_SelectedIndexChanged" ID="chklist"
runat="server">
</asp:CheckBoxList>
</ItemTemplate>
</asp:DataList>
when i check one from the checkbox list in the SelectedIndexChanged event i got the selected value using
CheckBoxList c = (CheckBoxList)sender;
string selectedvalue= c.SelectedValue;
likewise how can get the value from a checkboxlist if i uncheck one from the checkboxlist
The SelectedIndexChanged gets also fired if you uncheck a CheckBox. So it works the same way. But if you want to know the (now) unchecked item(s), you have to store the old selection somewhere, for example in the ViewState:
private IEnumerable<string> SelectedValues
{
get
{
if (ViewState["SelectedValues"] == null && dtlstfilter.SelectedIndex >= -1)
{
ViewState["SelectedValues"] = dtlstfilter.Items.Cast<ListItem>()
.Where(li => li.Selected)
.Select(li => li.Value)
.ToList();
}else
ViewState["SelectedValues"] = Enumerable.Empty<string>();
return (IEnumerable<string>)ViewState["SelectedValues"];
}
set { ViewState["SelectedValues"] = value; }
}
protected void chklist_SelectedIndexChanged(Object sender, EventArgs e)
{
CheckBoxList c = (CheckBoxList)sender;
var oldSelection = this.SelectedValues;
var newSelection = c.Items.Cast<ListItem>()
.Where(li => li.Selected)
.Select(li => li.Value);
var uncheckedItems = newSelection.Except(oldSelection);
}
This should even work if multiple checkboxes can be selected.
You can take the jQuery Route if it suits you...
if (!IsPostBack)
{
foreach (ListItem item in chkList.Items)
{
//adding a dummy class to use at client side.
item.Attributes.Add("class", "chkItem");
}
}
Put one button on your form with style display : none. And a Hidden Field to track the currently checked checkbox.
<asp:Button ID="hdnButton" runat="server" style="display:none;" OnClick="hdnButton_Click"/>
<asp:HiddenField ID="hdnCurrent" runat="server" />
The jQuery Part....
$(".chkItem input:checkbox").change(function(){
$("#hdnCurrent").val($(this).attr("id") + "|" + $(this).attr("checked"));
$("#hdnButton").click();
});
You can use more hidden fields if you don't want to do string operations on backend. Depends on your taste.
Then handle the button click event like below.
protected void hdnButton_Click(object sender, EventArgs e)
{
String[] Value = hdnCurrent.Value.Split('|');
if (Value[1] == "true")
{
//Do operations here when the check box is checked
}
else
{
//Do operations here when the check box is unchecked
}
//Value[0] contains the id of the check box that is checked/unchecked.
}
I have a ListBox which is populated dynamically from a database in the code behind. I have another button and when i click the button, the button click event will get the all the selected listitem and insert the list item text to the database. I set AutoPostBack as false and EnableViewState is true in the listbox property
The problem is when i click the button , it only see 1 selected item even i select multiple items.Here are the codes. I appreciate your help. I spend 1 day on this issue and not getting anywhere.
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
loadrdlist();
}
}
protected void loadrdlist()
{
((ListBox)TestFormView.FindControl("ListBoxB")).Items.Clear();
foreach (FailureTempRD rd in FailureTempRD.SelectFailureTempRD())
((ListBox)TestFormView.FindControl("ListBoxB")).Items.Add(new ListItem(rd.ReferenceDesignator, rd.ReferenceDesignator));
}
protected void btn_AddRD_Click(object sender, EventArgs e)
{
foreach (ListItem rd in ((ListBox)TestFormView.FindControl("ListBoxB")).Items) //This is where it only see 1 selected item
{
if (rd.Selected == true)
//put selected item to database
}
}
}
Here are both listbox and button
<asp:ListBox ID="ListBoxB" runat="server" SelectionMode="Multiple" ></asp:ListBox>
<asp:Button ID="btn_AddRD" runat="server" CausesValidation="False" onclick= "btn_AddRD_Click" Text="Add" />
Update :
I figure why. When i load the listitem, i need to add ID as listitem value. So change the following code. I test few times and it works as intend.
((ListBox)TestFormView.FindControl("ListBoxB")).Items.Add(new ListItem(rd.ReferenceDesignator, rd.ReferenceDesignator));
To
((ListBox)TestFormView.FindControl("ListBoxB")).Items.Add(new ListItem(rd.ReferenceDesignator, rd.ID));
Try using the GetSelectedIndices Method.
From above link:
Use the GetSelectedIndices method to identify or access the selected
items in the ListBox control. Each element in the returned array
represents the index for a selected list item. You can use the index
values to access the items in the Items collection.
On selecting the firstitem in the list box my Up button should be disabled. similarly on selecting the Lastitem in the listbox Down button should be disabled. I can able to find which item is selected by using selected index
if (lstview.SelectedIndex >= 0)
{
var selectedItems = lstview.SelectedItems;
foreach (ClassName selectedItem in selectedItems)
{
lstview.Items.Remove(selectedItem);
break;
}
}
but how to disable the up and down button based on selecting first item or last item in the list box
Compare the selected index with 0, and the number of items in the list and set the Enabled property of your buttons based on the selected index.
private void lstView_SelectedIndexChanged(object sender, System.EventArgs e)
{
upButton.Enabled = lstView.SelectedIndex > 0;
downButton.Enabled = lstView.SelectedIndex < lstView.Items.Count - 1;
}