I have a vue component with ag-grid grid (infinite model). I want to access to its params to use successCallback, directly in another method in the component, after do the setDatasource.
In sum up, I can not find where the params are.
I have tried:
this.gridApi.params.successCallback(data, totalRows)
this.gridOptions.params.successCallback(data, totalRows)
this.params.successCallback(data, totalRows)
Any advice?
Basically, you have missed the full flow of how the ag-grid operating with dataSource.
So according to the official doc, IDatasource looks like that:
interface IDatasource {
/** If you know up front how many rows are in the dataset, set it here. Otherwise leave blank.*/
rowCount?: number;
/** Callback the grid calls that you implement to fetch rows from the server. See below for params.*/
getRows(params: IGetRowsParams): void;
destroy?(): void;
}
Let's go deeply to getRows and IGetRowsParams interface (only needed part of it)
/** Params for the above IDatasource.getRows() */
export interface IGetRowsParams {
....
successCallback(rowsThisBlock: any[], lastRow?: number): void;
...
}
So as you can see, successCallback only accessible via dataSource and exactly in getRows method, which means, that you don't have to get direct access via gridAPI. It should be defined once (as dataSource) and then, ag-grid will execute getRows only when it requires.
Possible solution (not recommended to use, cut dataSource mostly required for infinite scroll and auto-fill the new data)
You can bind params.successCallback to your own property and execute it whenever you want
here is a simple hack example (check successCallbackBinding)
Related
I am trying to get more familiar with laravel/livewire. I find myself struggling with collections with related data. In my component i get data from the database and store it in a variable, with related data. When i do a dd after the retrieval, i see a complete collection with the related data. In my bladefile i have a foreach loop to display all the lists and for each list i have a foreachloop to display all todos.
But when i want to edit a list, i want to show one of the lists in a modal with a form. I call a function 'edit_todo' and i want to extract the data from my collection to fill in a blade form.
But when i look at the same variable as before ($this->todolists) in that function, the related data is missing.
This is a part of the code.
class Dashboard extends Component
{
public $todolists, $list_id, $todolist;
public function render()
{
$this->todolists = TodoList::with('todos')->get();
//dd($this->todolists); //<-- relationsproperty shows all todos from each list
return view('livewire.dashboard');
}
/**
* The attributes that are mass assignable.
*
* #var array
*/
public function edit_todo($list_id)
{
dd($this->todolists); //<-- relationsproperty is empty
$this->todolist = $this->todolists->where('id',$list_id)->with('todos')->first()->toArray();
}
Any suggestions? What am i doing wrong?
Maybe i just have to get the data again from the database, but i'd like to understand why this isn't working.
Move the population of your $todoLists to the mount method:
public function mount()
{
$this->todolists = TodoList::with('todos')->get();
}
Have a look at https://laravel-livewire.com/docs/2.x/lifecycle-hooks and you'll notice that the render method is only requested at the very end. If you need your $todoLists populated as you wish, move it up in the list of lifecycle hooks.
Edit & extra: mount() in LiveWire is equal to __construct() in any other class as we are used to. Whatever you would like to 'construct', write it in the mount method.
I'm new to unit / integration testing and I want to do an integration test of my controller which looks simplified like this:
// ItemsController.php
public function edit() {
// some edited item
$itemEntity
// some keywords
$keywordEntities = [keyword1, keyword2, ...]
// save item entity
if (!$this->Items->save($itemEntity)) {
// do some error handling
}
// add/replace item's keywords
if (!$this->Items->Keywords->replaceLinks($itemEntity, $keywordEntities)) {
// do some error handling
}
}
I have the models Items and Keywords where Items belongsToMany Keywords. I want to test the error handling parts of the controller. So I have to mock the save() and replaceLinks() methods that they will return false.
My integration test looks like this:
// ItemsControllerTest.php
public function testEdit() {
// mock save method
$model = $this->getMockForModel('Items', ['save']);
$model->expects($this->any())->method('save')->will($this->returnValue(false));
// call the edit method of the controller and do some assertions...
}
This is working fine for the save() method. But it is not working for the replaceLinks() method. Obviously because it is not part of the model.
I've also tried something like this:
$method = $this->getMockBuilder(BelongsToMany::class)
->setConstructorArgs([
'Keywords', [
'foreignKey' => 'item_id',
'targetForeignKey' => 'keyword_id',
'joinTable' => 'items_keywords'
]
])
->setMethods(['replaceLinks'])
->getMock();
$method->expects($this->any())->method('replaceLinks')->will($this->returnValue(false));
But this is also not working. Any hints for mocking the replaceLinks() method?
When doing controller tests, I usually try to mock as less as possible, personally if I want to test error handling in controllers, I try to trigger actual errors, for example by providing data that fails application/validation rules. If that is a viable option, then you might want to give it a try.
That being said, mocking the association's method should work the way as shown in your example, but you'd also need to replace the actual association object with your mock, because unlike models, associations do not have a global registry in which the mocks could be placed (that's what getMockForModel() will do for you) so that your application code would use them without further intervention.
Something like this should do it:
$KeywordsAssociationMock = $this
->getMockBuilder(BelongsToMany::class) /* ... */;
$associations = $this
->getTableLocator()
->get('Items')
->associations();
$associations->add('Keywords', $KeywordsAssociationMock);
This would modify the Items table object in the table registry, and replace (the association collection's add() acts more like a setter, ie it overwrites) its actual Keywords association with the mocked one. If you'd use that together with mocking Items, then you must ensure that the Items mock is created in beforehand, as otherwise the table retrieved in the above example would not be the mocked one!
referring to the following post StackOverflow Question I have a quite different scenario where I want to know if Aurelia has a solution for.
Scenario:
I have a user model:
export class User{
#bindable name: string;
#bindable address: Address
As you can see, "Address" is a sub-model.
I have a main view-model "registration". In this view model I have a model "user":
export class RegistrationView{
#bindable user: User
public attached(){
this.user = userService.fetchUserFromApi();
}
In addition to that I have a custom-element "user-address" where I have a "user-address"-model (because I want to have dedicated encapsulated custom-elements).
export class userAddress{
#bindable userAddress: Address
Now I want to request the user model only once from the API and send the user address it to the custom-element:
<template>
<require from="user-address"></require>
<user-address user.address.bind="${dj.address}"></user-address>
Finally I would (to have dedicated encapsulated custom-elements that I can use everywhere) check in attached method if the user is already load and if not then the custom-element would load all needed data:
export class userAddress{
#bindable userId: string
#bindable address: Address
public attached(){
if(!(typeof this.address === "undefined")){
this.address = this.addressAPIService.getAddressByUserId(id)
}
}
Problem 1: I know, that the mentioned template dj.address.bind doesn't work. But now my question is, how can I handle that situation?
Problem 2: How do I assure, that the user object is only requested once?
Does my concept makes sense and does it is the idea of Aurelia?
If I understand your problem correctly, you simply need some form of client-side persistence.
If you need this persistence even after the user closed the browser, you'll want to use either localStorage or some encapsulation thereof. There are many good plugins available such as localForage, LokiJS and a recently developed (still in beta) aurelia plugin aurelia-store
You probably want to encapsulate the retrieval of your user in a UserService of some sort. This is nothing specific to Aurelia, just generally how you want to do this in most types of applications.
Example
So in your viewmodel you might have something like this (skipping some of the implementation details such as checking the params, configuring the router etc for brevity):
#autoinject()
export class UserViewModel {
public user: User;
constructor(private userService: UserService){}
// happens before bind or attached, so your child views will always have the user in time
public async activate(params: any): Promise<void> {
this.user = await this.userService.getUserById(params.id);
}
}
And in your userservice:
// singleton will ensure this service lives as long as the app lives
#singleton()
export class UserService {
// create a simple cache object to store users
private cache: any = Object.create(null);
constructor(private client: HttpClient) {}
public async getUserById(id: number): Promise<User> {
let user = this.cache[id];
if (user === undefined) {
// immediately store the user in cache
user = this.cache[id] = await this.client.fetch(...);
}
return user;
}
}
Let your view model just be dumb and call the UserService whenever it needs to load a user, and let your service be clever and only fetch it from the API when it's not already cached.
I'd also like to point out that attached() is not when you want to be grabbing data. attached() is when you do DOM stuff (add/remove elements, style, other cosmetic things). bind() is best restricted to grabbing/manipulating data you already have on the client.
So when to fetch data?
In your routed view models during the routing lifecycle. That'll be configureRouter, canActivate, activate, canDeactivate and deactivate. These will resolve recursively before any of the DOM gets involved.
Not in your custom elements. Or you'll soon find yourself in maintenance hell with notification mechanisms and extra bindings just so components can let eachother know "it's safe to render now because I have my data".
If your custom elements can assume tehy have their data once bind() occured, everything becomes a lot simpler to manage.
And what about API calls invoked by users?
More often than you think, you can let an action be a route instead of a direct method. You can infinitely nest router-views and they really don't need to be pages, they can be as granular as you like.
It adds a lot of accessibility when little sub-views can be directly accessed via specific routes. It gives you extra hooks to deal with authorization, warnings for unsaved changes and the sorts, it gives the user back/forward navigation, etc.
For all other cases:
Call a service from an event-triggered method like you normally would during activate(), except whereas normally the router defers page loading until the data is there, now you have to do it yourself for that element.
The easiest way is by using if.bind="someEntityThatCanBeUndefined". The element will only render when that object has a value. And it doesnt need to deal with the infrastructure of fetching data.
When javascript is run in the browser there is no need to try and hide function code because it is downloaded and viewable in source.
When run on the server the situation changes. There are use cases such as api where you want to provide users with functions to call without allowing them to view the code that which is run.
On our specific case we want to execute user submitted javascript inside node. We are able to sandbox node.js api however we would like to add our own api to this sandbox without users being able to toString the function to view the code which is run.
Does anyone have a pattern or know of a way of preventing users from outputting a functions code?
Update:
Here is a full solution (i believe) based on the accepted answer below. Please note that although this is demonstrated using client side code. You would not use this client side as someone can see the contents of your hidden function by simply reading the downloaded code (although it may provide some basic slow down to inspect the code if you have used a minify).
This is meant for server side use where you want to allow users to run api code within a sandbox env but not allow them to view what the api's do. The sandbox in this code is only to demonstrate the point. It is not an actual sandbox implementation.
// function which hides another function by returning an anonymous
// function which calls the hidden function (ie. places the hidden
// function in a closure to enable access when the wraped function is passed to the sandbox)
function wrapFunc(funcToHide) {
var shownFunc = function() {
funcToHide();
};
return shownFunc;
}
// function whose contents you want to hide
function secretFunc() {
alert('hello');
}
// api object (will be passed to the sandbox to enable access to
// the hidden function)
var apiFunc = wrapFunc(secretFunc);
var api = {};
api.apiFunc = apiFunc;
// sandbox (not an actual sandbox implementation - just for demo)
(function(api) {
console.log(api);
alert(api.apiFunc.toString());
api.apiFunc();
})(api);
If you wrap a callback in a function, you can use another function in that scope which is actually hidden from the callback scope, thus:
function hideCall(funcToHide) {
var hiddenFunc = funcToHide;
var shownFunc = function() {
hiddenFunc();
};
return shownFunc;
}
Then run thusly
var shtumCallBack = hideCall(secretSquirrelFunc);
userCode.tryUnwindingThis(shtumCallBack);
The userCode scope will not be able to access secretSquirrelFunc except to call it, because the scope it would need is that of the hideCall function which is not available.
I have a login button in the header of the website. This header's html is programmed into Zend framework views/layouts/home.phtml.
I have a hidden form in this layout that is triggered by jQuery thickbox inline content display integration. Reason, I dont want to make a ajax call to just fetch a small login form.
I create the form using Zend_Form and the problem is that I have to do it in all the controllers after checking if the user is logged in or not. I want to place this form generation in one single place, say in bootstrap and then have a logic in bootstrap to say that if user is logged in dont generate the form.
I don't know if bootstrap is the right place to do so or should I do it in some other place.
So, where should I instantiate the form so that its available everywhere if user is not logged in.
Create your own base controller which extends Zend_Controller_Action then have your controllers extend off of your base controller. I don't know what "jQuery thickbox inline content display integration" is...but you have several sections you can put it in depending when you need your code to run. init(), preDispatch(), postDispatch() etc... Just make sure when you extend off your base controller that you do sthing like:
parent::init()
parent::preDispatch()
parent::postDispatch()
etc... within each section so that the base code runs as well...
Be careful about Pradeep Sharma's solution (the answer he wrote himself and accepted below).
All the code code below is for ZF 1.12, and not ZF 2.0
In the bootstrap, Zend_Layout's MVC instance might not have been created yet. You should use Zend_Layout::startMvc() instead :
$view = Zend_Layout::startMvc()->getView() ;
And tbh I prefer executing this code in the preDispatch() function. New users of ZF might be interested in this :
application/plugins/HeaderForm.php :
class Application_Plugin_HeaderForm extends Zend_Controller_Plugin_Abstract
{
public function preDispatch(Zend_Controller_Request_Abstract $request)
{
$view = Zend_Layout::startMvc()->getView() ;
$view->headerForm = new Application_Form_HeaderForm() ;
}
}
Calling new Application_Form_HeaderForm() will autoload by default into application/forms/ folder. You can also create the form directly into the plugin with new Zend_Form(), and addElement() etc. but it won't be reusable.
Of course, you need to register this plugin in your bootstrap!
application/Bootstrap.php :
class Bootstrap extends Zend_Application_Bootstrap_Bootstrap
{
protected function _initPlugin()
{
$front = Zend_Controller_Front::getInstance() ;
$front->registerPlugin(new Application_Plugin_HeaderForm()) ;
}
}
Calling new Application_Plugin_HeaderForm() will autoload by default into application/plugins/ folder
I did it in a different way, extendingZend_Controller_Plugin_Abstract to implement a plugin and register it with front controller.
public function routeStartup(Zend_Controller_Request_Abstract $request) { }
generated the form inside the above mentioned method and by setting the form in $view object.
$view can be retrived using :
$view = Zend_Layout :: getMvcInstance()->getView();