html_entity_decode() with Livewire model binding to eloquent collection - eloquent

I am retrieving an eloquent collection from the database and then model binding that eloquent collection in Livewire as explained in the Livewire docs. In my blade view I am then looping through the eloquent collection using:
#foreach ($contents as $content=>value){
<textarea wire:model.lazy='contents.{{$index}}.text_value'></textarea>
#endforeach
This loops through and shows the 'text_value' field for each of the models in the collection. In some of the text_values there are hyperlinks. If I wasn't looping through an eloquent collection that is using model binding I would use the following to decode the html characters to render the value as a hyper link:
#foreach($contents as $content)
<textarea wire:model.lazy='{!! html_entity_decode('$content->text_value) !!}
#endforeach
How do I do that when looping through an eloquent collection with model binding that uses the following so that the span and a tags are rendered as html:
#foreach ($contents as $content=>value){
<textarea wire:model.lazy='contents.{{$index}}.text_value'></textarea>
#endforeach
There is nothing in the Livewire documentation, and using the below doesn't work as this is not being 'performed' on the text_value:
#foreach ($contents as $content=>value){
<textarea wire:model.lazy='contents.{!! html_entity_decode($index) !!}.text_value'>. </textarea>
#endforeach

Related

AJAX Adjust part of zend form based on select

I have a (Zend) form like this.
<form>
<select id=”select1”>
<option value=”1”>choice 1</option>
<option value=”2”>choice 2</option>
</select>
<div id=”adjust”>
<input type=”text” value=”choise3”></input>
<input type=”text” value=”choise4”></input>
</div>
</form>
When a user makes a choice in #select1 I want to replace te form fields in div #adjust with fields I construct from a query from a database (or a few partial forms). So the fields can be replaced by totally other fields and also more or less fields.
Replacing is no problem with eg. Jquery. But when they are filled, how does Zend form process them in a correct way (because I didn’t define the fields in the form). And when there are fields not passing the validators, how do they get back then with fault announcements

Cannot renders nested list within divs correclty in itextsharp

I use itextsharp & mvcrazortopdf to generate pdfs in azure websites. nested lists in div tags or table cell cannot be rendered correctly - they become one single line. here is a example:
<div>
<ul>
<li>
test1
<ul>
<li>test1.1</li>
</ul>
</li>
<li>test2</li>
</ul>
</div>
http://demo.itextsupport.com/xmlworker/
in the demo page it is rendered as:
test1 test1.1
test2
Any help is appreciated!
With the help of a coworker, we managed to create a workaround for nested lists inside a table cell. It involves surrounding the list with <div> tags, and they will render correctly.
For instance, in the web application I'm developing, there are several Razor Views that we convert to PDF. As these views are completed with data from the database, we allow users to fill some fields in other forms with rich-text controls. As a result, we can encounter any kind of styles and combination of lists.
The mentioned reports are similar in structure, so we have many tables within tables. In the last level of tables, we have the "troublesome" cells, which are filled with the rich-text fields from the database. Inside each cell, we put the <div> tags like this:
<tr>
<td class="border3 fontMedium">
<div>
#if (!String.IsNullOrEmpty(entity.Field))
{
<p class="fontSmall">#Html.Raw(entity.Field)</p>
}
else
{
<p> </p>
}
</div>
</td>
</tr>
Please note that the mentioned <div> does not need to have any CSS class associated. The other CSS classes you see in the code snippet belong to the styling of the reports; and they involve borders, paddings and so on.
Hope that helps.

How to combine two collections objects to one table while looping over all objects in Meteor.js?

