# Calling APIFunction from Javascript

I want to load a csv file describing a graph from jQuery and call an APIFunction to evaluate its global clustering coefficient.

I'm not sure on how to call the APIFunction from the html form. I'm getting the following error. The matrix is not evaluated.

Here's my APIFunction code:

   CloudDeploy[
APIFunction[{"myfile" -> "CSV"},
N@GlobalClusteringCoefficient[


My HTML:

 <html>
<script>
$(document).ready(function(){$(":file").css("background-color", "gray");
});
</script>
<body>

<form action="https://www.wolframcloud.com/objects/9f99606b-f688-4737-8e2d-eecc03a810b7" method="get">
File: <input type="file" name="myfile">
<input type="submit" value="Submit">
</form>

</body>
</html>

• – Searke Mar 17 '16 at 21:25

This should work: First use a named CloudObject (that way you don't have to constantly update your web page every time you make changes to your APIFunction and redeploy it):

CloudDeploy[
APIFunction[{"myfile"->"CSV"}, Dimensions[#myfile]& ],
CloudObject["filetest"],
Permissions -> "Public"
]


Note, I simplified the APIFunction code to just compute the Dimensions of the CSV file.

Next you need to change your web page as shown below (replace the CloudObject with the one generated by the above code. Note the addition of the method="post" and enctype="multipart/form-data" in the <form> tag (this is key to making this work):

<html>
<script src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
<script>
$(document).ready(function(){$(":file").css("background-color", "gray");});
</script>
<body>
<form method="post" enctype="multipart/form-data" action="https://www.wolframcloud.com/objects/user-7053ce31-817f-4643-aec1-eda27051bba6/filetest">
File: <input type="file" name="myfile">
<input type="submit" value="Submit">
</form>
</body>
</html>


This is what the web page looks like:

When I run this on your CSV file, I get back its dimensions (9x9):

Let me know if this helps!

(thanks to Joel who actually figured this out!)