We Keep Coding

angularJS & web2py: calling python from ng/javascript/html

I'm using AngularJS (mainly the client side) and web2py (mainly the server side)together in an app.
I have an issue now.
At a point of the program, I use AngularJS to get some data from the client and these data are store in an AngularJS variable. I planed to use $http.post to submit these data to database directly, but it didn't work due to cross-orign problem.
Right now I'm trying to pass these data(they are in JSON format) back to web2py and let web2py insert these data to database.(similar to submitting a SQLFORM).
Is there anyway I could pass these data as an argument to an web2py function and invoke that function within javascript code?
Possible approach in my mind:
1) Since I could write python in html using {{}}, and I could write html in javascript, could I write python code within javascript using something like: document.write({{python code}}) ?
I tried this but whatever html I write it goes to a brand new html page. I also tried document.getElementById('testDiv').write("<p></p>"); But it doesn't work.
2)use ajax, I'm not familiar with ajax, any example will be really appreciated!
Any thoughts?
Thank you all!

ok so you got me lost for a second there, lets see if i got it right
1- angular as your frontend
2- python as your backend
3- you are rendering an html document in python and delivering it to the browser
4- since python template language uses {{}} as delimiter am assuming you changed the angulars delimiters too
either using ajax or reload you'll need to provide a python post handler script. that takes your data and makes the DB update. if this is going to be a pattern and you are going to be making AJAX CRUD operations, you should use angular resources ngResource if not a simple
$http.post(url,data).success(function(response){})
https://docs.angularjs.org/api/ng/service/$http#post
where url would be your form submission handler url.
if you where to use a form you'll need to set the target to an iframe hidden in your page and the response should a script tag that gets the scope pertinent to your controller and let him know the result of the operation. this is an old approach, but handy when it comes to send information to sites that don't allow CORS which by the way might be the solution to your problem, when storing data directly to your db, you might just need to enable CORS headers in your storage engine API and that should allow you to submit information even when coming from a different domain

After hours of struggles and countless google, here's my workaround solution:
Main problem: the data are stored in AngularJS but AngulatJS could not submit data to database through API due to cross-orign issue. But Web2py could submit data to database using sqlform.
My approach:
1.)When the user click the submit button, invoke 'ng-click="submitBtn()"'.
submitBtn() is a function of the ng-controller, which has access to the data.
2.)In submitBtn(), the function first write data into web2py's sqlform through
document.getElementById('inputId').value=$scope.data;
then the function click the sqlform submit button through
document.getElementById('submitBtn').click();
It took me a lot time to figure out those element ids of fields in web2py's auto-generated sqlform. The way to find them is using developers' inspect element tool in a browser and see the source code directly.
Hope this will help someone will face the same issue!

Passing the asp classic html as a string from client-side to server-side

