No refresh with core-drawer-panel - polymer

I have a little problem with Polymer.. but i have no idea for fix it...
when i go to my website:
http://toi-meme-tu-c.hol.es/polymer-tutorial-master/team/
and i click on the "i" for information (Case Scaroboy) ALL the drawer-panel refresh... how fix-it without javascript?
I have tried to include the drawer-panel into a php page but it's not an issue...
So I asked here, because im a begineer with Polymer...
thanks, Scaroboy

It must use Javascript i think because no core element so far build to replace the content directly. To load new content inside the main panel you will need ajax request which you can use core-ajax element (on v0.5) or iron-ajax element (on v0.8) but you will need to write Javascript function to handle the ajax response.
Or you can create your own element wrap ajax element with replace content inside container that you can pass through attribute.

Related

Using node and node-phantom to scrape AngularJS Application

I have a node script set up to scrape pages from an AngularJS application and then generate code needed for testing purposes. It works great except for one thing. ng-if. Since ng-if removes elements from the dom the script never sees these blocks of code. I can't remove the ng-if's. So I'm wondering if there is some way to intercept the html between when node-phantom requests the page and when it actually loads everything in to phantoms dom. What I'm hoping to do is simply set all the ng-if's to true so that all content is available. Does anyone have any ideas for this?
EDIT I'm using phantomjs-node not node-phantom.
My Final solution was to scrape the page for all of the comment tags. Then filter through to find the ones that contained ng-ifs and parse out variable names from those tags. Then I tapped into Angular's $scope and set all of the variables to true. Forcing everything that is hidden on the page to be visible.

Integrating React component in Neos CMS

Atm I'm playing around with Neos CMS and React.js a little bit. I was wondering if it is possible to get the content of a Neos NodeType as Json, so that i can use it as data for my React Components. I found some tutorials on special data for Neos but they all use a page as the basis. The problems I got now: If I use a content element, lets say an accordion, and put some data in there in Neos, I need a template for the container (so that React knows where to put stuff) but i dont want a template for the Accordion Items (These should go in the JSon File). So Question Number 1: How can I edit the content of an Accordion Item without haviing a template or telling the Accordion Container where to put the content of the children? And, Question number 2: How do I get the JSon-Object from the content (right now i use the TYPO3.TypoScript:Http.Message) and where do i find it (what is the url of this file)?
Here's is a detailed post on exactly this subject: http://dimaip.github.io/2015/11/15/react-neos/
To answer your questions directly:
How can I edit the content of an Accordion Item without haviing a template or telling the Accordion Container where to put the content of the children?
You can either create some dummy templates just for editing, or try to use raw content editing mode possible with some tuning to display all properties as inline fields.
This situation will greatly improve with introduction of structured editing, but for now creating dummy templates shouldn't be too hard.
How do I get the JSon-Object from the content (right now i use the TYPO3.TypoScript:Http.Message) and where do i find it (what is the url of this file)?
You can take an example from this solution: https://github.com/sfi-ru/EncultDistr/blob/master/Packages/Sites/Sfi.Encult/Resources/Private/TypoScript/Json.ts2
In essence yes, use TYPO3.TypoScript:Http.Message with Json.stringify EEL helper to build up the JSON itself. The url would be the same as the url to your node, but only with .json format suffix instead of .html.

HTML page title: localization and empty title

2 questions about a better way of solving the problem:
1) is there is a way to make HTML page title looking different for different locales of the client-side code except for javascript?
I.e. write HTML page title which is shown in the browser's tab in corresponding language.
I know I can use javascript for this, but may be there is another way?
2)I set my HTML page header with javascript (it is a different case). But there is a delay before the script will run. Is there is a way to set HTML page header to empty line before javascript evaluates?
If I remove tag I get the page URL.
If I use empty tag - same thing.
I have to use &nbsp content inside which looks a bit ugly.
Some other options?
I don't see any other means but JavaScript on the client side for this, sorry.
For the delay: try using an inline javascript to change the page title right on top of the page before any other scripts are loaded or executed, but after the page title has been set. This should keep the delay to an absolute minimum.
To the first:
Except Javascript, the only Way i know would be PHP, but using Javascript is a lot better and
easier.
To the second:
arkascha's Post is the answer

how to reset a dynamically/ajax-ly added/created form using jquery?

In my webpage a form is inserted via Ajax. I am using $("#my-ajax-returned-form")[0].reset();
to reset the form but it doesn't work for me. Firebug console shows TypeError: $("#my-ajax-returned-form")[0] is undefined. Any clue how to fix it? The actual flow is as following and its plain vanilla AJAX with jquery
Click on a icon sends an ajax call to server
The server sends a form which is inserted into webpage using $('#target-div').html(returnedFormHTML) which contains my form with id my-ajax-returned-form
User fills up form and clicks save, data is posted to server using $.post()
On success I fire another method which is trying to reset my-ajax-returned-form using $("#my-ajax-returned-form")[0].reset();
Now, it is obvious that form has to be some live in some sense but I am unable to figure it out :(
Here is the main webpage - http://pastebin.com/rtkr8RUC
Here is the #my-ajax-returned-form form - http://pastebin.com/jtjakgUt
I can not post the complete code on jsfiddle easily, bear with me for that
Update
I found the issue, there is a reset button in the form named reset, so obviously form.reset is not a function.
But the textarea is still not reset!
Fixed the textarea issue as well
The undefined clearly indicates that there's a problem finding the form. Are you sure the selector is correct, are you looking for it inside the correct iframe etc. Try logging the $("#my-ajax-returned-form") to see if it finds anything.
You could try $('#my-ajax-returned-form').eq(0).reset(), but since the selector is an id and so should be unique, this doesn't seem to make much sense.
On the other hand, is the reset() - function even defined?

Theoric question on HTML

is it possible via html to recall a HTML file (template) recall it and just change the value of PHP variable. And by the same way, this template position itself (with css) without any change?
Example: You want to display different objects to sell and the template is set graphically (photo + name + price) and you want to put another one just beside it.
If yes, by Javascript? or else?
Thanks
Using jQuery is very easy.
(1) Link your CSS earlier in the main HTML so when your template loaded the css will automatically applied.
(2) Add jQuery script like <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js"></script> or you can download jQuery yourself and use yout own path.
(3) Assume you have <div id="containner"></div> to populate the template later.
(4) When the document load, button click or whenever you want to trigger to load the template simply call $('#containner').load('/path/template.html'); this is jQuery javascript code. the .load() method is an Ajax call to your template file.
(5) Any PHP variables in the template file will be evaluated and will produce html only since at server side.
(6) The returned template will populated in the containner div.
use ajax, the Javascript runs on the client browser can call a server side script and switch page content without refresh the page.