Alpha Video Training
Results 1 to 13 of 13

Thread: Ajax Callback from Client Side Grid System Event

  1. #1
    "Certified" Alphaholic kingcarol's Avatar
    Real Name
    Carol King
    Join Date
    Jun 2010
    Posts
    1,531

    Default Ajax Callback from Client Side Grid System Event

    I am trying to do an Ajax Callback in Client Side Grid System Events using the afterRowSubmit event.
    My Xbasic function that I'm trying to call is named InsertAuditRecordAfterRowSubmitChange.

    The code I placed in the afterRowSubmit system event is causing the following script errors:

    Error: Expected ':'
    Error: 'GRID1_GridObj' is undefined

    Here's the code. What do I need to change?
    Code:
    {grid.Object}.ajaxCallback('G',{Grid.RowNumber},'InsertAuditRecordAfterRowSubmitChange','','');
    BTW, here it is in the Xbasic definition of the grid:
    Code:
    tmpl.gridEvents.javascript.afterRowSubmit = <<%txt%
    {grid.Object}.ajaxCallback('G',{Grid.RowNumber},'InsertAuditRecordAfterRowSubmitChange','','');
    %txt%
    Last edited by kingcarol; 08-27-2010 at 12:18 PM.
    Carol King
    Developer of Custom Homebuilders' Solutions (CHS)
    http://www.CHSBuilderSoftware.com

  2. #2
    Alpha Software Employee Selwyn Rabins's Avatar
    Real Name
    Selwyn Rabins
    Join Date
    Mar 2000
    Location
    Boston, MA
    Posts
    5,306

    Default Re: Ajax Callback from Client Side Grid System Event

    Quote Originally Posted by kingcarol View Post
    I am trying to do an Ajax Callback in Client Side Grid System Events using the afterRowSubmit event.
    My Xbasic function that I'm trying to call is named InsertAuditRecordAfterRowSubmitChange.

    The code I placed in the afterRowSubmit system event is causing the following script errors:

    Error: Expected ':'
    Error: 'GRID1_GridObj' is undefined

    Here's the code. What do I need to change?
    Code:
    {grid.Object}.ajaxCallback('G',{Grid.RowNumber},'InsertAuditRecordAfterRowSubmitChange','','');
    BTW, here it is in the Xbasic definition of the grid:
    Code:
    tmpl.gridEvents.javascript.afterRowSubmit = <<%txt%
    {grid.Object}.ajaxCallback('G',{Grid.RowNumber},'InsertAuditRecordAfterRowSubmitChange','','');
    %txt%

    the code that you have in the afterRowSubmit event has the {grid.rownumber} placeholder.

    this placeholder is meaningless in this context. so it is not replaced.

    therefore the javascript that the browser is trying to execute still has the {grid.rownumber} placeholder in it, and that causes an error because javascript thinks that anything in curly brackets is a JSON object and clearly 'grid.rowNumber' is not a JSON object.

    the {grid.rowNumber} placeholder is ONLY meaningful in the context of javascript that you place in a control in a grid row. it will be replaced at runtime with the actual grid row number.

    so if you really wanted to do an ajax callback in the afterRowSubmit event you would have to hard code the row number.

    the more fundamental question is why are you trying to do an ajax callback in the afterRowSubmit event?

    to me, it does not make sense.

    here is the sequence of things that happen:

    1. user makes an edit to some fields in the grid.
    2. user submits changes
    3. the data in the browser gets submitted to the server.
    4. activity now moves to the server side and server side events now fire. canUpdate and canInsert, afterUpdate and afterInsert server side events fire.
    5. after the server side work has completed an ajax response is sent to the browser.
    6. on the browser, if the afterRowSubmit event was defined, it fires.
    7. the code you have put into the afterRowSubmit tries to do an ajax callback. but you have just come from the server! so why do you need to do an ajax callback. why did you not just put the server side code that you want to execute in the afterUpdate or afterInsert server side events in the first place?

  3. #3
    Volunteer Moderator Peter.Greulich's Avatar
    Real Name
    Peter Greulich
    Join Date
    Apr 2000
    Location
    Boston, MA
    Posts
    11,649

    Default Re: Ajax Callback from Client Side Grid System Event

    Quote Originally Posted by Selwyn Rabins View Post
    here is the sequence of things that happen:

    1. user makes an edit to some fields in the grid.
    2. user submits changes
    3. the data in the browser gets submitted to the server.
    4. activity now moves to the server side and server side events now fire. canUpdate and canInsert, afterUpdate and afterInsert server side events fire.
    5. after the server side work has completed an ajax response is sent to the browser.
    6. on the browser, if the afterRowSubmit event was defined, it fires.
    7. the code you have put into the afterRowSubmit tries to do an ajax callback. but you have just come from the server! so why do you need to do an ajax callback. why did you not just put the server side code that you want to execute in the afterUpdate or afterInsert server side events in the first place?
    That is a wonderfully clear explanation of what happens when a user submits data in a grid. It becomes so obvious when you step through it like that. Very helpful!

  4. #4
    "Certified" Alphaholic kingcarol's Avatar
    Real Name
    Carol King
    Join Date
    Jun 2010
    Posts
    1,531

    Default Re: Ajax Callback from Client Side Grid System Event

    Yep, helps me understand a bit more about what types of events do what.

    SO, now I've tried to use the AfterUpdateRecord and can't get it to do anything. I've tried 2 things:

    1 - If I put in the one line Ajax Callback code shown below, it tells me I have extra characters at end of expression. That's this one.

    Code:
    {grid.Object}.ajaxCallback('G',{Grid.RowNumber},'InsertAuditRecordAfterRowSubmitChange','','');
    2 - If I put all the code shown below into the AfterUpdateRecord function, it doesn't do anything at all after submitting the changes. (ie, no errors, AND record does not append to my audit table). However, the code below DOES work if I test it using an AjaxCallback from a button.

    NOTE, I use RowOnDemand for submitting, if that makes any difference.

    BTW, I tried the code below without opening and closing a connection string in the AfterUpdateRecord function because I figured the connection was already open and wanted to eliminate that as a cause for the problem. However, it still didn't do anything after I submitted a change on the row. The code below is what I have for the Ajax Callback on the button right now. I want to remove the button and have this happen automatically. Just need to know where to put the code.

    Code:
    function InsertAuditRecordAfterRowSubmitChange as c (e as p)
    ''Insert Audit record about change to Cost Type records.
    ''DIM a connection variable
    dim cn as sql::connection
    dim cs as c 
    
    'get the connection string that is defined in this Grid component
    cs = e.tmpl.cs.connectionString	
    
    'We must first dim a variable named flag as 1 in order to get true (.t.) or false (.f.) results from the callback to the server.
    'ie, if callback fails, then result is .f., if callback is successful, then result is .t.
    dim flag as l
    
    'open the connection to the back end database that is defined in the connection string for this grid component
    'with a flag to let us know if connection failed or not.  A javascript alert box is used to let us know if the connection failed. 
    flag = cn.open(cs)
    if flag = .f. then 
    	dim msg as c 
    	msg = "Could not connect to database. Error reported was: " + cn.CallResult.text
    	'SELWYN NOTES:  we need to encode this for javascript since the javascript alert box message will be sent back to the browser for display
    	'js_escape() encodes ' as \' and crlf as \n
    	msg = js_escape(msg)
    	dim jscmd as c 
    	jscmd = "alert('" + msg + "');"
    	InsertAuditRecordAfterRowSubmitChange = jscmd
    	exit function 
    end if 
    
    'Specify that we are using Portable SQL syntax
    cn.PortableSQLEnabled = .t.
    
    'Dim a SQL arguments object, create arguments and set their values
    DIM args as sql::arguments
    
    args.add("GL_JOURNAL","NONE") 
    args.add("GL_DATE",convert_type(a5_eval_expression("=Date()",local_variables()),"T"))
    args.add("GL_DESCRIPTION","User changed Cost Type data ")
    args.add("GL_MAIN_ACCT_NUM","0")
    if a5_eval_valid_expression("=e._currentRowDataOld.PROD_CODE",local_variables()) then 
    	args.add("AP_PRODUCT_ID",convert_type(a5_eval_expression("=e._currentRowDataOld.PROD_CODE",local_variables()),"C"))
    end If
    if a5_eval_valid_expression("=\"User submitted changes to cost type \"+e._currentRowDataOld.PROD_CODE",local_variables()) then 
    	args.add("GL_ENTRY_NOTES",convert_type(a5_eval_expression("=\"User submitted changes to cost type \"+e._currentRowDataOld.PROD_CODE",local_variables()),"M"))
    end If 
    args.add("AUDIT_DATE",convert_type(a5_eval_expression("=Now()",local_variables()),"T")) 
    args.add("USER_NAME","Alpha Test")
    
    
    dim sqlInsertChangeToAudit as c 
    sqlInsertChangeToAudit = <<%sqlaudittxt%
    INSERT INTO TblGLAudit  (GL_JOURNAL, GL_DATE, GL_DESCRIPTION, GL_MAIN_ACCT_NUM, AP_PRODUCT_ID, GL_ENTRY_NOTES, AUDIT_DATE, USER_NAME) VALUES (:GL_JOURNAL, :GL_DATE, :GL_DESCRIPTION, :GL_MAIN_ACCT_NUM, :AP_PRODUCT_ID, :GL_ENTRY_NOTES, :AUDIT_DATE, :USER_NAME)
    %sqlaudittxt%
    
    dim flag as l 
    flag = cn.Execute(sqlInsertChangeToAudit,args)
    
    'if audit append query could not execute, give the user a message and exit the function.
    	if flag = .f. then 
    		'there was an error - close the connection and exit
    		cn.Close()
    		dim msg as c 
    		msg = "Could not append audit record about the change. Please contact your program administrator for help.  Error reported was: " + cn.CallResult.text
    		msg = js_escape(msg)
    		dim jscmd as c 
    		jscmd = "alert('" + msg + "');"
    		InsertAuditRecordAfterRowSubmitChange = jscmd
    		exit function 
    	end if
    	
    cn.Close()
    	
    end function
    Carol King
    Developer of Custom Homebuilders' Solutions (CHS)
    http://www.CHSBuilderSoftware.com

  5. #5
    Alpha Software Employee Selwyn Rabins's Avatar
    Real Name
    Selwyn Rabins
    Join Date
    Mar 2000
    Location
    Boston, MA
    Posts
    5,306

    Default Re: Ajax Callback from Client Side Grid System Event

    Quote Originally Posted by kingcarol View Post
    Yep, helps me understand a bit more about what types of events do what.

    SO, now I've tried to use the AfterUpdateRecord and can't get it to do anything. I've tried 2 things:

    1 - If I put in the one line Ajax Callback code shown below, it tells me I have extra characters at end of expression. That's this one.

    Code:
    {grid.Object}.ajaxCallback('G',{Grid.RowNumber},'InsertAuditRecordAfterRowSubmitChange','','');
    2 - If I put all the code shown below into the AfterUpdateRecord function, it doesn't do anything at all after submitting the changes. (ie, no errors, AND record does not append to my audit table). However, the code below DOES work if I test it using an AjaxCallback from a button.

    NOTE, I use RowOnDemand for submitting, if that makes any difference.

    BTW, I tried the code below without opening and closing a connection string in the AfterUpdateRecord function because I figured the connection was already open and wanted to eliminate that as a cause for the problem. However, it still didn't do anything after I submitted a change on the row. The code below is what I have for the Ajax Callback on the button right now. I want to remove the button and have this happen automatically. Just need to know where to put the code.

    Code:
    function InsertAuditRecordAfterRowSubmitChange as c (e as p)
    ''Insert Audit record about change to Cost Type records.
    ''DIM a connection variable
    dim cn as sql::connection
    dim cs as c 
    
    'get the connection string that is defined in this Grid component
    cs = e.tmpl.cs.connectionString	
    
    'We must first dim a variable named flag as 1 in order to get true (.t.) or false (.f.) results from the callback to the server.
    'ie, if callback fails, then result is .f., if callback is successful, then result is .t.
    dim flag as l
    
    'open the connection to the back end database that is defined in the connection string for this grid component
    'with a flag to let us know if connection failed or not.  A javascript alert box is used to let us know if the connection failed. 
    flag = cn.open(cs)
    if flag = .f. then 
    	dim msg as c 
    	msg = "Could not connect to database. Error reported was: " + cn.CallResult.text
    	'SELWYN NOTES:  we need to encode this for javascript since the javascript alert box message will be sent back to the browser for display
    	'js_escape() encodes ' as \' and crlf as \n
    	msg = js_escape(msg)
    	dim jscmd as c 
    	jscmd = "alert('" + msg + "');"
    	InsertAuditRecordAfterRowSubmitChange = jscmd
    	exit function 
    end if 
    
    'Specify that we are using Portable SQL syntax
    cn.PortableSQLEnabled = .t.
    
    'Dim a SQL arguments object, create arguments and set their values
    DIM args as sql::arguments
    
    args.add("GL_JOURNAL","NONE") 
    args.add("GL_DATE",convert_type(a5_eval_expression("=Date()",local_variables()),"T"))
    args.add("GL_DESCRIPTION","User changed Cost Type data ")
    args.add("GL_MAIN_ACCT_NUM","0")
    if a5_eval_valid_expression("=e._currentRowDataOld.PROD_CODE",local_variables()) then 
    	args.add("AP_PRODUCT_ID",convert_type(a5_eval_expression("=e._currentRowDataOld.PROD_CODE",local_variables()),"C"))
    end If
    if a5_eval_valid_expression("=\"User submitted changes to cost type \"+e._currentRowDataOld.PROD_CODE",local_variables()) then 
    	args.add("GL_ENTRY_NOTES",convert_type(a5_eval_expression("=\"User submitted changes to cost type \"+e._currentRowDataOld.PROD_CODE",local_variables()),"M"))
    end If 
    args.add("AUDIT_DATE",convert_type(a5_eval_expression("=Now()",local_variables()),"T")) 
    args.add("USER_NAME","Alpha Test")
    
    
    dim sqlInsertChangeToAudit as c 
    sqlInsertChangeToAudit = <<%sqlaudittxt%
    INSERT INTO TblGLAudit  (GL_JOURNAL, GL_DATE, GL_DESCRIPTION, GL_MAIN_ACCT_NUM, AP_PRODUCT_ID, GL_ENTRY_NOTES, AUDIT_DATE, USER_NAME) VALUES (:GL_JOURNAL, :GL_DATE, :GL_DESCRIPTION, :GL_MAIN_ACCT_NUM, :AP_PRODUCT_ID, :GL_ENTRY_NOTES, :AUDIT_DATE, :USER_NAME)
    %sqlaudittxt%
    
    dim flag as l 
    flag = cn.Execute(sqlInsertChangeToAudit,args)
    
    'if audit append query could not execute, give the user a message and exit the function.
    	if flag = .f. then 
    		'there was an error - close the connection and exit
    		cn.Close()
    		dim msg as c 
    		msg = "Could not append audit record about the change. Please contact your program administrator for help.  Error reported was: " + cn.CallResult.text
    		msg = js_escape(msg)
    		dim jscmd as c 
    		jscmd = "alert('" + msg + "');"
    		InsertAuditRecordAfterRowSubmitChange = jscmd
    		exit function 
    	end if
    	
    cn.Close()
    	
    end function

    carol

    afterUpdateRecord is a server side event - that means it executes xbasic code.

    the code that you have show here is javascript:

    {grid.Object}.ajaxCallback('G',{Grid.RowNumber},'InsertAuditRecordAfterRowSubmitChange','','');

    you can't put javascript in a server side event.

    you have apparently defined an xbasic function called:

    InsertAuditRecordAfterRowSubmitChange()

    you can call this function directly in your afterUpdateRecords server side event.

  6. #6
    "Certified" Alphaholic kingcarol's Avatar
    Real Name
    Carol King
    Join Date
    Jun 2010
    Posts
    1,531

    Default Re: Ajax Callback from Client Side Grid System Event

    I do think I'm grasping client side and server side... my main problem is distinguishing which events happen server side and which happen client side.

    So, how do you simply call a function while on the server side?

    I tried this, which, of course, is how I did it in Access and so doesn't work in Alpha:
    Call LookupInChildTablesThenDeleteIfNotFound

    I tried going to the Alphapedia, but it's been down and won't open.
    Carol King
    Developer of Custom Homebuilders' Solutions (CHS)
    http://www.CHSBuilderSoftware.com

  7. #7
    Alpha Software Employee Selwyn Rabins's Avatar
    Real Name
    Selwyn Rabins
    Join Date
    Mar 2000
    Location
    Boston, MA
    Posts
    5,306

    Default Re: Ajax Callback from Client Side Grid System Event

    Quote Originally Posted by kingcarol View Post
    I do think I'm grasping client side and server side... my main problem is distinguishing which events happen server side and which happen client side.

    So, how do you simply call a function while on the server side?

    I tried this, which, of course, is how I did it in Access and so doesn't work in Alpha:
    Call LookupInChildTablesThenDeleteIfNotFound

    I tried going to the Alphapedia, but it's been down and won't open.
    please watch the video. hopefully it explains it.

    http://screencast.com/t/NzE1ZmFmMzM

    calling a user defined xbasic function from a server side event is very easy - easier than Access.

    all of the events listed in the 'Events' section of the Grid builder are serverside.

    all of the events listed in the 'Properties' section, 'Javascript system events' are clientside.

  8. #8
    "Certified" Alphaholic kingcarol's Avatar
    Real Name
    Carol King
    Join Date
    Jun 2010
    Posts
    1,531

    Default Re: Ajax Callback from Client Side Grid System Event

    Well, I'm just too ignorant. Even after watching your video, I have no clue as to what arguments, or parameters, should be passed to call my function that executes an SQL insert query from the AfterUpdateRecord event, or how to type my call to the function at all.

    The function in your video is just changing some text for the last name and so DataSubmitted.last_name (or whatever) makes sense, but it doesn't help me figure out what to type to call my function.

    I wish I could just type:
    InsertAuditRecordAfterRowSubmitChange()

    but, no.... too few parameters.
    Carol King
    Developer of Custom Homebuilders' Solutions (CHS)
    http://www.CHSBuilderSoftware.com

  9. #9
    Alpha Software Employee Selwyn Rabins's Avatar
    Real Name
    Selwyn Rabins
    Join Date
    Mar 2000
    Location
    Boston, MA
    Posts
    5,306

    Default Re: Ajax Callback from Client Side Grid System Event

    Quote Originally Posted by kingcarol View Post
    Well, I'm just too ignorant. Even after watching your video, I have no clue as to what arguments, or parameters, should be passed to call my function that executes an SQL insert query from the AfterUpdateRecord event, or how to type my call to the function at all.

    The function in your video is just changing some text for the last name and so DataSubmitted.last_name (or whatever) makes sense, but it doesn't help me figure out what to type to call my function.

    I wish I could just type:
    InsertAuditRecordAfterRowSubmitChange()

    but, no.... too few parameters.

    i don't understand the point you are tying to make.

    you wrote the function InsertAuditRecordAfterRowSubmitChange().

    you decided what parameters (i.e. arguments) it needed to be called with.

    you specified that the function needs to be called with a parameter of type 'p' (a property object).

    the function that YOU defined is:

    Code:
    function InsertAuditRecordAfterRowSubmitChange as v (e as p)
    ...
    ...
    end function
    so the function needs to be called with an argument of type 'p'

    if you just call the function using this syntax:

    Code:
    InsertAuditRecordAfterRowSubmitChange()
    it will obviously fail because you are not passing in any arguments at all. but the function REQUIRES one argument (of type p) because that's what YOU defined.

    say you had defined your function as:


    Code:
    function InsertAuditRecordAfterRowSubmitChange as v (v1 as c, v2 as n)
    ...
    ...
    end function
    In that case you would have had to pass in two arguments in the function call (the first argument would need to be of type 'c' and the second of type 'n')

    since the AfterUpdateRecord event has the 'e' object passed in to it and since your code seems to be relying on the same properties that 'e' has, you can just pass the same 'e' object that is passed into the AfterUpdateRecord event to your function.

    If you go to the Events tab and look at where you defined the AfterUpdateRecord event, you would do this:



    Code:
    function AfterUpdateRecord as v (e as p)
          InsertAuditRecordAfterRowSubmitChange(e)
    end function

  10. #10
    "Certified" Alphaholic kingcarol's Avatar
    Real Name
    Carol King
    Join Date
    Jun 2010
    Posts
    1,531

    Default Re: Ajax Callback from Client Side Grid System Event

    I had done exactly what you just showed before i posted that last comment. Then when I tried to run it, I started getting errors about e statements being undefined, so I thought I didn't understand. Putting the (e) at end triggers those errors.
    Carol King
    Developer of Custom Homebuilders' Solutions (CHS)
    http://www.CHSBuilderSoftware.com

  11. #11
    Alpha Software Employee Selwyn Rabins's Avatar
    Real Name
    Selwyn Rabins
    Join Date
    Mar 2000
    Location
    Boston, MA
    Posts
    5,306

    Default Re: Ajax Callback from Client Side Grid System Event

    Quote Originally Posted by kingcarol View Post
    I had done exactly what you just showed before i posted that last comment. Then when I tried to run it, I started getting errors about e statements being undefined, so I thought I didn't understand. Putting the (e) at end triggers those errors.
    here is a more in-depth example.

    http://screencast.com/t/MTgwOWU1Mjkt

    i have also attached the component so that you can run it yourself.

    you just need to edit the connection string to point to alphasports.mdb (in your a5v10 program files\mdbfiles folder).

  12. #12
    "Certified" Alphaholic kingcarol's Avatar
    Real Name
    Carol King
    Join Date
    Jun 2010
    Posts
    1,531

    Wink Re: Ajax Callback from Client Side Grid System Event

    OK, working now. What I needed to pay attention to was that different (e) stuff gets passed in from different events. (and, yes I see how you very nicely put that e info there for us. Now I'll better understand what you're trying to tell us there.)

    Now I've used: cs = e.gridDefinition.cs.connectionstring
    Instead of: cs = e.tmpl.cs.connectionString

    to get connection string and that got rid of of the 'not defined' error I was getting.

    Then I used: e.OldDataSubmitted.PROD_CODE
    instead of: e._currentRowDataOld.PROD_CODE

    in my SQL insert definition, and the insert did occur.

    Thanks, Selwyn! once again
    hmmmmmm.... what should I try next?
    Carol King
    Developer of Custom Homebuilders' Solutions (CHS)
    http://www.CHSBuilderSoftware.com

  13. #13
    "Certified" Alphaholic Clipper87's Avatar
    Real Name
    Frank
    Join Date
    Dec 2008
    Location
    Antwerp, Belgium
    Posts
    1,891

    Default Re: Ajax Callback from Client Side Grid System Event

    This is the 125th thread I subscribed to; learning all the time! Great info!

Similar Threads

  1. Use of system datetime in Client Side Enable Expression
    By glenschild in forum Application Server Version 10 - Web/Browser Applications
    Replies: 6
    Last Post: 08-12-2010, 12:16 AM
  2. No Data in Ajax CallBack function on OnChange event for dropdown - Add Records Only
    By workaholic06 in forum Application Server Version 10 - Web/Browser Applications
    Replies: 0
    Last Post: 07-25-2010, 06:02 PM
  3. Ajax Callback grid submit
    By daveh56 in forum Application Server Version 10 - Web/Browser Applications
    Replies: 0
    Last Post: 07-20-2010, 09:52 AM
  4. UDF's on updatable grid client side?
    By eritovs in forum Application Server Version 10 - Web/Browser Applications
    Replies: 0
    Last Post: 06-02-2010, 04:23 AM
  5. client side validation for a grid
    By martin horzempa in forum Web Application Server v6
    Replies: 2
    Last Post: 10-17-2005, 05:01 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •