You must Sign In to post a response.
  • Category: ASP.NET

    AutoCompleteExtender scolling up and down with page scolling

    AutoCompleteExtender scolling up and down with page scolling


    I have aspx page and i am using AutoCompleteExtender. when i run
    it is display data and suppose i not selected data from AutoCompleteExtender
    and start page scolling it is automatic scrolling with page up and down.
    So i want fixed position of AutoCompleteExtender with textbox of div. I am using
    bootstrap class for div.

    <style type="text/css">
    padding-left: 5px;
    margin: 0px;
    border: 1px ridge #fecd04;
    padding: 0px;
    height: auto;
    max-height: 135px;
    overflow: auto;
    background-color: #FFFFFF;
    font-family: "Droid Sans" , Arial, verdana;
    color: White;
    border-radius: 0px 0 4px 4px;
    box-shadow: -5px 1px 10px -5px #000000,0 5px 10px -5px #000000,5px 1px 10px -5px #000000;
    color: White;
    padding-left: 1px;
    background-color: #3498db;
    color: White;
    background-color: #34495e;

    <div class="col-sm-4 form-group">
    <b>Farmer Name</b>
    <asp:TextBox ID="tbFarmerName" runat="server" placeholder="Start typing to search..."
    <asp:AutoCompleteExtender ID="aceFarmerName" runat="server" TargetControlID="tbFarmerName"
    MinimumPrefixLength="1" EnableCaching="false" CompletionSetCount="0" CompletionInterval="100"
    FirstRowSelected="false" CompletionListCssClass="CompletionList" CompletionListHighlightedItemCssClass="ItemHighlighted"
    CompletionListItemCssClass="ListItem" ServiceMethod="GetAutoCompleteFarmerName"
  • #767468
    Have you tried with position property, it specifies the type of positioning method used for an element (static, relative, fixed or absolute).
    The position property specifies the type of positioning method used for an element.
    There are four different position values:
    Elements are then positioned using the top, bottom, left, and right properties. However, these properties will not work unless the position property is set first. They also work differently depending on the position value.
    see below link

    Editor, DotNetSpider MVM
    Microsoft MVP 2014 [ASP.NET/IIS]

  • #767471
    Please go through this:

    Here position of textbox is reset through javascript, each time when user scroll the page.

  • #767480

    For fixing gridview height and width the best and simple way is using Jquery, refer below sample code to accomplish your requirement.

    Add JQuery Plugins, for this we download from below link use the below link and download the plugins.

    After download JQuery plugins call that plugins using below lines of code

    <script type="text/javascript" src="../Scripts/jquery1.8.2.min.js"></script>
    <script type="text/javascript" src="../Scripts/jquery1.9.1.min.js"></script>
    <script type="text/javascript" src="../Scripts/gridviewScroll.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function () {

    function gridviewScroll() {
    width: 1100,
    height: 200

    and design your gridview like below

    <asp:GridView runat="server" ID="GV"
    <RowStyle BackColor="#EFF3FB" />
    <PagerStyle BackColor="#2461BF" ForeColor="White"
    HorizontalAlign="Center" /<
    <HeaderStyle CssClass="GVFixedHeader" />
    <FooterStyle CssClass="GVFixedFooter" />
    <AlternatingRowStyle BackColor="White" />
    <asp:TemplateField HeaderText="Material" HeaderStyle-Width="8%">
    <asp:Label ID="lblMaterial" runat="server" Text='<%# Bind_Material(Convert.ToString(Eval("Material")))%>'/>
    <asp:Label ID="lblMaterial_Id" runat="server" Text='<%#DataBinder.Eval(Container.DataItem,"Material_Id") %>' Visible="false"/>
    <asp:TemplateField HeaderText="Items" HeaderStyle-Width="8%" HeaderStyle-HorizontalAlign="center">
    <asp:Label ID="lblItem" runat="server" Text='<%#DataBinder.Eval(Container.DataItem,"Item") %>'/>
    <asp:Label ID="lblItem_Id" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"Item_Id") %>' Visible="false"/>
    <asp:TemplateField HeaderText="Grade" HeaderStyle-Width="8%" HeaderStyle-HorizontalAlign="center">
    <asp:Label ID="lblGrade" runat="server" Text='<%#DataBinder.Eval(Container.DataItem,"Grade") %>'/>
    <asp:Label ID="lblGrade_Id" runat="server" Text='<%#DataBinder.Eval(Container.DataItem,"Grade_Id") %>' Visible="false"/>


    if you want to know more details then refer below article here I explained clearly how to accomplish this task.

    Give respect to your work, Instead of trying to impress your boss.

    Blog :

  • Sign In to post your comments