I have an app that contains a type-ahead textbox. The users wanted the type-ahead to use "Starts With" instead of "Contains" for the search. My colleague wrote some javascript to enable the "Starts With" search. It works great...until I click the Add button. Then the list does not refresh with all of the options. Here is what I mean:
The textbox/datalist begins (on loading/refreshing the page) populated as follows:
Apple
Apricot
Avocado
Banana
Blackberry
Blueberry
Cherry
Coconut
Cranberry
If I begin typing C, the textbox/datalist now contains:
Cherry
Coconut
Cranberry
If I select Cherry and then click Add, I would expect the list to return to its original state with all of the fruit, however it retains the value of Cherry and deleting Cherry only adds back the other fruits that start with "C," so the list is once again:
Cherry
Coconut
Cranberry
I need all of the fruit back in the list after an add. Please see the following code:
From the aspx:
<datalist id="dlParentFruit">
<asp:PlaceHolder ID="phParentFruit" runat="server"></asp:PlaceHolder>
</datalist>
<asp:TextBox ID="txtAddStdFruit" list="dlParentFruit" runat="server" Width="200px" MaxLength="250"></asp:TextBox>
<ajax:FilteredTextBoxExtender ID="fteAddFruit" runat="server" TargetControlID="txtAddStdFruit" FilterType="Custom" FilterMode="InvalidChars" InvalidChars=""'[]{}\|^~`!@#$"></ajax:FilteredTextBoxExtender>
<asp:Panel ID="pnlValAddFruit" runat="server" CssClass="cse-val-tooltip cse-hide">
<img src="../Images/triangle.png" alt="validation error" />
<ul id="vulAddFruit" runat="server"></ul>
</asp:Panel>
<asp:RequiredFieldValidator ID="rfvAddStdFruit" runat="server"
ErrorMessage="Required: Fruit"
ControlToValidate="txtAddStdFruit"
Display="None"
ValidationGroup="Add"
data-val="pnlValAddFruit">
</asp:RequiredFieldValidator>
The code behind (VB):
``` Private Sub btnAddStdFruit_Click(ByVal sender As Object, ByVal e As EventArgs) Handles btnAddStdFruit.Click Try If IsErrorShownForAdd Then ResetAddValidation() End If
Page.Validate("Add")
If IsAddValid() Then
Dim dateMin As DateTime = Me.StdDate & " " & Helper.SetTime(txtAddStart.Text)
Dim dateMax As DateTime
If txtAddStop.Text = 2400 Then
dateMax = Helper.setMidnight(Me.StdDate, txtAddStop.Text)
Else
dateMax = Me.StdDate & " " & Helper.SetTime(txtAddStop.Text)
End If
Dim itemSelected As New ListItem
Dim ctrAddedFrts As Integer = 0
Dim bolDupeRow As Boolean = False
Dim strResourceList As String = String.Empty
For Each itemSelected In lbLocationResource.Items
If itemSelected.Selected = True Then
bolDupeRow = IsFruitDuplicate(-1, itemSelected.Text, dateMin, dateMax, txtAddStdFruit.Text, ddlAddCategory.SelectedValue)
If bolDupeRow = False Then
MRData.AddStdFruit(Me.StdID, txtAddStdFruit.Text, itemSelected.Value, dateMin, dateMax, ddlAddCategory.SelectedValue, Me.UserID, "Edit All Frt - Added Fruit")
ctrAddedFrts += 1
End If
strResourceList = strResourceList & itemSelected.Value & ","
End If
Next
If strResourceList.Length > 0 Then
'Remove last comma
strResourceList = strResourceList.Substring(0, strResourceList.Length - 1)
Me.SelectedResourceList = strResourceList
End If
If ctrAddedFrts > 0 Then
txtAddStart.Text = String.Empty
txtAddStop.Text = String.Empty
pnlValAddLocation.CssClass = Constants.VALIDATOR_PANEL_RESET_STYLE
ResetStdRequestSet()
ResetMenuFruitList()
ResetStandardFruitList()
BindLists()
BindStdFruits()
ElseIf ctrAddedFrts = 0 AndAlso bolDupeRow = False Then
IsErrorShownForAdd = True
pnlValAddLocation.CssClass = Constants.VALIDATOR_PANEL_STYLE
lbLocationResource.CssClass = "cse-select-error"
Dim listItem As New HtmlGenericControl("li")
listItem.InnerHtml = Helper.FormatErrorMessage("Error: Location must be chosen")
vulAddLocation.Controls.Add(listItem)
ElseIf ctrAddedFrts = 0 AndAlso bolDupeRow = True Then
IsErrorShownForAdd = True
pnlValAddLocation.CssClass = Constants.VALIDATOR_PANEL_STYLE
lbLocationResource.CssClass = "cse-select-error"
Dim listItem As New HtmlGenericControl("li")
listItem.InnerHtml = Helper.FormatErrorMessage("Error: Duplicate Fruit")
vulAddLocation.Controls.Add(listItem)
End If
End If
pnlAddStdFruits.Attributes.Add("style", "display: New;")
hlAddFruits.InnerText = "-Add Fruits"
upnlStdFruits.Update()
Catch ex As Exception
AppUtilities.HandleError(ex, Me.Page, Identity.SystemUserID, Constants.SITE_ID, PAGE_NAME)
End Try
End Sub
Sub BindLists() ddlAddCategory.DataSource = Me.FruitCategoryList ddlAddCategory.DataTextField = "Fruit_CATEGORY" ddlAddCategory.DataValueField = "Fruit_CATEGORY_ID" ddlAddCategory.DataBind() ddlAddCategory.Items.Insert(0, New WebControls.ListItem("", -1)) ddlAddCategory.SelectedIndex = 0
phParentFruit.Controls.Clear()
Dim dtFruits As DataTable = Me.StandardFruitList
Dim hgcParentList As New HtmlGenericControl
hgcParentList.InnerHtml = Helper.BuildDatalist(dtFruits, "Fruit_TEXT", "LU_ID_CAT")
phParentFruit.Controls.Add(hgcParentList)
End Sub
Public Sub BindStdFruits(Optional ByVal dt As DataTable = Nothing) Dim dtStdFrt As DataTable If Me.MenuFruitList Is Nothing Then ResetMenuFruitList() dtStdFrt = Me.MenuFruitList Else dtStdFrt = Me.MenuFruitList End If
If Me.StandardFruitList Is Nothing Then
ResetStandardFruitList()
End If
If dtStdFrts.Rows.Count > 0 Then
gvStdFrt.DataSource = dtStdFrt
gvStdFrt.DataBind()
lblGridMessage.Text = String.Empty
lblGridMessage.Visible = False
If Not Me.IsReadOnly Then
hlMassTime.Visible = True
btnDelete.Visible = True
btnUpdate.Visible = True
Else
hlMassTime.Visible = False
btnDelete.Visible = False
btnUpdate.Visible = False
End If
gvStdFrt.Visible = True
Else
lblGridMessage.Visible = True
lblGridMessage.Text = "No menu Fruits"
If (hlAddFruits.Visible = True) Then
pnlAddStdFruits.Attributes.Add("style", "display: New;")
hlAddFruits.InnerText = "-Add Fruits"
End If
btnDelete.Visible = False
btnUpdate.Visible = False
hlMassTime.Visible = False
gvStdFrt.Visible = False
End If
upnlStdFruits.Update()
End Sub
Sub ResetStandardFruitList() Dim dtStdFrt As DataTable dtStdFrt = MIMData.GetStandardFruitByType("STD") Me.StandardFruitList = dtStdStdFrt End Sub
<br />
JavaScript:<br />
Methods.addNewFruitsFruitListStartsWith = function (txtFruit) {
if (typeof txtFruit !== 'undefined' && txtFruit !== null && txtFruit.nodeName === 'INPUT' &&
Controls.addPanelFruitOptions !== null && typeof Controls.addPanelFruitOptions !== 'undefined' &&
Inputs.initialAddPanelFruitDataListContent !== null && typeof Inputs.initialAddPanelFruitDataListContent !== 'undefined') {
var value = txtFruit.value;
if (typeof value !== 'undefined' && value !== '') {
var options = '';
for (var i = 0; i < Controls.addPanelFruitOptions.length; i++) {
if (Controls.addPanelFruitOptions[i].value.toLowerCase().startsWith(value.toLowerCase())) {
options += '<option value="' + Controls.addPanelFruitOptions[i].value + '" />';
}
}
Controls.addPanelFruitDataList.innerHTML = options;
} else {
Controls.addPanelFruitDataList.innerHTML = Inputs.initialAddPanelFruitDataListContent;
}
}
}