Call a local procedure from click of a button using ajax.

progdev1

Member
Hi folks,
Sorry if this is a stupid question. I have a Sales Report program that displays sales information to web screen in webspeed. This query on the database is run on the server side. The results are stored in a temp table and are passed from server side to web browser.

I have to do an output to excel option now. Currently I get the data, display the data to screen and then run the output-to-excel procedure when the form loads. I would prefer not to have to this as generating the excel file as the form loads slows the response time to users. Given I have the data I would like to run the output to csv file only when the users click the excel button and without having to refresh the screen.

So basically when I do the onclick of the excel button that I could use ajax to run the output-to-excel procedure locally at the front end. I was wondering if anyone has any simple examples or could point me in the right direction of how I can run a local progress procedure using ajax. I just want to see a) if it is possible and b) if it is worth the time and effort of doing this. I have checked the forum and while I have seen similar threads on ajax and webspeed there are no examples of how to do this with ajax that I could find.

If ye need any code to explain this let me know. If anyone could assist me I'd be very greatful. Thank.
 

Cecil

19+ years progress programming and still learning.
Simple Question. Does the EXCEL file generated have to be in an excel format or can it be CSV file?

A quick and dirty way of generating a formatted excel document is the create a html document with the extension .xls.

Under Excel 2010 you do get a warning message but the end result is pretty good.:biggrin: Depending on how long the report takes to generate could determine how you generate the dummy excel document. There may be no need to use AJAX.

html_table_in_excel_warning.PNG
html_table_in_excel.gif

Code:
<TABLE border>
         <CAPTION align="top">
            A more complex table-within-a table.
         </CAPTION>
         <TR>
            <TH>
               Outer Table
            </TH>
            <TD>
               <TABLE border>
                  <CAPTION align="top">
                     An inner table showing a variety of headings
                     and data items.
                  </CAPTION>
                  <TR>
                     <TH colspan="5">
                        Inner Table
                     </TH>
                  </TR>
                  <TR>
                     <TH rowspan="2" colspan="2">
                        CORNER
                     </TH>
                     <TH colspan="3">
                        Head1
                     </TH>
                  </TR>
                  <TR>
                     <TH rowspan="2">
                        Head2
                     </TH>
                     <TH colspan="2">
                        Head3
                     </TH>
                  </TR>
                  <TR>
                     <TH>
                        Head4
                     </TH>
                     <TH>
                        Head5
                     </TH>
                     <TH>
                        Head6
                     </TH>
                  </TR>
                  <TR>
                     <TD>
                        A
                     </TD>
                     <TD rowspan="2" valign="middle" bgcolor=
                     "yellow">
                        Two Tall
                     </TD>
                     <TD bgcolor="green">
                        <UL>
                           <LI>
                              Lists can be table data
                           </LI>
                           <LI>
                              Images can be table data
                           </LI>
                        </UL>
                     </TD>
                     <TD colspan="2" align="center">
                        Two Wide
                     </TD>
                  </TR>
                  <TR valign="middle">
                     <TD>
                        <IMG src="../images/icon.gif" alt=
                        "HTML Station"> 
                     </TD>
                     <TD align="center">
                        A <A href="form.html">Form</A> in a table: 
                        <FORM Method="POST" Action= "http://www.december.com/cgi-bin/formmail.secure.cgi">
                           <INPUT type="hidden" name="recipient"
                           value="nobody@december.com"><INPUT type=
                           "hidden" name="subject" value=
                           "Table Example"> Your age: <INPUT type=
                           "text" name="user-age" size="2"><BR>
                            What is your favorite ice cream?<BR>
                            <SELECT name="favorite-icecream">
                              <OPTION>
                                 Vanilla
                              </OPTION>
                              <OPTION selected>
                                 Chocolate
                              </OPTION>
                              <OPTION>
                                 Cherry Garcia
                              </OPTION>
                              <OPTION>
                                 Pizza Pancake
                              </OPTION>
                              <OPTION>
                                 None of the above!
                              </OPTION>
                           </SELECT><BR>
                            <INPUT type="submit" value="OK"> <INPUT
                           type="reset" value="Cancel">
                        </FORM>
                     </TD>
                     <TD>
                        <TABLE>
                           <CAPTION>
                              No border
                           </CAPTION>
                           <TR>
                              <TH>
                                 Little
                              </TH>
                           </TR>
                           <TR>
                              <TD>
                                 Table
                              </TD>
                           </TR>
                        </TABLE>
                     </TD>
                     <TD>
                        Multiple<BR>
                         line<BR>
                         item
                     </TD>
                  </TR>
               </TABLE>
            </TD>
         </TR>
      </TABLE>
 

progdev1

Member
Sorry I probably should have made it clear when I said Excel I meant CSV. Thanks for your reply I'll take a look.
 

Cecil

19+ years progress programming and still learning.
Generating a CSV file is even easier to create. Is your temp-table static or dynamic? I can create a very simple program to spit out a csv by passing a temp-table handle.

Just looking at the original question. What do you mean you pass the temp-table to the browser? Are you using the JSON Writer method for Temp-tables & datasets?
 

progdev1

Member
Thanks for your replies however maybe I'm not being clear, let me try and explain. I know creating the csv file is easy. I already can generate the excel file, that is not what the issue is. To give you an idea of what I'm trying to do, currently the way the program is structured is as follows.

Main-block
RUN GetSalesData IN SalesHandle(input-output tt-sales).
RUN process-web-request.
RUN generate-excel.
end.
proecedure generate-excel:
output to "sales.csv".
....
output close.
end procedure.

proecedure process-web-request:
....
{&OUT} '<input type="button" value="Excel" onClick="location.href=''setservice.w?function-id=ExcelViewer.w?sales.csv~;'' ">~n'.
.....
end procedure.

What I would like to do using excel is to not run generate-excel until the Excel button is clicked, because this delays the time that the screen is displayed to the user, also bear in mind that the user may not want a excel report. I also would prefer not to have to refresh the screen to run the report. What I'd like to do is something like illustrated below.
Main-block:
RUN GetSalesData IN SalesHandle(input-output tt-sales).
RUN process-web-request.
end.

proecedure process-web-request:
....
{&OUT} '<input type="button" value="Excel" onClick="run generate-excel~; location.href=''setservice.w?function-id=ExcelViewer.w?sales.csv''~;">~n'. .....
end procedure.

proecedure generate-excel:
output to "sales.csv".
....
output close.
end procedure.

However I realise this is not possible using javascript and html. I read somewhere on this forum that it is possible using ajax with webspeed. but I couldn't find any examples. I was hoping someone could point me in the right direction. I hope this is clearer. I haven't had a chance to read your links, but I will do so later on and perhaps that will help. Thanks for your replies.
 
Top