Documentation for angular form

[AnirbanKundu]

Request Type: docs

How to reproduce: None of the Plunker links works in the form documentation page [https://docs.angularjs.org/guide/forms]. Could you please update the Plunker links accordingly.

Component(s): forms

Impact: large

Complexity: small

This issue is related to:

Detailed Description:

None of the Plunker links works in the form documentation page [https://docs.angularjs.org/guide/forms]. Could you please update the Plunker links accordingly.

Other Comments:

[caitp]

This issue is with all of the plunker links in the app, @ggoodman is this our fault or did something change in plnkr?

[ggoodman]

Looks like something on your end where CORS headers are not being sent on the manifest.json file that Plunker uses to find all the relevant files.

Maybe @petebacondarwin can help?

[petebacondarwin]

I think this is due to some of the changes jeff was making on yhe servers
recently...
On 20 Apr 2014 16:14, "ggoodman" notifications@github.com wrote:

Looks like something on your end where CORS headers are not being sent on
the manifest.json file that Plunker uses to find all the relevant files.

Maybe @petebacondarwin https://github.com/petebacondarwin can help?

Reply to this email directly or view it on GitHubhttps://github.com//issues/7166#issuecomment-40895741
.

[chirayuk]

I started looking at this.  There's absolutely zero documentation for how "Edit in Plunker" works.  Is the ngdoc part something Angular defined?  Is it something special done by Plunker and hardcoded just for AngularJS?  (Whatever the answer, I would add comments to indicate this – else nobody except @petebacondarwin and @ggoodman can reliably modify those lines.)

FYI, the CORS headers should be served for the https requests for manifest.json but not for http (which should redirect to the https version.)  But of course, I have no clue why it's requesting http and not https since I'm not privy to the secrets / black magic that makes this work.

I've tweeted at Geoff asking about this – https://twitter.com/chirayuk/status/458356279929344000

[petebacondarwin]

So the deal is that we provide a manifest file that points to all the files in the example and Plunker does the rest.

Plunker has these things called generators that can create plunkers for you. In this case it is triggered by going to a URL of the form... http://plnkr.co/edit/ngdoc:example-example20@snapshot?p=preview

ngdoc:{{example-name}}@{{version}}

Looking at the result of accessing one of these URLs is:

URL visited /edit/ngdoc:example-ngChange-directive@snapshot
EDITOR ngdoc:example-ngChange-directive@snapshot
Testing source ngdoc:example-ngChange-directive@snapshot
XMLHttpRequest cannot load http://code.angularjs.org/snapshot/docs/examples/example-ngChange-directive/manifest.json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://plnkr.co' is therefore not allowed access.

For this to work, the Plunker web page needs to be able to do $http calls to our docs and code websites to get hold of the actual file content.

Unfortunately it seems that Plunker is hitting the HTTP version of the site, rather than HTTPS, to get the manifest and other files. But we are doing a redirect for that page which seems to kill the ability to return correct CORS headers.

The quickest fix would be to get @ggoodman to modify the generator.

This solution is really hard-coded and magical. I am wondering if it would be safer to return to just POSTing the contents of these files to Plunkr instead.

[petebacondarwin]

Looks like we need to change this line:

https://github.com/filearts/plunker_www/blob/master/assets/js/services/importer.coffee#L8

[chirayuk]

I prefer the version that did POSTs since we don't control importer.coffee.  With the POST version, it's obvious how it works and wont break in these mysterious ways. The current version is impenetrable to folks who want to maintain the code (documentation would help a great deal.)

[chirayuk]

Fixed.  https://twitter.com/filearts/status/458416500802863104

AI:  Use POSTs instead relying on importer.coffee to seed the plnkr examples.

[ggoodman]

Hi @chirayuk, the code that supports POSTing to http://plnkr.co/edit/ is still there and still works. The issue arose when you guys transitioned to the new document generator and the built example code was not directly available in the markup.

What could be done is that you guys take control of reading the manifest (or any other alternative that works for you) and simply POST the plunk to Plunker like things were in the previous version of the docs.

The format for POSTing to http://plnkr.co/edit/ is the following. Note that a application/json or application/x-www-form-urlencoded are acceptable.

{
  description: "Plunk description", // Optional
  tags: ["tag1", "tag2"], // Optional
  files: { // Required
    'filename1.ext': "Content of filename1.ext",
    'filename2.ext': "Content of filename2.ext"
  }
}

[chirayuk]

Thanks for the quick fix, @ggoodman!  Appreciate it.

We should go back to using POSTs which are clearly understood and debuggable.  (I just created issue #7186 to track it.)  That scheme has been robust over the years and has even worked for me to create some Dart plunkers in the past.  As you suggested, we should be able to have the server return something that then just performs a POST to plunker (instead of returning the manifest.)

Thanks!

[GrCOTE7]

Hi All,

I'm certainly very far to be as good as you... And more, I just begin with JS, jQ and now Angular...

But, I was very 'Liker' of plunker... That's fantastic ! Even emmet, etc...

I'm even forgetting my Netbeans IDE !!! LOl !

So, I play a lot with it ! It would be obliged to know it in schools !!! Lol !

Ok, now, I'm begin to discover $http...

And I'm concern with this trouble with Control-Allow-Origin... :-(...

I own a dedicaced server to put in it, in a file a Json data...(Very basic: http://go.pui100.com/getJson.php)

And I try to play with it in this plunk:
http://plnkr.co/edit/QpRxt9

But, I don't succed in that ? Can you help me ?

Thanksand to soon I hope.

Lionel.
PS: Don't forget, i'm a french big noob, and very light in english...