Well, I just found out the previous version uses the variable name *hot* to
refer to the table in the callback function, which might not work for you
because you are likely to have a different variable name for your table. A
better solution is to use *this* to refer to the table that has just been
changed. This is the better version.
afterChange: function(change,source){
if ( source == 'loadData' ) return;
// Find the tiddler containing this table.
var tiddler = store.getTiddler(
story.findContainingTiddler(this.container).getAttribute("tiddler")
);
// Get the tiddler text.
var text = tiddler.text;
// Find the start and end of table data.
// First, we find the variable name for the table data, assuming it
exists.
var p1 = text.indexOf('Handsontable');
p1 = text.indexOf('data',p1);
p1 = text.indexOf(':',p1);
var p2 = text.indexOf(',',p1);
var dataname = text.substring(p1+1,p2).trim();
// Then we look for the beginning of data definition,
p1 = text.indexOf('var');
p1 = text.indexOf(dataname,p1+1)+dataname.length;
// and the end of data definition.
p2 = text.indexOf('];',p1)+2;
// Convert the modified data into the defining string.
var data = this.getData();
var txtdata = ' = [\n';
for ( var r=0, rlen=data.length-this.getSettings().minSpareRows; r<rlen;
r++ ){
txtdata += '[';
for ( var c=0,clen=data[r].length; c<clen; c++ ){
var wrap = typeof data[r][c] == 'string' ? '"' : '';
txtdata += wrap+data[r][c]+wrap+(c<clen-1?', ':'');
}
txtdata +=']' + (r<rlen-1?',':'') + '\n';
}
txtdata += '];'
// Replace the original definition string with the modified one.
text = text.substring(0,p1)+txtdata+text.substring(p2);
// Set it back to the tiddler,
tiddler.set(
tiddler.title,text,tiddler.modifier,new Date()
);
// and mark it as modified.
store.setDirty(true);
}
Have fun!
Vincent
On Monday, June 22, 2015 at 3:12:42 PM UTC+8, Vincent Yeh wrote:
>
> Hi Nick,
>
> I have written a quick solution for your case. It should work for simple
> cases like yours, but is expected to fail for more complicated ones.
> Anyways, you may want to give it a try.
>
> The only thing you need to do is to give it a callback function as follows:
>
> afterChange: function(change,source){
> if ( source == 'loadData' ) return;
> // Find the tiddler containing this table.
> var tiddler = store.getTiddler(
> story.findContainingTiddler(hot.container).getAttribute("tiddler")
> );
> // Get the tiddler text.
> var text = tiddler.text;
> // Find the start and end of table data.
> // First, we find the variable name for the table data, assuming it
> exists.
> var p1 = text.indexOf('Handsontable');
> p1 = text.indexOf('data',p1);
> p1 = text.indexOf(':',p1);
> var p2 = text.indexOf(',',p1);
> var dataname = text.substring(p1+1,p2).trim();
> // Then we look for the beginning of data definition,
> p1 = text.indexOf('var');
> p1 = text.indexOf(dataname,p1+1)+dataname.length;
> // and the end of data definition.
> p2 = text.indexOf('];',p1)+2;
> // Convert the modified data into the defining string.
> var data = hot.getData();
> var txtdata = ' = [\n';
> for ( var r=0, rlen=data.length-hot.getSettings().minSpareRows; r<rlen
> ; r++ ){
> txtdata += '[';
> for ( var c=0,clen=data[r].length; c<clen; c++ ){
> var wrap = typeof data[r][c] == 'string' ? '"' : '';
> txtdata += wrap+data[r][c]+wrap+(c<clen-1?', ':'');
> }
> txtdata +=']' + (r<rlen-1?',':'') + '\n';
> }
> txtdata += '];'
> // Replace the original definition string with the modified one.
> text = text.substring(0,p1)+txtdata+text.substring(p2);
> // Set it back to the tiddler,
> tiddler.set(
> tiddler.title,text,tiddler.modifier,new Date()
> );
> // and mark it as modified.
> store.setDirty(true);
> }
>
>
> Once you assign this function to the *afterChange* property of the
> options upon calling the *new Handsontable()*
> constructor, each time you change the content of a cell the wiki text in
> that tiddler is changed accordingly.
>
> Again this quick solution only works for simple cases. Much more work is
> needed for complicated ones.
>
> Have fun!
> Vincent
>
> On Sunday, May 3, 2015 at 3:24:00 PM UTC+8, Vincent Yeh wrote:
>>
>> Hi Nick,
>>
>> It's pity that I did not see this post until today and did not know about
>> the Handsontable. I would love to use Handsontable myself, too!
>>
>> As to your problem, their webpage says the Handsontable binds a table to
>> some data source that you provide, and the data you provide is changed as
>> you change the table. That means your data in computer memory was actually
>> changed. *What you are missing is only one thing: to set the modified
>> data back to the tiddler text, before saving the tiddler.* I think its
>> worth making a plugin for that!
>>
>> Ton, thanks a lot for introducing my works! I am still struggling to
>> understand the TW5 plugin mechanism...
>>
>> Have fun!
>> Vincent
>>
>> On Monday, December 22, 2014 at 10:03:30 PM UTC+8, [email protected]
>> wrote:
>>>
>>> Ton
>>>
>>> Thanks for your reply. I've experimented with the tw ted inline editor
>>> for tiddlywiki tables but didn't find it as tidy as the the handsontable
>>> editor. Are you suggesting using this approach or that the twted plugin
>>> could be used to enable the handsontable editor making changes in view
>>> mode?
>>>
>>> Thanks again for your quick reply
>>>
>>> Nick
>>
>>
--
You received this message because you are subscribed to the Google Groups
"TiddlyWikiDev" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/tiddlywikidev.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywikidev/086b94e6-0a10-412d-9bf2-8f90032bd2a0%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
