Ajax Extender and radgrid refresh Using javascript, two component same id problem

9 posts, 0 answers
  1. Karthik Sellappan
    Karthik Sellappan avatar
    1 posts
    Member since:
    Jul 2009

    Posted 16 Jul 2009 Link to this post

    Hi,

    we are using ajax extender controls and radgrid in same form, when we try to refresh the grid using the following javascript code:

     window["<%=rgJobSentTechnicianList.ClientID%>"].AjaxRequest('<%=rgJobSentTechnicianList.UniqueID%>', 'Refresh');                

     we are getting javascript error( "Sys.InvalidOperationException: Two Componentswith the same id ").  Please help me to resolve this problem..

    Thanks in Advance,

    Karthik
  2. Sebastian
    Admin
    Sebastian avatar
    9934 posts

    Posted 17 Jul 2009 Link to this post

    Hi Karthik,

    You code snippet indicates that you are using RadGrid for ASP.NET and its internal ajax. I checked your account and since it does not indicate that you purchased our controls previously, I suggest you migrate to the ASP.NET AJAX version of the control and ajaxify the grid using RadAjaxManager as illustrated on this demo:

    http://demos.telerik.com/aspnet-ajax/controls/examples/integration/gridandwindow/defaultcs.aspx?product=grid

    Our ASP.NET AJAX controls are build on top of the ASP.NET AJAX framework and provide better compatibility with the controls from the AJAX Toolkit or ASP.NET AJAX extenders in general.

    Regards,
    Sebastian
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  3. Yvette
    Yvette avatar
    8 posts
    Member since:
    May 2009

    Posted 12 Nov 2009 Link to this post

    Hi sebastian,

    I have the same issue

     

    function RowSelected(row)

     

    {

     

     

    $find(

    "<%= InvoiceTransactionDetailGrid.ClientID %>").AjaxRequest("<%=InvoiceTransactionDetailGrid.UniqueID %>","RowSelectionChanged:" + row.ID);

     

     



     

    function

     

    RefreshGrid()

     

    {

    $find(

    "<%= InvoiceTransactionGrid.ClientID %>").AjaxRequest("<%= InvoiceTransactionGrid.UniqueID %>","RefreshMainGrid");

     

    }

    Im trying to migrate from Radgrid classic to Q3 2008 version of radgrid asp.net ajax.im totally struck,This keeps on throwing exception ' null is null not an object'

    $find("ctl00_mcph_InvoiceTransactionGrid").AjaxRequest("ctl00$mcph$InvoiceTransactionGrid","RefreshMainGrid");
    i have no idea,how to resolve.i read your previous blog and u had replied to karthick on ho to upgrade.the webpage you provided
    seems not working.

    Can you please kindly guide me.Urgent please.




    Thanks

    yvette

  4. Sebastian
    Admin
    Sebastian avatar
    9934 posts

    Posted 13 Nov 2009 Link to this post

    Hello Yvette,

    Since the ASP.NET AJAX version of RadGrid does not have integrated ajax capabilities, you need to invoke the request from the client using RadAjaxManager instance. Review the resources listed at the bottom of this message for more details:

    http://www.telerik.com/help/aspnet-ajax/grdmigrationtoprometheus.html

    http://demos.telerik.com/aspnet-ajax/ajax/examples/manager/clientsideapi/defaultcs.aspx
    http://www.telerik.com/help/aspnet-ajax/ajxajaxmanager.html

    Best regards,
    Sebastian
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  5. Yvette
    Yvette avatar
    8 posts
    Member since:
    May 2009

    Posted 25 Nov 2009 Link to this post

    Hi Sebastian,

    Thanks for you reply.I have another problem here and im in a need of quick solution.
    Well i have two grids.on clicking the row of grid one the grid teo should get updated based on the Id of the row i clicked and fill in values for grid 2. Im using radajaxmanager here along with ajaxRequestWithTarget  and i call the Raisepostpostback from the server side.
    The problem is whenever  i click the row of radgrid1,the selecteditems.count of radgrid1 is always 0 and thereby the radgrid1.selectedvalue is always 0 ,so my second radgrid2 do not even get updated.

    Here is my code snippet :

     

    function RowSelected(sender,args)  // call this fun from clientevents on rowselection.

     

    {

     

     

    var grid = sender;

     

     

    var MasterTable = grid.get_masterTableView();

     

     

    var row = MasterTable.get_dataItems()[args.get_itemIndexHierarchical()];

     

     

    var cell = MasterTable.getCellByColumnUniqueName(row, "TransactionID");

     

     

    var ID = cell.innerHTML;

     

    alert (ID);

     

    var ajaxmanager = $find("<%= RadAjaxManager1.ClientID %>");

     

    ajaxmanager. ajaxRequestWithTarget(

    "<%=InvoiceTransactionGrid.UniqueID %>","RowSelectionChanged:" + ID);

     



     

    telerik

     

    :RadAjaxManager ID="RadAjaxManager1" runat="server" EnableAJAX ="true" >

     

     

    <AjaxSettings>

     

     

    <telerik:AjaxSetting AjaxControlID="InvoiceTransactionGrid">

     

     

    <UpdatedControls>

     

     

     

    <telerik:AjaxUpdatedControl ControlID="InvoiceTransactionGrid" /> //radgrid1

     

     

    <telerik:AjaxUpdatedControl ControlID="InvoiceTransactionDetailGrid" LoadingPanelID ="AjaxLoadingPanel1" /> //radgrid2

     

     

    </UpdatedControls>

     

     

    </telerik:AjaxSetting>

     

     

     

    </AjaxSettings>

     

    </

     

    telerik:RadAjaxManager>

     

     

     

     

     

     

     

    <telerik:RadAjaxLoadingPanel ID="AjaxLoadingPanel1" runat="server" Transparency="20" BackColor="#E0E0E0">

     

     

    <table style="width:100%;height:100%;">

     

     

    <tr style="height:100%">

     

     

    <td align="center" valign="middle" style="width:100%">

     

     

    <img src='<%= RadAjaxLoadingPanel.GetWebResourceUrl(Page, "Telerik.Web.UI.Skins.Default.Ajax.loading4.gif") %>'

     

     

    alt="Loading..." style="border: 0;"/>

     

     

    </td>

     

     

    </tr>

     

     

    </table>

     

     

    </telerik:RadAjaxLoadingPanel>

     

     

     


     

     

     

    <telerik:RadGrid ID="InvoiceTransactionGrid" runat="server" Skin="Web20" Width="99.5%"

     

     

    AllowSorting="True" AllowFilteringByColumn="true" AllowMultiRowSelection ="false"

     

     

    PageSize="15" PagerStyle-Mode="NextPrevNumericAndAdvanced"

     

     

    ShowFooter="True" AllowPaging="True" AutoGenerateColumns="False"

     

     

    OnNeedDataSource="InvoiceTransactionGrid_NeedDataSource">

     

     

    <MasterTableView TableLayout="Auto" Width="100%" EditMode="EditForms" CommandItemDisplay="Bottom"

     

     

    ClientDataKeyNames="ID">

     

     

     

     

     

     

    <telerik:RadGrid ID="InvoiceTransactionDetailGrid" runat="server" Skin="Web20" Width="99.5%"

     

     

    AutoGenerateColumns="False" AllowAutomaticUpdates="False" AllowAutomaticDeletes="False"

     

     

    AllowAutomaticInserts="False" AllowMultiRowEdit="False" OnNeedDataSource="InvoiceTransactionDetailGrid_NeedDataSource"

     

     

    OnPreRender="InvoiceTransactionDetailGrid_PreRender" OnItemDataBound="InvoiceTransactionDetailGrid_ItemDataBound"

     

     

    ShowHeader="false" Style="overflow: hidden;">

     

     

    <MasterTableView ClientDataKeyNames="ID" ShowHeader="false" CommandItemDisplay="Bottom"

     

     

    Width="100%">

     

     

     


    my server side code is :

     

     

    protected override void RaisePostBackEvent(System.Web.UI.IPostBackEventHandler sourceControl, string eventArgument)

     

    {

     

    base.RaisePostBackEvent(sourceControl, eventArgument);

     

     

     

    if (sourceControl is RadGrid)

     

    {

     

    string[] eventArgs = eventArgument.Split(':');

     

     

    switch (eventArgs[0])

     

    {

     

    case "RowSelectionChanged":

     

    InvoiceTransactionDetailGrid.Rebind();

     

    break;

     

     

    case "RefreshMainGrid":

     

    InvoiceTransactionGrid.Rebind();

     

    break;

     

     

    case "DeleteTransaction":

     

     

    GridDataItem selectedItem = (GridDataItem)InvoiceTransactionGrid.SelectedItems[0];

     

     

    int transactionID = Convert.ToInt32(selectedItem["TransactionID"].Text);

     

    m_monthlyBillEditDataAccess.DeleteInvoiceTransactionAndBillingHistory(transactionID);

    InvoiceTransactionGrid.Rebind();

     

    break;

     

     

    default:

     

     

    break;

     

    }

    }

    }

     


     

     

     

    protected void InvoiceTransactionDetailGrid_NeedDataSource(object source, GridNeedDataSourceEventArgs e)

     

    {

     

    int selectedTransactionID = 0;

     

     

    int num = InvoiceTransactionGrid.SelectedItems.Count ;

     

     

    if(InvoiceTransactionGrid.SelectedItems.Count>0) // this is always zero

     

    {

     

    selectedTransactionID = (

    int)InvoiceTransactionGrid.SelectedValue; //always zero

     

    TransactID = selectedTransactionID;

     

     

    }

     

    else if(InvoiceTransactionGrid.Items.Count > 0)

     

    {

    selectedTransactionID = (

    int)InvoiceTransactionGrid.Items[0].GetDataKeyValue("ID"); // i get the top most item always on page load

     

     

    }

     

    MonthlyBillEditDataAccessSet dataset = m_monthlyBillEditDataAccess.GetInvoiceTransactions(selectedTransactionID);

     

    InvoiceTransactionDetailGrid.DataSource = dataset.InvoiceTransactionsCarrierInfoJoinView;

    }

     

    Can you please explain whats wrong and how am i supposed to overcome with it .Provide some code examples,i have read enough documents and i totally frustrated without having to find anything.
    I appreciate your help.

    Thanks
    Yvette

  6. Sebastian
    Admin
    Sebastian avatar
    9934 posts

    Posted 25 Nov 2009 Link to this post

    Hello Yvette,

    I think that you can base your code on the online demo below:
    http://demos.telerik.com/aspnet-ajax/grid/examples/programming/selectedvalue/defaultcs.aspx

    This will simplify your logic and you will be able to achieve the same master/detail representation.

    Best regards,

    Sebastian
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  7. Yvette
    Yvette avatar
    8 posts
    Member since:
    May 2009

    Posted 25 Nov 2009 Link to this post

    Sebastian,
    I have another problem too

    Radcontextmenu,i have already setup the radmenuitem but i have to append some more values to the text of radmenuitem.How would i do that through a javascript and what event should i call it form.

    Snippet

     

    <telerik:RadContextMenu id="SIMGridMenu" runat="server" Flow="Vertical" Skin="Web20" Height="33" Width="130" OnItemClick="SIMGridMenu_ItemClick"

     

     

    ContextMenuElementID="contextElement" OnClientItemClicking ="SetText" >

     

     

    <Items>

     

     

    <telerik:RadMenuItem runat ="server" Text="View History by Number" Value ="View History by Number" Font-Names="Verdana" />

     

     

    <telerik:RadMenuItem runat ="server" Text="View History by User" Value ="View History by User" Font-Names="Verdana" />

     

     

    <telerik:RadMenuItem runat ="server" Text="View Ownership History by Number" Value ="View Ownership History by Number" font-Names="Verdana" />

     

     

    </Items>

     

     

    <Targets >

     

     

    <telerik:ContextMenuControlTarget ControlID ="SIMGrid" />

     

     

    </Targets>

     

     

    </telerik:RadContextMenu>

     

     

    function SetText(sender,args)

     

    {

     

     

    var itemValue= args.get_item().get_value();

     

     

     

    if(itemValue =="View Billing History from")

     

    {

    itemValue =itemValue + mobileNumber ;

    }

     

     

    if(name)

     

    {

     

    if(itemValue =="View All Billing History by ")

     

    {

    itemValue = itemValue + name;

    }

     

    else

     

     

     

     

     

    if(itemValue =="View Billing History from")

     

    {

    itemValue = itemValue + mobileNumber ;

     

    }

     

    if(itemValue =="View Ownership History by Number")

     

    {

    itemValue =itemValue + mobileNumber;

    }

    }

    }

     

     

     

     

     

    js:

     

     

    function SetText(sender,args)

     

     

    {
     var menu = $find("<%= SIMGridMenu.ClientID %>"); 

     menu.trackChanges();

     menu.set_text("View Billing History from " + mobileNumber);

      if(name)

     menuset_text("View All Billing History by " + name);

     else

     menu.set_text("View Billing History from " + mobileNumber);

     menu.set_text("View Ownership History by Number " + mobileNumber);

     menu.commitChanges();
    }

     

     

     

    Can u help me how to append values retrieved using JS to already added radmenuitem of radcontext.

    Thanks
    Yvette

  8. Yana
    Admin
    Yana avatar
    4816 posts

    Posted 27 Nov 2009 Link to this post

    Hello Yvette,

    You can use OnClientShowing event of RadContextMenu to update the text of the items.

    set_text() method of RadMenuItem client-side object should be used in order to append text like this, for example:

    menu.get_items().getItem(0).set_text("View Billing History from " + mobileNumber);


    Best regards,
    Yana
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  9. Yvette
    Yvette avatar
    8 posts
    Member since:
    May 2009

    Posted 27 Nov 2009 Link to this post

    Thanks Yana!

    That information was quite useful.I appreciate your help.

    Thanks
    Yvette
Back to Top