I have an accordion and expansion panel in angular application. I am able to add the expansion panels dynamically with some fields. When i click on the <p> tag, i should open the same pop up with the values in the expansion panel. It is like "Updating the data in the expansion panel". The issue is, when i click on the p tag, it is opening with empty fields. Kindly help me in populating the existing data.
The stackblitz url is Demo
Issue was you were not passing any data which SequenceDialogBoxComponent can display, so when you are creating the component by calling this method addNewSequenceStep store the values somewhere and when you are calling openNewSequenceStepDialog on click of p, pass those values as subject key inside obj which you have bind inside HTML of SequenceDialogBoxComponent and you component will be able to display data.
Here is stackbliz url for you reference: Demo
Related
I am creating a dynamic form from angular in index.html using ng-repeat over an array of JSON object. On submit button, I need to pass form data into a post request in form of a map like :
{"key":value,"key":value}
The key is dynamic label generated in the form and value is the input from a text field or drop-down. Please help me. How I can create a map dynamically? You can find my code here.
I solved my problem. This was a little bit tricky to create a map from dynamic form. Code has been updated on plunker.
Step:
I declared a json object response at script.js.
Response[filed.attributeLabel] will work as a key and value will be bind when we select or enter some thing in dropdown or text filed avvording to key in scope variable.
I've started investigating admin-on-rest. It works fine for 'flat' REST-endpoints, e.g.:
/posts/
/users/
etc.
But how do I implement nesting? I mean if I click on some post-entry in 'posts' table - I want not the actual post to be opened in a <Show> view, but a list of it's comments (fetched from URL /{postId}/comments)? And I need also to keep the navigation functionality (some back-arrow button or hierarchy in the header to return to previous page).
Is this even possible with admin-or-rest?
If you want to show a list of comments for a post, use the <ReferenceField>. You can see an example in the demo: https://marmelab.com/admin-on-rest-demo/#/customers/77 (click on the "orders" and "reviews" tabs to see an embedded datagrid).
If you want to link to a filtered list of comments from the post list, you'll have to create a custom button component. Once again, you can find an example in the demo: https://github.com/marmelab/admin-on-rest-demo/blob/master/src/segments/LinkToRelatedCustomers.js
I'm trying to get google tag manager to track a couple of different buttons on a site. We're currently unable to change the site to aid with this, so we have to find a solution solely with tag manager.
There are several buttons on the site all with the same format as to the two below.. they all have "submit" as the type and a unique term for value so I'm trying to use the tag manager Form Listener which picks up on type="submit". Is there any variable I can use to pull the value field into my event so I can create individual goals in analytics?
etc etc
Any help is greatly appreciated.
You can use built-in variable "Click Element", then create custom JS-variable:
function(){
try{
return {{element}}.getAttribute("value"); //I am not sure now if it is {{element}} or {{Click Element}}
}catch(err){}
}
This will give you a value attribute of clicked button.
Maybe a useful link by Simo Ahava:
http://www.simoahava.com/analytics/track-form-engagement-with-google-tag-manager/#3
You can use built-in auto-event variable Element Attribute to get value. And be sure to use click tracking and not form tracking, because you want to track button clicks and not form submissions.
I have a form that has some fields.
One field is autocomplete
.
The field is filled with information from a table
$f->addField('autocomplete','idfield','Field')->setValueList( $this->api->db->dsql()
->table('items')->field('id,name')->do_getAssoc() );
I'm trying to set the focus on that field when the page loads.
I have did this
On top of the page
$p->js()->_load('seteo_foco');
And then
seteo_foco.js
$(function(){
$("select:first").focus();
})
But this does not work.
Anybody can help ?
Thanks
Try TRUE like
$this->js(true)->_load('seteo_foco'); to load js file.
But in your js code your selector is incorrect. You need to specify you unique field. I'd use something like $form->getElement('field_name')->js(true)->focus(); on the page after the form has been initialized.
I am using angular UI bootstrap type-ahead directive for type-ahead in a form
http://angular-ui.github.io/bootstrap/
I am fetching the records from remote server via $http service. It is working fine.
However I can select only one element from list at a time.
I want to select multiple values from the list and show all currently selected element in input field with a remove button just like tags for SO. The selected tags are stored in angular array model.
How to achieve this ?
I have read documentation for Angular UI bootstrap but I am not able to find anything.
This guy made a directive for this. Should do exactly what you want and it's even using the ui-bootstraps typeahead.
https://github.com/mbenford/ngTagsInput
The best solution I have found so far is io.select
it does exactly what you require, multi-select typeahead.
and the markup is neat and clean too e.g:
<oi-select
oi-options="list.id as list.description for list in lists"
ng-model="tags"
multiple
placeholder="Select">
</oi-select>
This component is also compatible with bootstrap and the new bootstrap 4.
In js file :
To list all selected items, use $item with typeahead-on-select and push to an array for ex.evtMem. delete fn to delete selected item.
HTML :
Use table to list all array values using ng-repeat. Addition to that add remove glyphicon image and function to delete corresponding item.