I have a searchfield that when used shows multiple results (search for Star Wars and you get about 6 results in a list form). Every result has a "add movie" button which when clicked should save the data of that movie into my rails model.
I want to use Backbone to get a dynamic view for this process, so that when the movie is added it shows instantly without refreshing. The easiest way to do this would be to extract the data from the HTML (title, image-url) from the selected movie and store it into my model.
I've checked the Backbone model documentation, and I've already did the codeschool Backbone.js course, but still I find it hard to get started. Can someone point me in the right direction?
Related
I have a list of data which are rendered by default (20 items) with lazy loading functionality (pagination) to load more data when the user scrolls to a certain position.
Now I need to implement a search functionality from the api itself, my question is:
Initially I have 20 items, when a user search they will get another 20 items based on the search term (the old set will be replaced), and when scrolling they will get page 2 from the list based on the search term.
So what is the best practice here to know when I need to concatenate the old data with the new batch or to replace the old set of data with a new one.
My question is more architectural, any help would be appreciated.
Because backend shall has paginator in search, you only would re render component with new information in such page(bit collection), in other words , if you has service backend pagination render "item component", if you search into a collection(javascript array) in browser , use "collection/list component" (map), you can use keys to property change
React router has very cool feature: if you have a list of items (Instagram for example) and if you click on one item, content opens in modal/overlay but if you copy-paste the link to new tab/window or share the link with a friend for example, it opens in its own page.
I would love to use this feature but I need to find a custom solution..
My posts are very data heavy
I've split posts data into 2 tables in database
1st is very lightweight containing essential data: 4-5 columns
2nd table is very heave, ~30 columns
When user uses search filter, list updates only with data from 1st table
If user clicks on post, it will open in a modal/overlay
I will recycle the data I already have (from 1st table) and also get rest of the data from 2nd table
However, when user shares the link or opens it in new tab/page, data from 1st table is not present. I would need to integrate a conditional logic:
If post opens in list view (modal/overlay), only get additinal 2nd table data
If it's opened in a new tab/window in its own page, get all the data, 1st table included
How could I integrate this with React router? Has anyone already tried it? This would also allow to use different layout/components when user opens item in page view. Is there a way to check it?
Or is there a flaw in my logic? I imagine list would update very fast because it doesn't require huge amount of data and also would modal/overlay because it recycles some of the data.
I read all the docs, also searched online - didn't find anything.
Modals in react router are great. I've used the pinterest example and adapted it to my own needs.
Ensure you do your check on state.modal===true in a master layout component to give you the modal styling.
you'll need to check if table 1 stuff is present in your state and dispatch an action to trigger the async call in componentDidMount. You should be fetching table 2 in all scenarios.
I am new to angular and was wondering if I could somehow change states (after clicking on link from a list of search results) and load a new view, hide the old one (including header !), but not unload it/not have to request JSON data again if I got back to the search results for products view from the product details view.
Well, this will be a really short answer.
Take a look at this:
$templateCache You can play around with it so you won't need to reload pages when going back and forth.
I am trying to create a incident log in safesfore. The key aspect is that everything can be added on the same page reducing the amount of clicks that have to be made. There are 6 fields i have created:
Date Opened, Date closed, incident, reported to, reported by and notes.
I was wondering if there is a way to create an "add new" button that will create another row of the fields i have just lised. The idea being that the page does not refresh it is all done in real time.
Many thanks
You'll need a custom Visualforce page implementation.
There are 2 ways to do it
1) Building a list of records on apex and iterate over that list displaying the fields on the front end (vf page apex:repeat)-- Then when the button "add new" is clicked you'll append an empty record to the list and re-render the apex:repeat to reflect the changes.
This is good because you don't need a lot of boilerplate code since the records with be binded with the backend. However, the rerendering can lead to some performance issues in my experience.
2) Build a custom Javascript implementation, where you have an in memory collection and using DOM manipulation add/remove rows of the list. When the user saves the data from memory must be sent using JSON and a VF Remoting method can perform the JSON parsing and saving the rows.
Both are valid, the first is good to avoid boilerplate but the second is much faster (but you need to write some boilerplate).
I have figured out how to add data from a model into a grid like the examples on the learning section of the Agile Toolkit website. But I'm looking for the correct way to show data from a database without a grid.
Say I have a news database and I want to display it as a blog style news on my home page. Can someone point me to where to begin?
Trying to make this a little more clear:
I want to display data from multiple columns from a table news. So I would need to know how to get the title, date, author, content and then repeat that for say 5 latest news articles.
try this:
$this->add('View',null,null,array('view/mytemplate'))
->setModel('MyModel')
->loadData(123);
then inside templates/defaults/view/mytemplate.html
<div><h2><?$title?></h2>
<p><?$content?></p>
</div>
You can also use it with any view, even page.
$data=$model->get();
$page->template->set($data);
you can re-define template for your page by defining defaultTemplate function
function defaultTemplate(){
return array('page/mypage');
}