How to run Freemarker code on click?

In the below link, GrazittiI mentions a method for doing this, but i'm not sure how/if it applies:

http://community.lithium.com/t5/Developers-Discussion/Call-Endpoint-from-Custom-Component/m-p/159554#M6337

DougS / JasonL ?

Thanks in advance, as I know this is probably pretty basic, but seems tricky! All the examples in the documentation are quite complex, and this endpoint has a very simple function: execute freemarker on click. 

Cheers,

Alan

hi iftomkins 

one suggestion is:

• write an endpoint, something like this:

• <#if user.registered>
  ...
      <#assign ideas_terms_accepted= http.request.parameters.name.get("ideas_terms_accepted", "false") />
          <#if ideas_terms_accepted?? >
          ${rest("/users/self/profiles/name/ideas_terms_accepted/set?value=${ideas_terms_accepted}")}
      </#if>
  
  ...
    
  </#if> 

• in studio, you will see  a preview of your endpoint directly below, mouseover to get the url of your endpoint
• write a custom component that invokes the endpoint
• you can use a standard HTML form or AJAX call, which ever is preferred
• standard form is something like this:

• <form action="/<<relative url to your endpoint>>" method="post">
    Click here to accept ideas terms:<input type="checkbox" name="ideas_terms_accepted" value="true" checked>I accept ideas term<br/> 
    <input type="submit" value="Submit">
  </form> 

• the ajax will be similar to the link you provide, just change url to your endpoint
• add the above custom component to appropriate page quilt

Hopefully that clarifies, otherwise probably best to reach out to your local Services team (via Sales or Support)

Thank you, JasonL ! Seems to work. My only question is how to redirect the user back to the page they were on when they clicked "Submit"? I'm stumped at the actual redirect part.

I know I can add a return url parameter (?return=http://fitbit.com), and capture it like this:

<#assign returnUrl = http.request.parameters.name.get("return","") />

However, how do I redirect users back from the Endpoint? After the form submission I end up on a blank page (screenshot attached). I tried to implement a redirect, but the freemarker ones can be only used on the page initialization page: 

${http.response.setRedirectUrl("http://returnwebsite.com")}.

Thanks!

hi iftomkins 

From what i understood, only the Services team via backend java endpoint is able to do the redirect (but that will require a Services engagement)

If it's studio endpoint, i'm afraid you have to use javascript. Possibilities include:

• client-side ajax form post to endpoint (and upon success, do client-side window.location("/") to redirect)
• or add javascript to your endpoint that does client-side window.location("/") on load

Thanks, JasonL ! I tried add Javascript to the endpoint, but it wasn't being evaluated and instead output as text. So I went with your first suggestion, posting with ajax from the custom component, but I'm still getting an error.

This is the custom component code, with Ajax POST submit:

Click here to accept ideas terms: I accept ideas term

<@liaAddScript>
;(function($) {

$("form#ideasForm").on("submit",function(e){
    var postData = $(this).serializeArray();
    var formURL = $(this).attr("action");
    console.log('got here 1');
    console.log(postData);
    console.log(formURL);
    e.preventDefault();
    $.ajax({
        url : formURL,
        type: "POST",
        data&colon; postData,
        success:function(data, textStatus, jqXHR) 
        {
         console.log('got here 2');
         window.location('http://website.com');
        },
        error: function(jqXHR, textStatus, errorThrown) 
        {
        console.log('got here 3', errorThrown);   
        }
    });
    e.preventDefault(); //STOP default action

});
//$("form#ideasForm").submit(); //Submit  the FORM
})(LITHIUM.jQuery);

Here is the Endpoint code:

<#if user.registered>
    <#assign ideas_terms_accepted = http.request.parameters.name.get("ideas_terms_accepted", "false") />
        <#if ideas_terms_accepted?? >
        ${rest("/users/self/profiles/name/ideas_terms_accepted/set?value=${ideas_terms_accepted}")}
    
 

Error received: ""Unexpected end of input". I think it's because the endpoint doesn't like the way the data is being passed to it. How does the endpoint want the data passed?

quite possibly the endpoint is not returning any data

try changing your endpoint to return something (can be anything - eg. json/html/xml with success indicator etc)

Hi JasonL ,

You mentioned returning data with a "success indicator". My apologies, as I'm not sure how to do that, and couldn't find an example in the developer community. I tried return something anyway, but still got an error.

The weird thing is that even though the response from the server is an error, the POST is successful, because the value is being updated in the database. SO, I am able to put the Javascript redirect in the Ajax error callback, since it does POST successfully. It works ok, but it seems kind of messy. :(

When returning nothing:

"Unexpected end of input"

When returning something (<#return "test"?json_string />) I receive:

"Internal Server Error" 

In summary, the POST is working, but still throwing errors. Here's a screenshot of the Internal Server Error: 

https://www.dropbox.com/s/dcz2jre6qyoxroe/Screenshot%202015-03-18%2016.24.04.png?dl=0

Thanks, JasonL ! That did the trick. Now the endpoint is both properly setting custom field value passed from the custom component, and not returning an error when the ajax runs. Thanks for coaching me through this!