Situation-->
there are two ajax controls used....
The first one
acts as a prompter, that is, the person types say a letter l in the textbox, and the options starting with l are diplayed for the user to click and select.
The second ajax control
also acts a prompter, that is, when you type a letter l in the second textbox, it displays al the options, but only restricted to the options available WITHIN the option selected in the first text box.
I want to convert the second ajax control into a drop down, that is, all the options should appear restricted to the options available WITHIN the option selected in the first text box, but as a drop down list, not a prompter. How can this be achieved?
I would place each of the 2 DropDownLists in their own individual UpdatePanels, and have the initial TextBox outside:
<asp:TextBox ID="tbLetterChoice" MaxLength="1" runat="server" AutoPostBack="true" OnTextChanged="ShowDropDown1Options" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="tbLetterChoice" EventName="TextChanged" />
</Triggers>
<ContentTemplate>
<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="true" OnSelectedIndexChanged="ShowDropDown2Options" />
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="DropDownList1" />
</Triggers>
<ContentTemplate>
<asp:DropDownList ID="DropDownList2" runat="server" AutoPostBack="true" OnSelectedIndexChanged="DoSomething" />
</ContentTemplate>
</asp:UpdatePanel>
there would need to be two small methods in the codebehind to populate the DropDownLists:
protected void ShowDropDown1Options(object sender, EventArgs e){
DropDownList1.Items.Clear();
// populate DropDownList1 based on tbLetterChoice.Text
}
protected void ShowDropDown2Options(object sender, EventArgs e){
DropDownList2.Items.Clear();
// populate DropDownList2 based on DropDownList1.SelectedValue
}
protected void DoSomething(object sender, EventArgs e){
// take action based on final choice from DropDownList2
}
So, user types a letter into 'tbLetterChoiceand' hits enter. This updates 'DropDownList1'. User chooses item from 'DropDownList1', and this populates 'DropDownList2'. User chooses item from 'DropDownList2', and program executes 'DoSomething()'.
Related
As per topic in discussed. I've assigned one Timer1_Tick (AJAx Control) into my web form user control but it is not working right until i've perform "__doPostBack" in client side and it is not be able to perform automatically once the form is loaded.
Code in markup:
<asp:UpdatePanel ID="TimeSheetUpdate" runat="server" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="TimeSheetTimer" EventName="Tick"/>
</Triggers>
<ContentTemplate>
<asp:Timer ID="TimeSheetTimer" Interval="1000" runat="server" OnTick="TimeSheetTimer_Tick" ClientIDMode="Static"></asp:Timer>
</ContentTemplate>
</asp:UpdatePanel>
Code Behind:
protected void TimeSheetTimer_Tick(object sender, EventArgs e)
{
File.WriteAllText(#"C:\checkTimesheetcontrol.txt", "");
File.AppendAllText(#"C:\checkTimesheetcontrol.txt", "Check :" + DateTime.Now.Second);
return;
}
I need it to be perform ealier once the control in loaded in page.How Can I do for it?
once the page is loaded if we need to add something on the UI then how we will do it by using callback without loading the whole page again.
You can use UpdatePanel to do this i.e. without refreshing your whole page it can change components of your page.
<asp:UpdatePanel ID="UpdatePanelMain" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Button ID="BtnClick" runat="server" OnClick="BtnClick_Click" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="BtnClick" EventName="Click" />
</Triggers>
Now you will get call in code behind whenever "BtnClick" button is clicked. There you can write your code.
protected void BtnClick_Click(object sender, EventArgs e)
{
// Your logic
}
DropDownList's SelectedIndexChanged() Event fills the ListBox on the page. Obviously this posts the page back to the server. Is there any way to make it happen without full postback?
protected void ddlTablo_SelectedIndexChanged(object sender, EventArgs e)
{
List<string> list = new List<string>();
ListBox1.Items.Clear();
var columnNames= from t in typeof(Person).GetProperties() select t.Name;
foreach (var item in columnNames)
{
list.Add(item);
}
ListBox1.DataSource = list;
ListBox.DataBind();
}
You could put the DropDownList into an <asp:UpdatePanel> and set the trigger to the SelectedIndexChanged event of the DropDownList.
Something like this (don't forget the script manager)
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:DropDownList ID="drop1" runat="server" OnSelectedIndexChanged="ddlTablo_SelectedIndexChanged" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostbackTrigger ControlID="drop1" EventName="SelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel>
You can send ajax call, using asp.net UpdatePanel or use jQuery ajax. This wont do postback and your whole page wont get refreshed.
The UpdatePanel is quite straight forward and easy to use. ASP.net ajax will generate the asyn calls for you whereas jQuery ajax will probably need you to render html using javascript.
In the code snippet below, add this parameter: AppendDataBoundItems="True"
<asp:DropDownList ID="ddlGroupNameFilter"
runat="server"
AutoPostBack="true"
AppendDataBoundItems="true"
OnSelectedIndexChanged="ddlLeadgroupName_SelectedIndexChange">
</asp:DropDownList>
I put a timer control on a specific section on my page, but every time the timer is ticking, my text box (I have multiple text boxes) in another section loses it focus.
How can I resolve this? I tried placing the timer in a separate update panel.
the code in timer Tick event is
protected void Timer1_Tick(object sender, EventArgs e)
{
if ((List<AllPostInformation>)Session["AllNewsPostCollection"] != (List<AllPostInformation>)Session["CheckExistData"])
{
if ((List<AllPostInformation>)Session["AllNewsPostCollection"] != null)
{
List<AllPostInformation> o = new List<AllPostInformation>();
o = (List<AllPostInformation>)Session["AllNewsPostCollection"];
rptNews.DataSource = o;
rptNews.DataBind();
}
Session["CheckExistData"] = Session["AllNewsPostCollection"];
}
}
and on asp page
<asp:UpdatePanel runat="server" ID="upTimer">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
</Triggers>
<ContentTemplate>
<asp:Timer ID="Timer1" runat="server" Interval="5000" />
</ContentTemplate>
</asp:UpdatePanel>
If you look at the post in this link, Focus lost on partial postback with UserControls inside UpdatePanel you will get idea that you need not to put the timer control in the update panel instead put the items that are going to be updated.
I have a complicated case, so I can't post it.
I have two UpdatePanels with two UserControls inside them, like the following:
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<A:u1 ID="u1" runat="server" />
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<A:u2 ID="u2" runat="server" />
</ContentTemplate>
</asp:UpdatePanel>
In this sample, the PostBack in u1 doesn't effect on u2. but in my code the PostBack in the first UserControl made a PostBack in the second.
What are the expected reasons ??
Thanks for the help.
This is by design: when a partial postback occurs, the whole page is rendered again even if only part of the resulting markup is sent to the client. Thus, both your user controls go through their lifecycles again, even if only u1 is updated.
If you want to detect that case, you can use the IsInAsyncPostBack property:
protected void Page_Load(object sender, EventArgs e)
{
if (ScriptManager.GetCurrent(Page).IsInAsyncPostBack) {
// This is a partial postback.
}
}