I am having the next scenario (I can't change it). I have an classic asp page. In it, I have the asp code, the javascript code, and the VBscript code. When the user clicks the button confirm, the javascript function "confirm" is executed. In it, the page submits a form to itself.
What I want to accomplish is the next thing. Inside that javascript function confirm, I can easily get the web page html as a string. But what I want is to get that string in the VBScript part when the page processes the self-submit done. I have tried the next things:
Inserting in an asp input hidden control in the page, and load from JavaScript the needed string in that input. Afterwards I expected to get it in VBScript by Request("controlId/controlName"). But it fails me because the input hidden control can't have strings that large.
In the JavaScript confirm function, to load in a session variable in the string. But it looks like I can't write a client-side variable in a session variable.
To store through the JavaScript function a temporary file and passing it through a input file control. This I only have thought about it. Because i don't think that it is a good solution to store a temporary file in the client-side, and I still have the believe to find a better solution than this. Also I don't know exactly how to write files with JavaScript in the client-side.
I remember that I have tried all this, if I remember another thing that I tried, I will post it here.
I have slammed my face repeatedly against the desktop, but I can't find a solution to this. Any idea would be really helpful.

But it fails me because the input hidden control can't have strings
that large.
Use method="post" instead of method="get" in the form, and the data size is practically limitless. I.e. the limit changes from a few kilobyte to several megabyte.
But it looks like I can't write a client-side variable in a session
variable.
That is correct. The session variables only exist on the server side.
To store through the javascript function a temporary file and passing
it through a input file control.
That is a process in two steps, where each step in itself is generally impossible. You can't access the local file system using Javascript, and you can't set the file name of an input file control using Javascript.

So you want to get html page in your ASP using javascript?
Why do you want to do that. You can use your a form with a post method to send big string.

Why doesn't embedded JavaScript execute when inserted in response to an ajax call?

Inserting JavaScript in the .innerHTML does not cause it to run.
I have what I call a mini-feed in which a user submits a post. This initiates an ajax call which saves the user data to the mysql table. From there PHP generates the xhtml. From there the the PHP generated xhtml is sent back to javascript as response text. This xhtml contains embedded javascript used to display "pretty time".
Now if the PHP generatd xhtml/javascript is send to the client in a non-ajax way this works. But when I send it as responseText and then update the DOM using .innerHTML it does not function. Whatever mechanism that picks up javacript with in the XHTML does not seem to like the embedded javascript written into the .innerHTML property of the enclosing div tag.
Is there an easy fix for this? Or do I have to construct the UI with in the javascript with out just inserting it all in as innerHTML...in a previous post someone mentioned that .innerHTML was not good practice. Perhaps this is what they meant.

You're right, innerHTML will not do that, if you want to dynamically create a script tag, you will need to use document.createElement to create a script tag, but that has all of the same wonderful security bonuses associated with eval.
Here's another idea, though. Wouldn't it be better to have some function defined in the main page which, after appending anything new, sets the date to "pretty" mode without needing to have the AJAX response know anything about it?

The following code should work:
function onSuccess() {
src = document.createElement('script');
src.innerHTML = this.responseText;
document.body.appendChild(src);
}
But I would agree with cwallenpoole that why not have all that javascript code (for pretty-fying the date) be already written in advanced in the main page? (or script included or something).

Calling Java inside JavaScript Function

Please tell me if we can call java inside javascript function ?
<HTML><HEAD></HEAD><BODY>
<SCRIPT>
function getScreenDimension() {
<% System.out.println("Hiiiiiiiii"); %>
}
</SCRIPT>
<FORM>
<INPUT type="button" value="call Java method direct" onClick = "getScreenDimension()">
</FORM>
</BODY></HTML>

While the answer of "No" is technically correct based on the phrasing of the question. You may want to read up on AJAX. It is a way for javascript to make a request to your backend code (in this case Java).
Javascript is client side, meaning it is run by the user's browser. Java is running on your server. In order for the client side javascript to interact with the backend Java, you need to make a request to the server.

My question to you would be, "What are you trying to do, and what do you expect to see?".
You have to realize that there are two different execution contexts. The first is the JSP itself whose code is executed by the JVM on the server-side, and the second is the Javascript that is executed by the browser. So when the code goes to the browser, you'll see: So the System.out.println will cause Hiiiiiiiii to be printed to the server logs, but you won't see anything on the browser. In fact, the Javascript code on the browser will look like this:
function getScreenDimension() {
}
Which is not valid Javascript code. The code in the JSP is run before the Javascript gets run on the browser. So to "run" Java code, you need to make a request to your server either by posting the form or with an AJAX call. This will cause Java code in the appropriate servlet or controller, to run.
UPDATE
After glancing at your code, it appears that you want to call a Java method directly. This is not possible with your current code. You might want to read up on AJAX. This will point you in the right direction.

JSP runs on the server. It generates a document which the server sends to the browser. That is the end of the involvement of JSP in the process. The browser then parses the document and runs any JS.
You can include JSP in a script element, it just has to output valid JavaScript.
You cannot have JSP that runs in response to JavaScript, other then when JavaScript causes the browser to issue a new HTTP request (either setting location.href, submitting a form, adding an image, or using Ajax, etc)

I think you have lack of understanding of what is going on here. Anything in middle of <% %> is executed when the page is first requested. Anything in javascript is executed when the browser calls it. What you have will never happen and there is no way to make it happen. However, you can use AJAX to do something like this but that's a different question.

Yes, you can. Use JSP expressions <%= %>. Example:
<aui:script use="aui-datepicker">
AUI().use('aui-datepicker', function(A) {
new A.DatePickerSelect({
calendar : {
dates : [ '<%="1/1/1970" %>' ],
}
}).render('#myDatePicker');
});
</aui:script>

Yes, you can call Java from Javascript, both if you mean the Java-VM on the server and on the client; i assume you mean the client (the VM in the browser); take a look here:
http://www.apl.jhu.edu/~hall/java/Java-from-JavaScript.html

You can. In JSF you can use PrimeFaces' component p:remoteCommand, which would contain action method. Call that remoteCommand by its name from JS and the java method will get executed.
JSF Page
<p:remoteCommand name='rmt' action="#{bean.doWork()}"/>
In JavaScript
function callJava {rmt();}

Use JSP code
<%
// Respond to the application with 1) result, 2) update, and 3) updateid values
String result = "blablabla";
out.print(result);
%>

Javascript in HTML and ASP file

Since JavaScript can be written (or contained) within an HTML file or in an ASP file, is there any difference?

ASP runs on the server-side. Any HTML or JavaScript generated by this is simply sent to the browser, which is where the HTML is rendered and JavaScript is executed.

ASP is a server side technology that (usually) outputs an HTML document when executed.
Any JavaScript you write might be part of the HTML document (and thus identical to any JS you might put in a static HTML document) or it might be written as server side code (in which case it will execute on the server, have access to ASP APIs instead of Browser APIs, and will generate output instead of being output).

The marvellous thing about Javascript and server-side programming languages like ASP and PHP is that they can be (sort of) intertwined. So, for example, if you have a server-side variable that you want to be able to mess about with using Javascript, you can include it in the JS when you output the page:
// THIS IS THE ASP CODE
string mystring = "This is my ASP string";
string html = "<script type=\"text/javascript\">var mystring = "+mystring+"</script>";
// then output the html
That's a terrible, badly-coded example, but you hopefully get the idea. You can emit Javascript to the page using ASP variables and the like. It's very handy.

One difference I can think of is, the way you bind HTML/ASP controls
--HTML button control--
<input type = "button" id = "myButtonHTML" />
--ASP button control--
<asp:button runat = "server" id = "myButtonASP" />
the way you bind this in javascript will be as follows
--HTML control--
document.getElementById("#myButtonHTML").value
AND
--ASP control--
document.getElementById("#myButtonASP.ClientID").value