0

I have been building a django app for creating static pages without any ajax requests. However I would like to build a dynamic subpage that would change its content without page refresh/reload. I will try to outline what I am trying to accomplish and I hope someone can point me to the right direction.
This is my page:
enter image description here Basicly I would like to suggest stock replacement to users. Page suggests to sell stock symbol SRCE and buy symbol XOM. In table I add some extra data, like dividend yield, payout ratio, ...
Now what I want to implement is, by clicking on "I don't want to sell SRCE", I want to replace stock SRCE with another stock from my sell list. By clicking "I don't want to buy XOM" I want to replace XOM with another stock in my buy list.
I could simply create new urls and pages for that, but because I only want to change data in table and symbol name (also graph data, but I'll deal with it later) I think it would be easier if page would not reload. Stock and its data would be replaced dynamically through js/jquery?
I am sorry for long post, here comes my question. How do I do that?
I thought angular.js was the way to go, but after watching a few videos I think its too complex for such an easy task. Should I use raw ajax/jquery?
I guess data for both sell and buy list should be in json format. How do I make json data to be shown in page and replaced dynamically?

Lucas03
  • 2,267
  • 2
  • 32
  • 60

1 Answers1

2

Yes JavaScript is what u need for it. You don't really need a JS-Library for this but JQuery makes things way easier.

You can avoid using Ajax by loading all stock data while the page is loading and write it into e.g. a JavaScript-Array. Then just replace the data in the table by using the loaded data from the Array when the button is clicked. This maybe makes your page load slow at the start but guarantees fast interaction after it has finfished loading. Using Ajax (accessing a pythong script which loads single data from the data base and responds with it to your browser) maybe cause longer loading time when changing the stock proposal in case the user clicks the "I dont want to buy"-button.

For how to parse Json-Data you can e.g. read this article: Parse JSON in JavaScript?

Community
  • 1
  • 1
Benjamin
  • 1,067
  • 20
  • 30