SO far everything working ok, button is disabled until value is selected from the drop down list,
However I want ---select--- to be the first option on the drop down list, but this is not happening...any ideas as to why?
<asp:DropDownList ID="DropDownListSubContractors" runat="server"
AppendDataBoundItems="true" DataTextField="Company_Name" DataValueField="id"
onchange='selectChanged(this);'>
<asp:ListItem Text="---Select---" Value="0" />
<asp:ListItem Text="Option 1" Value="1" />
</asp:DropDownList>
<script type="text/javascript">
function selectChanged(e) {
document.getElementById("<%= addNewSubContractor.ClientID %>").disabled
= (e.options[e.selectedIndex].value == "0") ? "disabled" : "";
}
</script>
<asp:Button ID="addNewSubContractor" Text="Add Sub Contractor"
OnClick="UploadSubContractor" runat="server" disabled='disabled' />
Showing the manually added items first followed by the data bound items is the default behavior of the drop down list, so ---Select--- should in theory be the first item.
I suspect there is some logic elsewhere(can be javascript or code behind) which sets the selected item to something else i.e:
DropDownListSubContractors.SelectedIndex = 1;
Have a good look through your code and make sure the selected item is not being re-set anywhere
Have you got append databound item set to true, this checks to see if there are any items in the collection, and adds them first before binding?
Related
since I combined an asp:dropdownlist with an asp:checkboxlist, I have the problem in IE(8) and Firefox (Chrome works fine) that everytime I click the DropDownList, the empty box appears in addition to the popup I manually open when the dropdownlist is clicked.
My question now is: How can I hide this empty box (since there are no entries in it), but keep the dropdown element? I don't want to replace this component, since it still should look like a dropdownlist. If I change it to a text box it's not clear anymore that it can be used as a dropdown.
This is what I currently have in place:
<div style="width: 190px;" class="right">
<!-- the original drop down list -->
<asp:DropDownList CssClass="dropdownbox" ID="ddlCountry" runat="server">
</asp:DropDownList>
<cc1:PopupControlExtender ID="ddlCountry_PopupControlExtender" runat="server" DynamicServicePath=""
Enabled="True" ExtenderControlID="" TargetControlID="ddlCountry" PopupControlID="pnlPopup"
OffsetY="20">
</cc1:PopupControlExtender>
<!-- Popup control extender that maps the country list to the dropdown list -->
<asp:Panel ID="pnlPopup" runat="server" CssClass="dropdowncheckbox">
<!-- List of countries with a checkbox for each entry -->
<asp:CheckBoxList ID="countryList" runat="server"
DataTextField="Countries" DataValueField="Countries" AutoPostBack="True"
OnSelectedIndexChanged="countryList_SelectedIndexChanged">
</asp:CheckBoxList>
</asp:Panel>
</div>
If there is a component that fits my purpose better, please let me know.
Thanks a lot in advance for your suggestions.
Place this code in the event you need to trigger the change
This will work for c#
if(dropdownlist.Items.Count == 0)
{
dropdownlist.Attributes["style"] = "display: none;";
}
else
{
dropdownlist.Attributes["style"] = "";
}
Simply set the Drop Down List Enabled property to false and toggle it to true when it has entries.
dropdownbox.Enabled = false;
do something like this in c#:
if(dropdownlist.Items.Count == 0)
{
dropdownlist.Visible = false;
}
else
{
dropdownlist.Visible = true;
}
Encapsulate the dropdown in a div, give the div an id and the runat="server" property
Check in the code behind of the data to load the dropdown is empty set the div to visible false; if not, set the div to visible true.
Select multiple value in DropDownList using ASP.NET and C#. I tried it to select single value from drop down but unable to find multiple selection.
In that case you should use ListBox control instead of dropdown and Set the SelectionMode property to Multiple
<asp:ListBox runat="server" SelectionMode="Multiple" >
<asp:ListItem Text="test1"></asp:ListItem>
<asp:ListItem Text="test2"></asp:ListItem>
<asp:ListItem Text="test3"></asp:ListItem>
</asp:ListBox>
Take a look at the ListBox control to allow multi-select.
<asp:ListBox runat="server" ID="lblMultiSelect" SelectionMode="multiple">
<asp:ListItem Text="opt1" Value="opt1" />
<asp:ListItem Text="opt2" Value="opt2" />
<asp:ListItem Text="opt3" Value="opt3" />
</asp:ListBox>
in the code behind
foreach(ListItem listItem in lblMultiSelect.Items)
{
if (listItem.Selected)
{
var val = listItem.Value;
var txt = listItem.Text;
}
}
Dropdown list wont allows multiple item select in dropdown.
If you need , you can use listbox control..
ASP.NET List Box
For multiple selection dropdown list,cannot accomplish it directly using dropdown..Can be done in similar ways..
Either you have to use checkbox list or listbox (ajax inclusive)
http://www.codeproject.com/Articles/55184/MultiSelect-Dropdown-in-ASP-NET
http://social.msdn.microsoft.com/Forums/vstudio/en-US/54374df7-5a54-42bc-83b8-ad5994cb634d/multi-select-dropdownlist
http://www.dotnetfunda.com/articles/article1591-multiselect-dropdownlist-in-aspnet-using-csharp-40-.aspx
Is there any way do delay the autopostback on a dropdownlist until the list actually loses focus? I want to accept input from the keyboard without the page posting back after every keystroke. For example, take this code:
<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="true">
<asp:ListItem >Test1</asp:ListItem>
<asp:ListItem >Tst1</asp:ListItem>
<asp:ListItem >twotest</asp:ListItem>
</asp:DropDownList>
Say I want to select twotest. I tab to the ddl and input 'tw' into my keyboard. However, as soon as the 't' is entered, the page automatically posts back, while the 'w' input is lost. Resetting focus doesn't really help any as then the ddl thinks that 'w' is the first input. Any help would be appreciated.
It seems impossible. You must remove AutoPostBack="true" and try another way to perform postback. Consider below solution:
when dropdown ddlCountry changed, the function ddlCountry_changed is called that trigger btnLoad click to perform postback. The button btnLoad is put inside an update panel so the page is not reload and you still have focus on the dropdown.
<script type="text/javascript">
function ddlCountry_changed() {
document.getElementById('<%= btnLoad.ClientID %>').click();
}
</script>
Country:
<asp:DropDownList ID="ddlCountry" runat="server" onchange="ddlCountry_changed();">
<asp:ListItem Text="Vietnam" Value="1"></asp:ListItem>
<asp:ListItem Text="United State" Value="2"></asp:ListItem>
</asp:DropDownList>
<asp:UpdatePanel ID="updatePanel" runat="server">
<ContentTemplate>
<asp:Button ID="btnLoad" style="display: none" runat="server" OnClick="btnLoad_OnClick" />
</ContentTemplate>
</asp:UpdatePanel>
It's a little more complicated than just handling the blur. You need to remove the onchange attribute (AutoPostBack="false") so keyboard navigation is possible and attach event handlers that submit the form when the value has changed via clicking, blur, or the enter key is pressed.
I ran into this same issue and created a plugin for handling this. Check out https://github.com/bstruthers/AutoPostBack-Fix.
I'm attempting to display the answers in a certain survey, exactly as the surveyed person viewed the original survey. However, when viewing, I don't want the browser to allow changing of the selected options in a RadioButtonList. Is there a way to make a RadioButtonList read-only, without using radioButtonList1.Enabled = false?
I've tried subclassing RadioButtonList and adding a Fixed attribute to it that only allows changing of the selected value whenever Fixed = false, but it doesn't prevent the user from changing the values; it only reverts it to the original value if the RadioButtonList has AutoPostBack = true, and I want to avoid using postbacks at all.
I've considered using the graphics for a selected/unselected radio button and coding it up as pure HTML, string and bale wire, but I'm hoping there's a better way. Any ideas?
If you disable radio button elements, they will be greyed out and the form will not look the same as the original.
As a substitute for 'disable', you can have javascript restore the value if the user tries to change it. The jQuery click handler handles both keyboard and mouse selection:
<script type="text/javascript" src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>
<script type="text/javascript">
$(function(){
//save list of checked radio buttons
var checked = $('table input:radio:checked');
$("table input:radio").click(function() {
//go through list and re-check initial checks
$.each(checked, function() {
this.checked=true;
});
});
});
</script>
<asp:RadioButtonList runat="server" ID="rbl" >
<asp:ListItem Text="Item1" />
<asp:ListItem Text="Item2" Selected="True" />
<asp:ListItem Text="Item3" />
</asp:RadioButtonList>
Just use the code as below
<script type="text/javascript">
$(function(){
$("#rbl input:radio").attr("disabled", "true");
});
</script>
<asp:RadioButtonList runat="server" ID="rbl" >
<asp:ListItem Text="Item1" />
<asp:ListItem Text="Item2" Selected="True" />
<asp:ListItem Text="Item3" />
</asp:RadioButtonList>
I have dropdown list control in one of my application and when I add Items in it from database Its displaying the first Item into Dropdown list by default but I want to display someother text into this like "Select Item from the List" Is there any way I can do this .
Also Can you please help me setting the same value from javascript
On the ASP.NET side of things, you can create the DropDownList with AppendDataBoundItems="true" and any items you bind to it will come after the default:
<asp:DropDownList AppendDataBoundItems="true" ID="yourListId" runat="server">
<asp:ListItem Text="Select something" Value="-1" />
</asp:DropDownList>
As for doing the same thing completely in Javascript, you can do it with a function like this:
function addFirstItem(list, text, value)
{
var newOption = document.createElement("option");
newOption.text = text;
newOption.value = value;
list.options.add(newOption);
}
addFirstItem(document.getElementById("yourListId"), "Select something", "-1");
Or with jQuery (there is probably something much cleaner, especially for creating a new option tag, but this works):
$("#yourListId option:first").before("<option value='-1'>Select something</option>");
Patridge answer is correct, however if you are using the asp method and still run into a problem, add the items tag to the listitem.
<asp:DropDownList AppendDataBoundItems="true" ID="yourListId" runat="server">
<items>
<asp:ListItem Text="Select something" Value="-1">--Select Something--</asp:ListItem>
</items>
</asp:DropDownList>