How can I avoid postback in textchange event without using updatepanel.
When I use the updatepanel the css in my table is not working. I am using Bootstrap tags input in my table.
View image without update panel
When I use the updatepanel the tag inputs is not working
I am using AutoPostBack="true"
so that the cdde behind would trigger.
Here are my codes:
Front end:
<asp:TextBox ID="txtSearch" style="border-radius:10px;padding:5px 5px" CssClass="textbox" Font-Size="24px" Width="100%" placeholder="Tell us about you DREAM HOUSE" runat="server" AutoPostBack="true" OnTextChanged="txtSearch_TextChanged" ></asp:TextBox>
<ajaxToolkit:AutoCompleteExtender ServicePath="AutoComplete.asmx" ServiceMethod="SearchSubCategory" MinimumPrefixLength="1"
ID="AutoCompleteExtender1" runat="server"
CompletionInterval="0"
EnableCaching="false"
CompletionSetCount="10"
TargetControlID="txtSearch"
FirstRowSelected="false">
Code behind:
protected void txtSearch_TextChanged(object sender, EventArgs e)
{
if (HiddenField1.Value == "")
{
HiddenField1.Value = HiddenField1.Value + txtSearch.Text;
}
else
{
HiddenField1.Value = HiddenField1.Value + "," + txtSearch.Text;
}
txtSearch.Text = "";
Literal1.Text = "";
DisplaySubCategory();
}
protected void DisplaySubCategory()
{
arr1 = HiddenField1.Value.Split(',');
str.Append("<table id='tblsummary' class='displayresult'>");
strsql = "select description from category where show_customerpage=1";
cmd = new SqlCommand(strsql, conn);
if (conn.State == ConnectionState.Open)
{
conn.Close();
}
conn.Open();
ad = new SqlDataAdapter(cmd);
dt = new DataTable();
ad.Fill(dt);
desccategory.DataSource = dt;
desccategory.DataBind();
conn.Close();
for (i = 0; i < desccategory.Rows.Count; i++)
{
str.Append("<tr>");
str.Append("<th>");
str.Append(desccategory.Rows[i].Cells[0].Text);
str.Append("</th>");
str.Append("</tr>");
for (k=0;k<arr1.Length;k++)
{
strsql = "select subcategory.subcat,description from subcategory inner join dbo.category on subcategory.cat_id = category.cat_id where subcategory.subcat='" + arr1[k] +"'";
cmd = new SqlCommand(strsql, conn);
conn.Open();
using(reader=cmd.ExecuteReader())
{
if (reader.HasRows)
{
while (reader.Read())
{
HiddenField4.Value = reader["description"].ToString();
if (HiddenField4.Value == desccategory.Rows[i].Cells[0].Text)
{
if (HiddenField2.Value == "")
{
HiddenField2.Value = HiddenField2.Value + reader["subcat"].ToString();
}
else
{
HiddenField2.Value = HiddenField2.Value + "," + reader["subcat"].ToString();
}
}
}
}
else
{
if (desccategory.Rows[i].Cells[0].Text == "Others")
{
if (HiddenField2.Value == "")
{
HiddenField2.Value = HiddenField2.Value + arr1[k];
}
else
{
HiddenField2.Value = HiddenField2.Value + "," + arr1[k];
}
}
}
}
conn.Close();
}
str.Append("<tr>");
str.Append("<td>");
str.Append("<input id='text1' class='bootstrap-tagsinput form-control' style='background: transparent;' data-role='tagsinput' type='text' value='" + HiddenField2.Value + "' />");
str.Append("</td>");
str.Append("<tr>");
HiddenField2.Value = "";
}
str.Append("</table>");
Literal1.Text = str.ToString();
}
I am creating a dynamic table with bootstrap tag input inside. All i need is to remove the postback so that the css bootstrap tag input will work . I hope someone has encountered this.
Need some help! Thanks!