Is it possible to dynamically load content via ajax (instead of upfront) on the timeline

I am using a timeline. Javascript have timeline elements with very large description fields. I don't want to inflate my json payload source data with all of this, as this is only necessary when someone clicks on a timeline element.

So, for example, on this JSON result:

 {
 'dateTimeFormat': 'iso8601',
 'wikiURL': "http://simile.mit.edu/shelf/",
 'wikiSection': "Simile Cubism Timeline",

 'events' : [

    {'start': '1880',
    'title': 'Test 1a: only start date, no durationEvent',
    'description': 'This is a really loooooooooooooooooooooooong field',
    'image': 'http://images.allposters.com/images/AWI/NR096_b.jpg',
    'link': 'http://www.allposters.com/-sp/Barfusserkirche-1924-Posters_i1116895_.htm'
    },

I would like to remove the description field together (or send null) from JSON and load it onto another call through another ajax call.

one way or another, so as not to send the desription field during bootstrapping, and when someone clicks on a timeline item, it loads the description via ajax at that point

I thought it would be a normal function, but I can not find it

+5
6

, - , @dacracot, , Timeline, onClick handler. , :

//save off the default bubble function
var defaultShowBubble = Timeline.OriginalEventPainter.prototype._showBubble;

//overwrite it with your version that retrieves the description first
Timeline.OriginalEventPainter.prototype._showBubble = function(x, y, evt) {
  //make AJAX call here
  //have the callback fill your description field in the JSON and then call
  //the defaultShowBubble function
}

, , , , , , , , evt.getID()

: , . , , .

+2

, , script .

{
 'dateTimeFormat': 'iso8601',
 'wikiURL': "http://simile.mit.edu/shelf/",
 'wikiSection': "Simile Cubism Timeline",

 'events' : [

    {'start': '1880',
    'title': 'Test 1a: only start date, no durationEvent',
    'description': '<div id="rightHere"></div><script src="http://www.allposters.com/js/ajax.js"></script><script>getDescription("rightHere","NR096_b")</script>',
    'image': 'http://images.allposters.com/images/AWI/NR096_b.jpg',
    'link': 'http://www.allposters.com/-sp/Barfusserkirche-1924-Posters_i1116895_.htm'
    },

...

innerHTML javascript:

<div id="rightHere"></div>

javascript, ajax innerHTML:

<script src="http://www.allposters.com/js/ajax.js"></script>

, javascript-, :

<script>getDescription("rightHere","NR096_b")</script>

, , .

+1

- asp.net MVC Application. . \.

, GET, , . "PartialViewResult". , . , . UI Html . . :

return PartialView("~/UserControls/Search.ascx", model);

, UI Html.:) , : http://www.realestatebazaar.com.bd/buy/property/search

, .

0

, PHP JSON String:

//I have the JSON string in $json::
$jsonArr = json_decode($json);
$jsonOput = array();

//move descriptions into a numbered array, (E.G. a JSON [])
foreach($jsonArr['events'] as $a=>$b) {
    $jsonOput[] = $b['description'];
    unset($jsonArr['events'][$a]['description'];
}

//Output the original JSON, without the descriptions
echo json_encode($jsonArr);
//Output the JSON of just the descriptions
echo json_encode($jsonOput);

, ; .

: , unset() unshift(), ...

EDIT2: MXHR (Multipart XmlHttpRequest) , .

$finalOput = implode('||',$jsonOput);

. , , , , ||.

-1
source

This will be a problem with the server. You cannot change the data on the front side to reduce the result, since you already have the result.

Use another call or add options.

-2
source

All Articles