I'm working on the simple Meteor Chat application. I have two different collections, textMessages and FS.images. I need to display those element based on time in one flow. Now I submit them both apart from each other and can't figure the way, while looping over them using #each handler.
Template code :
<ul class="list-group">
{{#each messages}}
<li class="list-group-item">
<span class="badge">x</span>
UserN: {{text}}
</li>
{{/each}}
</ul>
<ul class="list-group">
{{#each showImages}}
{{#unless this.isUploaded}}
{{> FS.UploadProgressBar bootstrap=true}}
{{/unless}}
{{> imageItem}}
{{/each}}
</ul>
You can create a helper in the template that would combine both collections results and sort them by date if each user has set of images and text.
If each message has a set of images you can use this package for creating helper for the collection in such a way you can get the set of images for a certain message.
meteor-collection-helpers

TYPO3 merge list and edit

I've got a TYPO3 backend module which lists a lot of elements. Now, I want to include in my list the edit form, but that doesn't work well at the moment.
Rendering is good, but if I send the form, I get the error:
Required argument "note" is not set.
My code looks like this:
<f:for each="{notes}" as="note">
<f:form action="update" name="note" object="{note}">
<textarea class="form-control gettooltip" rows="1" placeholder="Kommentar" title="Kommentar zur Note">{note.kommentar}</textarea>
</f:form>
</f:for>
How can I merge these two views correctly?
Your code cannot work because your textarea doesn't have a property (or you don't use the <f:form.textarea ViewHelper).
If you property map $note in your controller, the property must be passed to Fluid with the prefixed extension name and plugin name. This is done automatically when using the "property" argument of the textarea ViewHelper. The name attribute will then be:
<textarea name="tx_myext_myplugin[note]"...
Thîs will map to $note in the controller.
So if you don't use the ViewHelper, you need to manually prefix the name attribute to create an output like printed just above.
If you're planning to update multiple objects of the of the same kind in one request, this won't because because there is an Extbase limitation.
You could do the following:
Use a submit button for each note and save/reload the changes through AJAX.
<f:for each="{notes}" as="note">
<f:form action="update" name="note" object="{note}">
<f:form.textarea class="form-control gettooltip" placeholder="Kommentar" property="kommentar">{note.kommentar}</f:form.textarea>
<f:form.submit value="Update" />
</f:form>
</f:for>
Then you intercept the submit click, submit the form through AJAX and set the new content to the textarea.
If you want to have one form for all objects, you will need to prefix the fields
<f:form action="update" name="note">
<f:for each="{notes}" as="note">
<f:form.textarea class="form-control gettooltip" placeholder="Kommentar" name="note[note{note.uid}][kommentar]">{note.kommentar}</f:form.textarea>
</f:for>
<f:form.submit value="Update" />
</f:form>
You will then have an array of values and need to iterate in your controller and manually persist the changes.
For your problem - as #lorenz answered you need to use viewhelpers for rendering fields OR at least use valid name attributes for your fields...
Anyway, I'm wondering why do you want to reinvent the wheel - especially while creating BE modules, the fastest, easiest and most elegant way is... using TYPO3 forms. They handle many things, relations, localization, validation, RTE etc, etc. What's more you can also add own type of field to TCA and process with your own PHP and JS - very rare situation, but may be used i.e. for adding GoogleMap field,
#see: user type in TCA
Finally all you need to open the record from your BE module is creating proper link - which can be easily copied from List module (right click on the yellow pencil next to your record and copy the code), sample:
<a href="#" onclick="window.location.href='alt_doc.php?returnUrl='+T3_THIS_LOCATION+'&edit[fe_users][1234]=edit'; return false;" title="Edit user">
<span title="" class="t3-icon t3-icon-actions t3-icon-actions-document t3-icon-document-open"> </span>
</a>
Where fe_users is table name and 1234 is record uid.
alt_doc.php?returnUrl='+T3_THIS_LOCATION part handles returning to the place from which edit was started, so it will be your module again including all GET params selected by admin before editing.
For creating new user
<a href="#" onclick="window.location.href='alt_doc.php?returnUrl='+T3_THIS_LOCATION+'&edit[fe_users][6789]=new'; return false;" title="New record">
<span class="t3-icon t3-icon-actions t3-icon-actions-document t3-icon-document-new"> </span>
</a>
In this case 6789 is a PID (uid of the page where the user should be created...
You can even set some default values when creating records from your own module using params in your new link:
&defVals[table_name][field_name]=value
sample
<a href="#" onclick="window.location.href='alt_doc.php?returnUrl='+T3_THIS_LOCATION+'&edit[fe_users][6789]=new&defVals[fe_users][tx_extbase_type]=Tx_MyExt_People&defVals[fe_users][usergroup]=1'; return false;" title="New record">
<span class="t3-icon t3-icon-actions t3-icon-actions-document t3-icon-document-new"> </span>
</a>

Is it possible to implement dynamic form input rows (adding new row by clicking on Add) with Handlebars and Meteor?

I'm getting my hands dirty with Meteor, and I wanted to port this AngularJS app (http://simplydo.com/projector/) over as an exercise.
I'm having difficulty implementing adding dynamic input form rows to sections using Handlebars, and I've found no documentation anywhere that documents if this possible. It's a snap in Angular using ng-repeat, but I want to confirm if this is something that is possible in Handlebars or whether I need to use Jquery in order to achieve this.
Thanks in advance.
It's just as easy in Meteor
all you have to do is repeat the rows with {{#each rowData}} and have a button that adds a document to the collection. Here is an example:
In this template the rows for a page are shown. In order to add a row, the user has to click on the add image. The template is :
<template name="page">
{{#with page}}
<h3>{{title}}</h3>
{{#each rows}}
<div class="row-fluid page-row {{#if isSelected this}}selected-row{{/if}}">
... page content here
</div>
{{/each}}
{{/with}}
<div class="btn-toolbar">
<div class="pull-right">
<a id="add-row" href="#" data-toggle="tooltip" title="{{lbl 'add-page'}}">
<img src="/images/add.png" class="asset-icon"/>
</a>
<img src="/images/separator.png" class="asset-icon"/>
<a id="delete-row" href="#" data-toggle="tooltip" title="{{lbl 'delete-page'}}">
<img src="/images/delete.png" class="asset-icon"/>
</a>
</div>
</div>
</template>
the helpers for this template are:
Template.page.page = function () {
return Session.get("selected-page");
}
in order to add a page the click event for the add button is implemented:
"click #add-row": function (evt, template) {
var page = Session.get("selected-page");
Pages.update({_id: page._id}, ... add a new row here ...)
}
because the whole thing is reactive, the list of rows will redraw after the update on the Pages collection.