Changing values of components inside window

2 posts, 0 answers
  1. Óttar
    Óttar avatar
    5 posts
    Member since:
    Jul 2015

    Posted 11 Aug 2015 Link to this post

    So, after google-ing for about 6 hours or so I finally gave up. Hope someone here can hook me up with advice.

    I'm creating a dynamic function for all grids in my DNN module. ​When I double click on a row, I call the function editKey, which takes in parameter grid and fetches its ID (For now I only have two grids, but that is not the issue). ​Then it fetches all the information about that row​ and a new RadWindow opens up where the prefetched information can be seen and/or managed/deleted.
    As I open a new window, I load a new <div> inside it which serves as a template for each grid. The strange thing is, when I add the div to the server (runat="server) I cant seem to find it with the $find('<% ​CodaEdit1  %>') call.

     I want to use all of my prefetched info and put it into this div. My first thought of accessing the divs elements was to use something like

    document.getElementById("CodaEdit1").children[i].setAttribute("Text", info[i]);

    But that does not do anything.
    Neither can I access the first element in the div with

    document.getElementById("FindMe");​

    but

    var re = $find('<%= FindMe.ClientID %>');
            re.set_value("this works");

    Works perfectly. I can of course write the find function for each and every radtextbox that I have, but my code will look pretty ugly and scale terrible as my project grows.​

    Here is the referenced code

     

    <div id="CodaEdit1" style="display:none">
            <telerik:RadTextBox ID="FindMe" runat="server" Label="Rule" Text=""></telerik:RadTextBox>
             
    </div>
     
    <script type="text/javascript">
         
        var keySelected;
     
        function editKey(sender)
        {
            var whichLayout = windowLayout(sender);
            var grid, divinsert;
     
            switch(whichLayout)
            {
                case ("1"):
                    grid = $find('<%= RadGrid1.ClientID %>');
                    break;
                case ("2"):
                    grid = $find('<%= RadGrid2.ClientID %>');
                    break;
            }
            divinsert = $get("CodaEdit"+whichLayout);
     
            var masterTableView = grid.get_masterTableView();
            keySelected = rowInfo(masterTableView);
     
            //alert(document.getElementById("CodaEdit1").children[0]); <-- HTMLELEMENTSPAN
            document.getElementById("CodaEdit1").children[0].setAttribute("Text", "Goon"); <-- Does nothing
     
            var editWindow = GetRadWindowManager().open(null, null, divinsert, 1200, 200);//; 10, 10);
            editWindow.center();
     
    //alert(document.getElementById("CodaEdit1").children[0].textContent); <-- finds the text content
     
     
            var re = $find('<%= FindMe.ClientID %>');
            re.set_value("#gfdgdfgsd");
             
     
        }
     
        function windowLayout(gridSender)
        {
            var layoutType = gridSender.get_id();
            return layoutType.charAt(layoutType.length - 1);
             
        }
     
        function rowInfo(aTableView)
        {
            var selectedItems = aTableView.get_selectedItems();
            var row = selectedItems[0];
             
            var columns = aTableView.get_columns();
            var resultArray = [];
            for (var i = 0; i < columns.length; i++)
            {
                var category = columns[i].get_uniqueName();
                var cellValue = $(row.get_cell(category)).text();
     
                resultArray.push(cellValue);
            }
            return resultArray;
        }
    </script>

     

    <telerik:RadGrid ID="RadGrid1"
            runat="server"
            AllowPaging="True"
            AllowSorting="True"
            DataSourceID="​blablablawooo"
            GroupPanelPosition="Top"
            ShowGroupPanel="True"
            EnableLinqExpressions="False"
            AllowFilteringByColumn="True"
            OnInit="RadGrid1_Init"
            OnItemCommand="RadGrid1_ItemCommand"
            OnPreRender="RadGrid1_PreRender"
            Height="600px">
            <ClientSettings AllowDragToGroup="True" AllowColumnsReorder="True" EnableRowHoverStyle="True">
                <Selecting AllowRowSelect="True" />
                <Scrolling AllowScroll="True" EnableVirtualScrollPaging="True" />
                <Resizing AllowColumnResize="True" />
                <ClientEvents OnFilterMenuShowing="filterMenuShowing" OnRowDblClick="editKey"/>
            </ClientSettings>

            <MasterTableView AutoGenerateColumns="False" DataKeyNames="RULE_ID" DataSourceID="its a secret yo">
                <Columns>
                    <telerik:GridBoundColumn AllowFiltering="False" DataField="RULE_ID" DataType="System.Decimal" FilterControlAltText="Filter RULE_ID column" HeaderText="RULE ID" ReadOnly="True" SortExpression="RULE_ID" UniqueName="RULE_ID">
                    </telerik:GridBoundColumn>

    etcetc...​

  2. Óttar
    Óttar avatar
    5 posts
    Member since:
    Jul 2015

    Posted 12 Aug 2015 Link to this post

    Found it, it seems like opening rad window with some div element, the markup HTML will mark it as span. The only thing I had to do (to access the information both server and client side) was to dig through the console and look at the infrastructure.

    function addCustomTelerikInput(div, arrayValue)
        {
            var inputForm = document.getElementById(div);
            var n = inputForm.children.length;
            var input;
            // Loop up to (children - 1) since the last child of the input form is the div for the buttons
            for(var i = 0; i < n-1;i++)
            {
                input = arrayValue[i];
                document.getElementById(div).children[i].lastChild.setAttribute("value",
                    "{'enabled':true,'emptyMessage':'','validationText': '" + input + "' ,'valueAsString':'" + input + "','lastSetTextBoxValue':'" + input + "'}"
                    );
                document.getElementById(div).children[i].children[1].firstChild.setAttribute("value", input);
            }
        }

     

    Some hack, but it works

  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top