8 Replies Latest reply: Apr 16, 2012 5:05 AM by jariola RSS

    Insert value of a column from report into a page item with JavaScript?

    920172
      I have a regular report. It holds only one column, and each row is clickable (as if it's a link). Upon clicking a row, a modal popup shows up (made by the use of JavaScript).

      What I want is that when I click on a row, the value of the row I selected is inserted into a page item. I want to use JavaScript so that I can do this dynamically, without refreshing the page.

      So, if that column name is #TEMPLATEID#, then I want a page item (let's say P24_TEMPID) to get the value of that certain selected row's templateid.
      The function to open the modal is named openForm, I'd like to be able to write the code for inserting the value into the page item to be in this same function.

      How do I write this in JavaScript?
        • 1. Re: Insert value of a column from report into a page item with JavaScript?
          jariola
          Hi,

          Use $s function
          http://docs.oracle.com/cd/E23903_01/doc/doc.41/e21676/javascript_api.htm#CHDFBJGD

          Regards,
          Jari

          -----
          http://dbswh.webhop.net/dbswh/f?p=BLOG:HOME:0
          • 2. Re: Insert value of a column from report into a page item with JavaScript?
            920172
            Hello,

            I tried doing what you said by writing this code in my openForm() function, a function that opens the popup. The values of the items are set right before the form opens, but instead of column values, it just simply displays "#FOODTEMPLATEID#" as a name, no value, just the exact same word I put in those quotes gets displayed...
            function openForm()
            {
            $s('P24_TEMPLATEID','#FOODTEMPLATEID#');
            $s('P24_MEALID','#MEALTYPEID#');
            
                $('#ModalForm').dialog('open');
            }
            The item P24_TEMPLATEID is a display only item, source type is item (application or page item name).
            Same rules apply for P24_MEALID.

            Please, correct me where I'm wrong. I feel like I'm almost there, it just needs to get the row value...

            -----------
            Extra info
            These two do not work:
             $x('P24_TEMPLATEID').value = '#FOODTEMPLATEID#'; 
             document.getElementById('P24_TEMPLATEID').value = '#FOODTEMPLATEID#'; 
            • 3. Re: Insert value of a column from report into a page item with JavaScript?
              jariola
              Hi,

              I think you need pass those column values as parameter to your JavaScript function.
              Please create example about problem to apex.oracle.com

              Regards,
              Jari

              -----
              My Blog: http://dbswh.webhop.net/dbswh/f?p=BLOG:HOME:0
              Twitter: http://www.twitter.com/jariolai
              • 4. Re: Insert value of a column from report into a page item with JavaScript?
                Mindmap
                Hi,
                Sorry to interfere.
                You should not use quotations around the column name...
                function openForm()
                {
                $s('P24_TEMPLATEID',#FOODTEMPLATEID#);
                $s('P24_MEALID',#MEALTYPEID#);
                 
                    $('#ModalForm').dialog('open');
                }
                FYI:
                http://jholoman.wordpress.com/2012/02/26/apex-4-1-page-items-to-submit/

                * However, I could not apply that example..
                Can you please check for me..

                http://apex.oracle.com/pls/apex
                workspace: somefeto
                user: dev
                password: dev
                application : HR
                page: 1

                Regards,
                Fateh

                Edited by: Fateh on Apr 16, 2012 12:36 AM
                • 5. Re: Insert value of a column from report into a page item with JavaScript?
                  920172
                  To see my application, please go to http://apex.oracle.com/pls/apex/f?p=9949:101:0::NO:::

                  Login details
                  Username: visitor
                  Password: visitor

                  In the tab menu, click on "Web Platform", then from the 2nd tab menu, click on "Meals and templates". From here, use the menu on the left and click on "Show templates".

                  You will see the report, with clickable links. Upon clicking, a popup opens. Close it, and then you'll see that my "display only"- items have a value. One is still using the old code, the other just says "undefined".

                  My JavaScript code is now the following:
                  function openForm(pTemplateId)
                  {
                  var tempid = pTemplateId;
                  $s('P24_TEMPLATEID', pTemplateId);
                  $s('P24_MEALID', '#MEALTYPEID#');
                  $('#ModalForm').dialog('open');
                  }
                  In the report, the column named "Template Name" (in the database it's called FOODTEMPLATENAME) has the following column link:
                  javascript:openForm(#FOODTEMPLATEID#);
                  When hovering over the link, you can see in t he bottom bar of your browser that it holds either 2 or 8 as a value. Yet it does not pass the value. Any ideas?


                  @Fateh: putting no quotes around the column names will result in a JavaScript code that does not execute. So that's not a solution. The link you gave me may seem handy, but it seems to me that it's just too much work for such a simple task. I'm feeling that I'm missing a small thing, I'm overlooking something... Problem is I don't know what. :(

                  Edit: I did write a var, but I don't think that one's necessary... Is it? Any case, doesn't work with using either tempid or pTemplateId..
                  • 6. Re: Insert value of a column from report into a page item with JavaScript?
                    jariola
                    Hi,

                    You can not use column substitution #MEALTYPEID# in page header JavaScript. How APEX would know witch row value that is?
                    Pass both column values as parameter
                    JavaScript in page HTML header
                    function openForm(pTemplateId,pMealTypeId){
                     $s('P24_TEMPLATEID', pTemplateId);
                     $s('P24_MEALID', pMealTypeId);
                     $('#ModalForm').dialog('open');
                    } 
                    Call JavaScript like
                    javascript:openform('#FOODTEMPLATEID#','#MEALTYPEID#');
                    Regards,
                    Jari

                    -----
                    My Blog: http://dbswh.webhop.net/dbswh/f?p=BLOG:HOME:0
                    Twitter: http://www.twitter.com/jariolai
                    • 7. Re: Insert value of a column from report into a page item with JavaScript?
                      920172
                      Thank you!

                      Didn't had it in single quotes when I called it in the URL.
                      Works now. ;)

                      Only thing I'm still stuck at is why the popup doesn't display any results. The item values are set, the SQL code for calling the food items related to the template should work as well (I checked that in the SQL Command)...
                      Anyway, thanks already for your help. :)
                      • 8. Re: Insert value of a column from report into a page item with JavaScript?
                        jariola
                        Hi,

                        You need set items value to session state.
                        http://docs.oracle.com/cd/E23903_01/doc/doc.41/e21674/concept_ses_val.htm#sthref124

                        Currently you set value just to HTML document (client). For report value need to be in session state (database)

                        Regards,
                        Jari

                        -----
                        My Blog: http://dbswh.webhop.net/dbswh/f?p=BLOG:HOME:0
                        Twitter: http://www.twitter.com/jariolai