Ajax in ASP.NET


DevX Home    Today's Headlines   Articles Archive   Tip Bank   Forums   

Results 1 to 1 of 1

Thread: Ajax in ASP.NET

Hybrid View

  1. #1
    Join Date
    Oct 2010
    Posts
    1

    Ajax in ASP.NET

    I have a problem when using ajax in my web application. When event of dropdownlist is activated the data to be filled in the destination control is created duplicate and available in the top of the page. I am placing the code below
    ---HTML code---
    Code:
     <form id="form1" runat="server">
         <asp:ScriptManager ID="ScriptManager1" runat="server" />
        
        <table border="0" cellspacing="0" cellpadding="0" style="width: 725px">
                            <tr>                
                                <th align="center" colspan="5" valign="middle" class="text"  >
                                    <asp:Label ID="lblErrorMsg" runat="server" CssClass="alertMsg" Width="500" ></asp:Label>  
                                </th>                                     
                            </tr>          
                            <tr>
                                <th  height="21" align="left" valign="middle" colspan="5">
                                    Select Artefact Type</th> 
                            </tr>
                            <tr>
                                <th  height="29" align="left" valign="top" scope="row"> 
                                    <asp:DropDownList ID="ArtefactType" runat="server" Width="140px" 
                                        onselectedindexchanged="ArtefactType_SelectedIndexChanged"  
                                        CssClass="formlines" AutoPostBack="true">                                   
                                        <asp:ListItem Value=""> -- Select --</asp:ListItem>
                                        <asp:ListItem Text="1" Value="1" />
                                        <asp:ListItem Text="2" Value="2" />
                                        <asp:ListItem Text="3" Value="3" />
                                        <asp:ListItem Text="4" Value="4 Konfig"/>
                                        <asp:ListItem Text="Miscellaneous" Value="Miscellaneous" />
                                    </asp:DropDownList>
                                </th>                         
                            </tr>
                            
                           
                           
                           <%-- <asp:Panel runat="server" id="FilterPanel" Visible="true" >--%>
                              
                                <tr>
                                    <th width="145" height="21" align="left" valign="middle"  class="text" scope="col">
                                        Select Project</th>  
                                    <th height="21" align="left" valign="middle" class="style1" scope="col">
                                        Select S/W Release</th> 
                                                       
                                        
                              </tr>
                              <tr>
                                   
                                        <th width="145" height="21" align="left" valign="top" scope="col"> 
                                        <asp:DropDownList ID="ProjectsCmb" runat="server" Width="140px" 
                                            CssClass="formlines" Height="28px" 
                                            onselectedindexchanged="ProjectsCmb_SelectedIndexChanged" 
                                            AutoPostBack="True"  >
                                        </asp:DropDownList>&nbsp;&nbsp;
                                        </th>
                                   <asp:UpdatePanel ID="UpdateFilterPanel" runat="server"  UpdateMode="Conditional" >
                                    <ContentTemplate> 
                                        <th width="145" height="21" align="left" valign="top" scope="col"> 
                                        <asp:DropDownList ID="SoftwareReleaseCmb" runat="server" Width="140px" 
                                            CssClass="formlines" 
                                            onselectedindexchanged="SoftwareReleaseCmb_SelectedIndexChanged" 
                                            AutoPostBack="True" >
                                         </asp:DropDownList>&nbsp;&nbsp;</th>
                                    </ContentTemplate> 
                                    <Triggers>
                                        <asp:AsyncPostBackTrigger ControlID="ProjectsCmb" EventName="SelectedIndexChanged" />
                                         
                                    </Triggers>
                                 </asp:UpdatePanel>   
                                 
                                         
                                        
                              </tr> 
                              <tr>
                                <th valign="middle" align="center" colspan="5">&nbsp;
                                <asp:UpdateProgress ID="UpdateProgress1" runat="server" 
                                    DisplayAfter="100" Visible="true" DynamicLayout="true">
                                    
                                    <ProgressTemplate>
                                         
                                    </ProgressTemplate>
                                    
                                </asp:UpdateProgress>
                                
                                </th>
                              </tr>
                              <tr>
                              <th height="21" align="left" valign="middle" class="text" scope="col" colspan="2">
                                        
                                        <asp:Button ID="SearchArtefactsBtn" runat="server" Text="Search Artefacts" 
                                            CssClass="formlines"   /></th>
                                         
                                
                              </tr>
                            <%--</asp:Panel>--%>                     
                           
                        </table>        
            
            <asp:UpdateProgress ID="udProgress" runat="server" 
                DisplayAfter="100" Visible="true" DynamicLayout="true">
                
                <ProgressTemplate>
                     
                </ProgressTemplate>
                
            </asp:UpdateProgress>        
            
        </form>
    ---------------

    -- --Backend code C#--------
    Code:
          protected void ArtefactType_SelectedIndexChanged(object sender, EventArgs e)
            {
                ProjectsCmb.Items.Add("1");
                ProjectsCmb.Items.Add("22");
                ProjectsCmb.Items.Add("333");
                ProjectsCmb.Items.Add("4444");
    
            }
            protected void ProjectsCmb_SelectedIndexChanged(object sender, EventArgs e)
            {
                SoftwareReleaseCmb.Items.Add("1");
                SoftwareReleaseCmb.Items.Add("22");
                SoftwareReleaseCmb.Items.Add("333");
                SoftwareReleaseCmb.Items.Add("4444");
    
            }
    ----------------------------

    when u run the code and selected the first combobox artifact type the project combobox is filled and when u select the item in the project combobox the data should be filled in s/w release ,(here I have used the ajax updatepanel for partial postback of the form) but an extra combobox is created at the top of the page and the data is filled in that control.

    why another control is created of the same type?

    I have uploaded 3 images, which the 1.jpg is the actual appearance, and 2.jpg is the selection of the project item
    3.jpg an extra control of s/w release is created which is showed in red mark which the data should actually filled in the s/w release combobox.

    Note: once the data is submitted to server by clicking the button the newly created control is not visible and the data is available in the actual cotrol of the combobox. Am I missing to select any property while using the ajax updatepanel?
    Attached Images Attached Images
    • File Type: jpg 1.jpg (22.1 KB, 50 views)
    • File Type: jpg 2.jpg (22.8 KB, 46 views)
    • File Type: jpg 3.jpg (23.0 KB, 44 views)

Similar Threads

  1. Replies: 1
    Last Post: 09-03-2009, 05:23 PM
  2. ASP.NET 2.0 and AJAX
    By otai007 in forum AJAX
    Replies: 0
    Last Post: 09-05-2007, 09:42 PM
  3. Replies: 3
    Last Post: 09-12-2006, 02:31 AM
  4. New forum + some AJAX links
    By Lori in forum AJAX
    Replies: 0
    Last Post: 02-09-2006, 01:26 PM
  5. Free ASP.NET Web Matrix Design/Editor Tool Released
    By ASPSmith Training in forum dotnet.announcements
    Replies: 0
    Last Post: 06-18-2002, 03:39 AM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center
 
 
FAQ
Latest Articles
Java
.NET
XML
Database
Enterprise
Questions? Contact us.
C++
Web Development
Wireless
Latest Tips
Open Source


   Development Centers

   -- Android Development Center
   -- Cloud Development Project Center
   -- HTML5 Development Center
   -- Windows Mobile Development Center