HTML within JSON
I know its not the done thing and should be avoided so hopefully someone can give me some tips here.
I am running server side checks which return JSON. The server returns a code to determine what type of MessageBox to show (0: YESNO, 1:OK etc.,).
Dependent on the server query, I want to prompt the user within msg.show to display data which can be formatted in different ways, it could be a simple line of text or it could be more complex, I don’t know up front.
The way I had done this in the past was simply to use an AJAX call and render the response which was formatted with HTML (allowing me to construct complex tables and master/detail tables) and render the HTML within a div with overflow:auto.
I want to use JSON which provides a good construct for other aspects like success/fail, my problem is that the data is returned but the overflow is not working, the messagebox increases in height beyond the screen and screws up the whole screen layout.
I know I am not using this correctly and wondered if there was either:
a) a preferred method for structuring data returned to display
b) a way of encoding the HTML to allow it to be passed within the JSON
I am really looking for any pointers to the most suitable method of approaching this.
Sample JSON (could be hundreds of rows):
({
'success': 'true',
'msgType': '1',
'msg': '<b>The following will be deleted if you continue: </B><table class="x-grid3-body"><tr class="x-grid3-header"><th class="x-grid3-hd-inner" style="width:60px;">Site</Th><th class="x-grid3-hd-inner">Site Name</th></tr><tr><td colspan="2"><div style="overflow:auto; height: 300;"><table><tr class="x-grid3-locked"><td class="x-grid3-hd-inner" style="width:30px;"><b>1936</b></td><td class="x-grid3-hd-inner"><b>Entity Name</b></td></tr><tr><td></td><td><table><tr class="x-grid3-header"><td class="x-grid3-hd-inner">ID</td><td class="x-grid3-hd-inner">First Name</td><td class="x-grid3-hd-inner">Last Name</td><td class="x-grid3-hd-inner">DOB</td></tr><tr class="x-grid3-locked"><td class="x-grid3-hd-inner">15145</td><td class="x-grid3-hd-inner">John</td><td class="x-grid3-hd-inner">Smith</td><td class="x-grid3-hd-inner">01\u002F06\u002F1931</td><td class="x-grid3-hd-inner" align="right"></td></tr></table></td></tr></table></div></td></tr></table>'
})
